/* /Pages/AuditLogs.razor.rz.scp.css */
/* =========================================================
   PAGE
========================================================= */

.audit-page[b-unj43iwlwy] {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    padding: 34px 34px 72px;
    box-sizing: border-box;
    color: #182033;
}


/* =========================================================
   LOADING / ERROR / ACCESS
========================================================= */

.page-loading[b-unj43iwlwy] {
    min-height: 420px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #667085;
}

.page-loading > div:last-child[b-unj43iwlwy] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.page-loading strong[b-unj43iwlwy] {
    color: #263044;
    font-size: 15px;
}

.page-loading span[b-unj43iwlwy] {
    color: #7c8798;
    font-size: 13px;
}

.loading-spinner[b-unj43iwlwy],
.button-spinner[b-unj43iwlwy] {
    border-radius: 50%;
    border-style: solid;
    border-right-color: transparent;
    animation: audit-spin-b-unj43iwlwy .7s linear infinite;
}

.loading-spinner[b-unj43iwlwy] {
    width: 31px;
    height: 31px;
    border-width: 3px;
    border-color: #e5e8f0;
    border-top-color: #6472d8;
}

.button-spinner[b-unj43iwlwy] {
    width: 13px;
    height: 13px;
    border-width: 2px;
    border-color: currentColor;
    border-right-color: transparent;
}

@keyframes audit-spin-b-unj43iwlwy {
    to {
        transform: rotate(360deg);
    }
}

.page-error[b-unj43iwlwy] {
    margin-bottom: 20px;
    padding: 15px 17px;
    display: flex;
    align-items: flex-start;
    gap: 11px;
    border: 1px solid #efcccc;
    border-radius: 12px;
    background: #fff5f5;
    color: #943c3c;
}

.page-error-icon[b-unj43iwlwy] {
    width: 28px;
    height: 28px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #f8dada;
    color: #b33838;
    font-size: 12px;
    font-weight: 850;
}

.page-error > div:last-child[b-unj43iwlwy] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.page-error strong[b-unj43iwlwy] {
    font-size: 14px;
}

.page-error span[b-unj43iwlwy] {
    font-size: 13px;
    line-height: 1.5;
}

.access-denied-card[b-unj43iwlwy] {
    min-height: 480px;
    padding: 48px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 16px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, .025);
}

.access-denied-icon[b-unj43iwlwy] {
    width: 54px;
    height: 54px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #fff2f2;
    color: #af4048;
    font-size: 20px;
    font-weight: 850;
}

.access-denied-card h1[b-unj43iwlwy] {
    margin: 0;
    color: #283144;
    font-size: 22px;
}

.access-denied-card p[b-unj43iwlwy] {
    max-width: 540px;
    margin: 10px 0 0;
    color: #7b8696;
    font-size: 14px;
    line-height: 1.65;
}


/* =========================================================
   HEADER / BUTTONS
========================================================= */

.page-header[b-unj43iwlwy] {
    margin-bottom: 25px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 28px;
}

.eyebrow[b-unj43iwlwy] {
    margin-bottom: 7px;
    color: #6472d8;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .12em;
}

.page-header h1[b-unj43iwlwy] {
    margin: 0;
    color: #172033;
    font-size: 34px;
    line-height: 1.15;
    font-weight: 760;
    letter-spacing: -.035em;
}

.page-header p[b-unj43iwlwy] {
    max-width: 790px;
    margin: 10px 0 0;
    color: #697588;
    font-size: 15px;
    line-height: 1.65;
}

.primary-button[b-unj43iwlwy],
.secondary-button[b-unj43iwlwy],
.text-button[b-unj43iwlwy],
.pagination-button[b-unj43iwlwy],
.view-button[b-unj43iwlwy],
.modal-close[b-unj43iwlwy] {
    font: inherit;
    cursor: pointer;
}

.primary-button[b-unj43iwlwy] {
    min-height: 43px;
    padding: 0 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #202941;
    border-radius: 9px;
    background: #202941;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    transition: .15s ease;
}

.primary-button:hover:not(:disabled)[b-unj43iwlwy] {
    background: #161e30;
    transform: translateY(-1px);
    box-shadow: 0 5px 14px rgba(25, 33, 52, .12);
}

.secondary-button[b-unj43iwlwy] {
    min-height: 41px;
    padding: 0 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #d8dde6;
    border-radius: 9px;
    background: #fff;
    color: #364154;
    font-size: 13px;
    font-weight: 700;
    transition: .15s ease;
}

.secondary-button:hover:not(:disabled)[b-unj43iwlwy] {
    background: #f7f8fa;
    border-color: #c9cfda;
}

.primary-button:disabled[b-unj43iwlwy],
.secondary-button:disabled[b-unj43iwlwy],
.pagination-button:disabled[b-unj43iwlwy],
.text-button:disabled[b-unj43iwlwy] {
    cursor: not-allowed;
    opacity: .6;
}

.refresh-symbol[b-unj43iwlwy] {
    font-size: 17px;
    line-height: 1;
}

.text-button[b-unj43iwlwy] {
    padding: 0;
    border: 0;
    background: transparent;
    color: #5e6bd2;
    font-size: 13px;
    font-weight: 700;
}

.text-button:hover:not(:disabled)[b-unj43iwlwy] {
    text-decoration: underline;
}


/* =========================================================
   SUMMARY
========================================================= */

.summary-grid[b-unj43iwlwy] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.summary-card[b-unj43iwlwy] {
    min-width: 0;
    padding: 19px;
    display: flex;
    align-items: center;
    gap: 14px;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 14px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, .025);
}

.summary-icon[b-unj43iwlwy] {
    width: 44px;
    height: 44px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    font-size: 11px;
    font-weight: 850;
}

.events-summary-icon[b-unj43iwlwy] {
    background: #eef0ff;
    color: #5b68cf;
}

.allowed-summary-icon[b-unj43iwlwy] {
    background: #edf8f2;
    color: #347c59;
}

.blocked-summary-icon[b-unj43iwlwy] {
    background: #fff0f1;
    color: #a54650;
}

.latency-summary-icon[b-unj43iwlwy] {
    background: #fff4e8;
    color: #9c652c;
}

.summary-card > div:last-child[b-unj43iwlwy] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.summary-label[b-unj43iwlwy] {
    margin-bottom: 3px;
    color: #6e798b;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .055em;
}

.summary-card strong[b-unj43iwlwy] {
    color: #1c2435;
    font-size: 24px;
    line-height: 1.05;
    letter-spacing: -.025em;
}

.summary-card small[b-unj43iwlwy] {
    margin-top: 5px;
    color: #7f8998;
    font-size: 11px;
}


/* =========================================================
   PANEL / FILTERS
========================================================= */

.audit-panel[b-unj43iwlwy] {
    overflow: hidden;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, .025);
}

.panel-header[b-unj43iwlwy] {
    min-height: 77px;
    padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 1px solid #edf0f4;
}

.panel-header h2[b-unj43iwlwy] {
    margin: 0;
    color: #20283a;
    font-size: 16px;
    font-weight: 750;
}

.panel-header p[b-unj43iwlwy] {
    margin: 5px 0 0;
    color: #7d8796;
    font-size: 12px;
}

.filter-bar[b-unj43iwlwy] {
    padding: 14px 20px;
    display: grid;
    grid-template-columns: minmax(280px, 1fr) 150px 150px 170px auto;
    gap: 9px;
    align-items: center;
    background: #fafbfc;
    border-bottom: 1px solid #edf0f4;
}

.search-box[b-unj43iwlwy] {
    min-width: 0;
    height: 41px;
    padding: 0 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #d7dde6;
    border-radius: 9px;
    background: #fff;
}

.search-box:focus-within[b-unj43iwlwy] {
    border-color: #6a77d9;
    box-shadow: 0 0 0 3px rgba(105, 118, 217, .09);
}

.search-box svg[b-unj43iwlwy] {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    fill: none;
    stroke: #7f8a9a;
    stroke-width: 1.8;
    stroke-linecap: round;
}

.search-box input[b-unj43iwlwy] {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: #263044;
    font: inherit;
    font-size: 13px;
}

.search-box input[b-unj43iwlwy]::placeholder {
    color: #9aa3b0;
}

.filter-select[b-unj43iwlwy] {
    width: 100%;
    height: 41px;
    padding: 0 31px 0 11px;
    border: 1px solid #d7dde6;
    border-radius: 9px;
    outline: none;
    background: #fff;
    color: #414c5e;
    font: inherit;
    font-size: 13px;
}

.filter-select:focus[b-unj43iwlwy] {
    border-color: #6a77d9;
    box-shadow: 0 0 0 3px rgba(105, 118, 217, .09);
}

.search-button[b-unj43iwlwy] {
    min-width: 83px;
}


/* =========================================================
   TABLE
========================================================= */

.audit-table-wrap[b-unj43iwlwy] {
    width: 100%;
    overflow-x: auto;
}

.audit-table[b-unj43iwlwy] {
    width: 100%;
    min-width: 1220px;
    border-collapse: collapse;
}

.audit-table th[b-unj43iwlwy] {
    padding: 11px 13px;
    text-align: left;
    border-bottom: 1px solid #e5e9ef;
    background: #fcfcfd;
    color: #697587;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .045em;
    text-transform: uppercase;
    white-space: nowrap;
}

.audit-table td[b-unj43iwlwy] {
    padding: 13px;
    border-bottom: 1px solid #eef1f4;
    color: #4c5768;
    font-size: 12px;
    vertical-align: middle;
}

.audit-table tbody tr:hover[b-unj43iwlwy] {
    background: #fbfcfd;
}

.audit-table tbody tr:last-child td[b-unj43iwlwy] {
    border-bottom: 0;
}

.decision-pill[b-unj43iwlwy] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 750;
    white-space: nowrap;
}

.decision-dot[b-unj43iwlwy] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
}

.decision-pill.allowed[b-unj43iwlwy] {
    background: #eaf7ef;
    color: #2f7651;
}

.decision-pill.blocked[b-unj43iwlwy] {
    background: #fff0f1;
    color: #a1444e;
}

.decision-pill.unknown[b-unj43iwlwy] {
    background: #f1f3f6;
    color: #6f7a8b;
}

.time-cell[b-unj43iwlwy],
.user-cell[b-unj43iwlwy],
.event-cell[b-unj43iwlwy],
.context-cell[b-unj43iwlwy] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.time-cell strong[b-unj43iwlwy],
.user-cell strong[b-unj43iwlwy],
.event-cell strong[b-unj43iwlwy],
.context-cell strong[b-unj43iwlwy] {
    color: #354052;
    font-size: 12px;
    font-weight: 700;
}

.time-cell span[b-unj43iwlwy],
.user-cell span[b-unj43iwlwy],
.event-cell span[b-unj43iwlwy],
.context-cell span[b-unj43iwlwy] {
    color: #7f8998;
    font-size: 11px;
}

.user-cell[b-unj43iwlwy] {
    max-width: 210px;
}

.user-cell strong[b-unj43iwlwy],
.user-cell span[b-unj43iwlwy] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.event-cell[b-unj43iwlwy] {
    max-width: 330px;
}

.event-cell strong[b-unj43iwlwy],
.event-cell span[b-unj43iwlwy] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.blocked-preview[b-unj43iwlwy] {
    color: #a14a51 !important;
}

.context-cell[b-unj43iwlwy] {
    max-width: 180px;
}

.context-cell strong[b-unj43iwlwy],
.context-cell span[b-unj43iwlwy] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tool-badge[b-unj43iwlwy] {
    display: inline-flex;
    max-width: 160px;
    padding: 5px 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-radius: 7px;
    background: #f1f3f7;
    color: #566174;
    font-size: 11px;
    font-weight: 700;
}

.muted-value[b-unj43iwlwy] {
    color: #a0a8b4;
}

.numeric-cell[b-unj43iwlwy] {
    color: #5a6576 !important;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.action-cell[b-unj43iwlwy] {
    text-align: right;
}

.view-button[b-unj43iwlwy] {
    padding: 0;
    border: 0;
    background: transparent;
    color: #5e6bd2;
    font-size: 12px;
    font-weight: 750;
}

.view-button:hover[b-unj43iwlwy] {
    text-decoration: underline;
}


/* =========================================================
   EMPTY / PAGINATION
========================================================= */

.empty-state[b-unj43iwlwy] {
    padding: 68px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.empty-icon[b-unj43iwlwy] {
    width: 50px;
    height: 50px;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    background: #f0f2f7;
    color: #596477;
    font-size: 11px;
    font-weight: 850;
}

.empty-state h3[b-unj43iwlwy] {
    margin: 0;
    color: #283144;
    font-size: 16px;
}

.empty-state p[b-unj43iwlwy] {
    max-width: 470px;
    margin: 8px 0 0;
    color: #7c8797;
    font-size: 13px;
    line-height: 1.6;
}

.pagination-bar[b-unj43iwlwy] {
    min-height: 64px;
    padding: 12px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-top: 1px solid #edf0f4;
    background: #fafbfc;
    color: #707b8c;
    font-size: 12px;
}

.pagination-actions[b-unj43iwlwy] {
    display: flex;
    gap: 8px;
}

.pagination-button[b-unj43iwlwy] {
    min-height: 36px;
    padding: 0 12px;
    border: 1px solid #d8dde6;
    border-radius: 8px;
    background: #fff;
    color: #465164;
    font-size: 12px;
    font-weight: 700;
}

.pagination-button:hover:not(:disabled)[b-unj43iwlwy] {
    background: #f5f6f8;
}


/* =========================================================
   DETAIL MODAL
========================================================= */

.modal-backdrop[b-unj43iwlwy] {
    position: fixed;
    inset: 0;
    z-index: 1000;
    padding: 28px 18px;
    overflow-y: auto;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    background: rgba(15, 23, 42, .54);
}

.audit-modal[b-unj43iwlwy] {
    width: min(920px, 100%);
    margin: auto;
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 18px;
    box-shadow: 0 30px 90px rgba(15, 23, 42, .24);
}

.modal-header[b-unj43iwlwy] {
    padding: 22px 24px 19px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid #edf0f4;
}

.modal-title-row[b-unj43iwlwy] {
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.audit-id[b-unj43iwlwy] {
    color: #7d8797;
    font-size: 12px;
    font-weight: 700;
}

.modal-header h2[b-unj43iwlwy] {
    margin: 0;
    color: #182033;
    font-size: 21px;
    font-weight: 760;
    letter-spacing: -.02em;
}

.modal-header p[b-unj43iwlwy] {
    margin: 6px 0 0;
    color: #7d8797;
    font-size: 12px;
}

.modal-close[b-unj43iwlwy] {
    width: 35px;
    height: 35px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e1e5eb;
    border-radius: 9px;
    background: #fff;
    color: #667085;
    font-size: 15px;
    font-weight: 750;
}

.modal-close:hover[b-unj43iwlwy] {
    background: #f6f7f9;
}

.modal-body[b-unj43iwlwy] {
    padding: 22px 24px 25px;
}

.detail-grid[b-unj43iwlwy] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.detail-item[b-unj43iwlwy] {
    min-width: 0;
    padding: 13px 14px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    border: 1px solid #e7eaf0;
    border-radius: 10px;
    background: #fafbfc;
}

.detail-item > span[b-unj43iwlwy] {
    color: #7b8595;
    font-size: 10px;
    font-weight: 750;
    letter-spacing: .045em;
    text-transform: uppercase;
}

.detail-item strong[b-unj43iwlwy] {
    overflow-wrap: anywhere;
    color: #3b4557;
    font-size: 13px;
    font-weight: 700;
}

.detail-item small[b-unj43iwlwy] {
    overflow-wrap: anywhere;
    color: #8993a2;
    font-size: 11px;
}

.detail-section[b-unj43iwlwy] {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #edf0f4;
}

.detail-section-heading[b-unj43iwlwy] {
    margin-bottom: 10px;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.detail-section-heading strong[b-unj43iwlwy] {
    color: #374154;
    font-size: 13px;
}

.detail-section-heading span[b-unj43iwlwy] {
    color: #818b9a;
    font-size: 11px;
}

.blocked-section[b-unj43iwlwy] {
    border-top-color: #f0dadd;
}

.blocked-reason[b-unj43iwlwy] {
    padding: 13px 14px;
    border: 1px solid #efcccc;
    border-radius: 10px;
    background: #fff6f6;
    color: #984048;
    font-size: 12px;
    line-height: 1.6;
    overflow-wrap: anywhere;
}

.detail-code[b-unj43iwlwy] {
    max-height: 320px;
    margin: 0;
    padding: 14px 15px;
    overflow: auto;
    border: 1px solid #e1e5eb;
    border-radius: 10px;
    background: #f8f9fb;
    color: #364154;
    font-family: Consolas, "SFMono-Regular", monospace;
    font-size: 12px;
    line-height: 1.6;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.metadata-code[b-unj43iwlwy] {
    max-height: 380px;
}

.detail-empty[b-unj43iwlwy] {
    padding: 14px;
    border: 1px dashed #dce1e9;
    border-radius: 10px;
    color: #8a94a3;
    font-size: 12px;
    text-align: center;
}

.modal-footer[b-unj43iwlwy] {
    padding: 15px 24px;
    display: flex;
    justify-content: flex-end;
    background: #fafbfc;
    border-top: 1px solid #e9edf2;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1180px) {
    .summary-grid[b-unj43iwlwy] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .filter-bar[b-unj43iwlwy] {
        grid-template-columns: minmax(260px, 1fr) repeat(2, 150px);
    }

    .tool-filter[b-unj43iwlwy],
    .search-button[b-unj43iwlwy] {
        grid-row: 2;
    }

    .tool-filter[b-unj43iwlwy] {
        grid-column: 1 / 3;
    }

    .search-button[b-unj43iwlwy] {
        grid-column: 3;
    }
}

@media (max-width: 800px) {
    .audit-page[b-unj43iwlwy] {
        padding: 26px 18px 60px;
    }

    .page-header[b-unj43iwlwy] {
        flex-direction: column;
    }

    .refresh-button[b-unj43iwlwy] {
        width: 100%;
    }

    .panel-header[b-unj43iwlwy] {
        align-items: flex-start;
    }

    .filter-bar[b-unj43iwlwy] {
        grid-template-columns: 1fr 1fr;
    }

    .search-box[b-unj43iwlwy] {
        grid-column: 1 / -1;
    }

    .tool-filter[b-unj43iwlwy] {
        grid-column: 1;
        grid-row: auto;
    }

    .search-button[b-unj43iwlwy] {
        grid-column: 2;
        grid-row: auto;
    }

    .detail-grid[b-unj43iwlwy] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .audit-page[b-unj43iwlwy] {
        padding: 22px 14px 50px;
    }

    .summary-grid[b-unj43iwlwy],
    .filter-bar[b-unj43iwlwy],
    .detail-grid[b-unj43iwlwy] {
        grid-template-columns: 1fr;
    }

    .tool-filter[b-unj43iwlwy],
    .search-button[b-unj43iwlwy],
    .search-box[b-unj43iwlwy] {
        grid-column: 1;
    }

    .panel-header[b-unj43iwlwy],
    .pagination-bar[b-unj43iwlwy] {
        align-items: stretch;
        flex-direction: column;
    }

    .pagination-actions[b-unj43iwlwy] {
        width: 100%;
    }

    .pagination-button[b-unj43iwlwy] {
        flex: 1;
    }

    .modal-backdrop[b-unj43iwlwy] {
        padding: 12px;
    }

    .audit-modal[b-unj43iwlwy] {
        border-radius: 14px;
    }

    .modal-header[b-unj43iwlwy],
    .modal-body[b-unj43iwlwy],
    .modal-footer[b-unj43iwlwy] {
        padding-left: 17px;
        padding-right: 17px;
    }

    .modal-footer .secondary-button[b-unj43iwlwy] {
        width: 100%;
    }
}
/* /Pages/Databases.razor.rz.scp.css */
/* =========================================================
   PAGE
========================================================= */

.databases-page[b-cfjf9hn9sf] {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    padding: 34px 34px 72px;
    box-sizing: border-box;
    color: #182033;
}


/* =========================================================
   LOADING / ERRORS / MESSAGES
========================================================= */

.page-loading[b-cfjf9hn9sf] {
    min-height: 420px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #667085;
}

    .page-loading > div:last-child[b-cfjf9hn9sf] {
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .page-loading strong[b-cfjf9hn9sf] {
        color: #263044;
        font-size: 16px;
    }

    .page-loading span[b-cfjf9hn9sf] {
        color: #8c95a5;
        font-size: 14px;
    }

.loading-spinner[b-cfjf9hn9sf],
.button-spinner[b-cfjf9hn9sf] {
    border-radius: 50%;
    border-style: solid;
    border-right-color: transparent;
    animation: spin-b-cfjf9hn9sf .7s linear infinite;
}

.loading-spinner[b-cfjf9hn9sf] {
    width: 30px;
    height: 30px;
    border-width: 3px;
    border-color: #e5e8f0;
    border-top-color: #6472d8;
}

.button-spinner[b-cfjf9hn9sf] {
    width: 13px;
    height: 13px;
    border-width: 2px;
    border-color: currentColor;
    border-right-color: transparent;
}

@keyframes spin-b-cfjf9hn9sf {
    to {
        transform: rotate(360deg);
    }
}

.page-error[b-cfjf9hn9sf],
.page-message[b-cfjf9hn9sf] {
    margin-bottom: 20px;
    padding: 14px 16px;
    display: flex;
    align-items: flex-start;
    gap: 11px;
    border-radius: 12px;
}

.page-error[b-cfjf9hn9sf] {
    background: #fff5f5;
    border: 1px solid #efcccc;
    color: #943c3c;
}

.page-message[b-cfjf9hn9sf] {
    background: #f0faf4;
    border: 1px solid #c8ead3;
    color: #347251;
}

.page-error-icon[b-cfjf9hn9sf],
.page-message-icon[b-cfjf9hn9sf] {
    width: 27px;
    height: 27px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 14px;
    font-weight: 850;
}

.page-error-icon[b-cfjf9hn9sf] {
    background: #f8dada;
    color: #b33838;
}

.page-message-icon[b-cfjf9hn9sf] {
    background: #d8f3e1;
    color: #257946;
}

.page-error > div:last-child[b-cfjf9hn9sf] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.page-error strong[b-cfjf9hn9sf] {
    font-size: 15px;
}

.page-error span[b-cfjf9hn9sf],
.page-message span[b-cfjf9hn9sf] {
    font-size: 14px;
    line-height: 1.5;
}


/* =========================================================
   HEADER
========================================================= */

.page-header[b-cfjf9hn9sf] {
    margin-bottom: 25px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 28px;
}

.eyebrow[b-cfjf9hn9sf] {
    margin-bottom: 7px;
    color: #6472d8;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .13em;
}

.page-header h1[b-cfjf9hn9sf] {
    margin: 0;
    color: #172033;
    font-size: 34px;
    line-height: 1.15;
    font-weight: 760;
    letter-spacing: -.035em;
}

.page-header p[b-cfjf9hn9sf] {
    max-width: 680px;
    margin: 10px 0 0;
    color: #768093;
    font-size: 16px;
    line-height: 1.65;
}


/* =========================================================
   BUTTONS
========================================================= */

.primary-button[b-cfjf9hn9sf],
.secondary-button[b-cfjf9hn9sf],
.details-button[b-cfjf9hn9sf],
.modal-close[b-cfjf9hn9sf] {
    font: inherit;
    cursor: pointer;
}

.primary-button[b-cfjf9hn9sf] {
    min-height: 43px;
    padding: 0 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #202941;
    border-radius: 9px;
    background: #202941;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    transition: .15s ease;
}

    .primary-button:hover:not(:disabled)[b-cfjf9hn9sf] {
        background: #161e30;
        transform: translateY(-1px);
        box-shadow: 0 5px 14px rgba(25, 33, 52, .12);
    }

.secondary-button[b-cfjf9hn9sf] {
    min-height: 41px;
    padding: 0 15px;
    border: 1px solid #d8dde6;
    border-radius: 9px;
    background: #fff;
    color: #364154;
    font-size: 14px;
    font-weight: 700;
    transition: .15s ease;
}

    .secondary-button:hover:not(:disabled)[b-cfjf9hn9sf] {
        background: #f7f8fa;
        border-color: #c9cfda;
    }

    .primary-button:disabled[b-cfjf9hn9sf],
    .secondary-button:disabled[b-cfjf9hn9sf],
    .modal-close:disabled[b-cfjf9hn9sf] {
        cursor: not-allowed;
        opacity: .6;
    }

.button-plus[b-cfjf9hn9sf] {
    font-size: 20px;
    line-height: 1;
    font-weight: 500;
}


/* =========================================================
   SUMMARY
========================================================= */

.summary-grid[b-cfjf9hn9sf] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.summary-card[b-cfjf9hn9sf] {
    min-width: 0;
    padding: 19px;
    display: flex;
    align-items: center;
    gap: 14px;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 14px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, .025);
}

.summary-icon[b-cfjf9hn9sf] {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    font-size: 13px;
    font-weight: 850;
}

.database-summary-icon[b-cfjf9hn9sf] {
    background: #eef0ff;
    color: #5b68cf;
}

.table-summary-icon[b-cfjf9hn9sf] {
    background: #edf8f2;
    color: #347c59;
}

.view-summary-icon[b-cfjf9hn9sf] {
    background: #f4effd;
    color: #7550b2;
}

.column-summary-icon[b-cfjf9hn9sf] {
    background: #fff4e8;
    color: #9c652c;
}

.summary-card > div:last-child[b-cfjf9hn9sf] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.summary-label[b-cfjf9hn9sf] {
    margin-bottom: 3px;
    color: #7a8494;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .055em;
}

.summary-card strong[b-cfjf9hn9sf] {
    color: #1c2435;
    font-size: 25px;
    line-height: 1.05;
    letter-spacing: -.025em;
}

.summary-card small[b-cfjf9hn9sf] {
    margin-top: 5px;
    color: #969eab;
    font-size: 13px;
}


/* =========================================================
   MAIN PANEL
========================================================= */

.database-panel[b-cfjf9hn9sf] {
    overflow: hidden;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, .025);
}

.panel-header[b-cfjf9hn9sf] {
    min-height: 76px;
    padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 1px solid #edf0f4;
}

    .panel-header h2[b-cfjf9hn9sf] {
        margin: 0;
        color: #20283a;
        font-size: 17px;
        font-weight: 750;
    }

    .panel-header p[b-cfjf9hn9sf] {
        margin: 4px 0 0;
        color: #8a93a2;
        font-size: 14px;
    }

.toolbar[b-cfjf9hn9sf] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.search-box[b-cfjf9hn9sf] {
    width: 245px;
    height: 39px;
    padding: 0 11px;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #dce1e9;
    border-radius: 9px;
    background: #fff;
}

    .search-box:focus-within[b-cfjf9hn9sf] {
        border-color: #6a77d9;
        box-shadow: 0 0 0 3px rgba(105, 118, 217, .09);
    }

    .search-box svg[b-cfjf9hn9sf] {
        width: 15px;
        height: 15px;
        flex: 0 0 auto;
        fill: none;
        stroke: #8993a3;
        stroke-width: 1.8;
        stroke-linecap: round;
    }

    .search-box input[b-cfjf9hn9sf] {
        width: 100%;
        min-width: 0;
        border: 0;
        outline: 0;
        background: transparent;
        color: #263044;
        font: inherit;
        font-size: 14px;
    }

        .search-box input[b-cfjf9hn9sf]::placeholder {
            color: #a1a8b4;
        }

.provider-filter[b-cfjf9hn9sf] {
    height: 39px;
    padding: 0 31px 0 11px;
    border: 1px solid #dce1e9;
    border-radius: 9px;
    outline: none;
    background: #fff;
    color: #4b5669;
    font: inherit;
    font-size: 14px;
}


/* =========================================================
   DATABASE CARDS
========================================================= */

.database-list[b-cfjf9hn9sf] {
    display: flex;
    flex-direction: column;
}

.database-card[b-cfjf9hn9sf] {
    border-bottom: 1px solid #edf0f4;
    transition: background .14s ease;
}

    .database-card:last-child[b-cfjf9hn9sf] {
        border-bottom: 0;
    }

    .database-card:hover[b-cfjf9hn9sf] {
        background: #fdfdfe;
    }

.database-main[b-cfjf9hn9sf] {
    min-height: 91px;
    padding: 17px 20px;
    display: grid;
    grid-template-columns: 44px minmax(220px, 1fr) auto auto;
    align-items: center;
    gap: 14px;
}

.provider-mark[b-cfjf9hn9sf] {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    background: #f0f2f7;
    color: #566174;
    font-size: 13px;
    font-weight: 850;
}

.database-identity[b-cfjf9hn9sf] {
    min-width: 0;
}

.database-title-row[b-cfjf9hn9sf] {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}

    .database-title-row h3[b-cfjf9hn9sf] {
        min-width: 0;
        margin: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: #273043;
        font-size: 15px;
        font-weight: 750;
    }

.connected-badge[b-cfjf9hn9sf] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #397659;
    font-size: 12px;
    font-weight: 750;
}

.status-dot[b-cfjf9hn9sf] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #4caf78;
    box-shadow: 0 0 0 3px rgba(76, 175, 120, .12);
}

.database-subtitle[b-cfjf9hn9sf] {
    min-width: 0;
    margin-top: 5px;
    display: flex;
    align-items: center;
    gap: 5px;
    color: #929aa8;
    font-size: 13px;
}

    .database-subtitle span[b-cfjf9hn9sf] {
        max-width: 220px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.separator[b-cfjf9hn9sf] {
    flex: 0 0 auto;
    color: #c2c7d0;
}

.database-metrics[b-cfjf9hn9sf] {
    display: flex;
    align-items: center;
    gap: 23px;
}

    .database-metrics > div[b-cfjf9hn9sf] {
        min-width: 50px;
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .database-metrics strong[b-cfjf9hn9sf] {
        color: #30394b;
        font-size: 14px;
    }

    .database-metrics span[b-cfjf9hn9sf] {
        color: #9aa2af;
        font-size: 12px;
    }

.database-actions[b-cfjf9hn9sf] {
    min-width: 120px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 7px;
}

.last-scan[b-cfjf9hn9sf] {
    display: flex;
    align-items: baseline;
    gap: 5px;
    white-space: nowrap;
}

    .last-scan span[b-cfjf9hn9sf] {
        color: #9aa2af;
        font-size: 12px;
    }

    .last-scan strong[b-cfjf9hn9sf] {
        color: #697386;
        font-size: 12px;
        font-weight: 700;
    }

.details-button[b-cfjf9hn9sf] {
    padding: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 0;
    background: transparent;
    color: #5e6bd2;
    font-size: 13px;
    font-weight: 750;
}

    .details-button:hover[b-cfjf9hn9sf] {
        text-decoration: underline;
    }

.details-chevron[b-cfjf9hn9sf] {
    display: inline-block;
    transition: transform .18s ease;
}

    .details-chevron.expanded[b-cfjf9hn9sf] {
        transform: rotate(180deg);
    }

.database-details[b-cfjf9hn9sf] {
    padding: 16px 20px 18px 78px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 15px 22px;
    background: #fafbfc;
    border-top: 1px solid #eef1f4;
}

.detail-item[b-cfjf9hn9sf] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

    .detail-item span[b-cfjf9hn9sf] {
        color: #969eab;
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: .05em;
        font-weight: 700;
    }

    .detail-item strong[b-cfjf9hn9sf] {
        overflow: hidden;
        text-overflow: ellipsis;
        color: #3d4759;
        font-size: 14px;
        font-weight: 650;
    }

    .detail-item .positive-value[b-cfjf9hn9sf] {
        color: #357a55;
    }


/* =========================================================
   EMPTY STATE
========================================================= */

.empty-state[b-cfjf9hn9sf] {
    padding: 68px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.empty-icon[b-cfjf9hn9sf] {
    width: 49px;
    height: 49px;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    background: #f0f2f7;
    color: #596477;
    font-size: 14px;
    font-weight: 850;
}

.empty-state h3[b-cfjf9hn9sf] {
    margin: 0;
    color: #283144;
    font-size: 16px;
}

.empty-state p[b-cfjf9hn9sf] {
    max-width: 430px;
    margin: 7px 0 18px;
    color: #8c95a4;
    font-size: 14px;
    line-height: 1.6;
}


/* =========================================================
   MODAL
========================================================= */
.modal-backdrop[b-cfjf9hn9sf] {
    position: fixed;
    inset: 0;
    z-index: 1000;
    padding: 30px 18px;
    overflow-y: auto;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    /*
        Do NOT use backdrop-filter here.
        A simple translucent overlay is dramatically cheaper to render.
    */
    background: rgba(15, 23, 42, 0.52);
}

.database-modal[b-cfjf9hn9sf] {
    width: min(760px, 100%);
    margin: auto;
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 18px;
    box-shadow: 0 30px 90px rgba(15, 23, 42, .24);
}

.modal-header[b-cfjf9hn9sf] {
    padding: 23px 25px 19px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid #edf0f4;
}

    .modal-header h2[b-cfjf9hn9sf] {
        margin: 0;
        color: #182033;
        font-size: 23px;
        letter-spacing: -.02em;
    }

    .modal-header p[b-cfjf9hn9sf] {
        margin: 6px 0 0;
        color: #7d8797;
        font-size: 14px;
    }

.modal-close[b-cfjf9hn9sf] {
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e1e5eb;
    border-radius: 9px;
    background: #fff;
    color: #667085;
    font-size: 24px;
    line-height: 1;
}

    .modal-close:hover:not(:disabled)[b-cfjf9hn9sf] {
        background: #f6f7f9;
    }

.modal-body[b-cfjf9hn9sf] {
    padding: 24px 25px;
}

.form-section + .form-section[b-cfjf9hn9sf] {
    margin-top: 27px;
    padding-top: 25px;
    border-top: 1px solid #edf0f4;
}

.form-section-heading[b-cfjf9hn9sf] {
    margin-bottom: 17px;
    display: flex;
    align-items: flex-start;
    gap: 11px;
}

.section-number[b-cfjf9hn9sf] {
    width: 29px;
    height: 29px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #eef0ff;
    color: #5967d8;
    font-size: 14px;
    font-weight: 800;
}

.form-section-heading > div[b-cfjf9hn9sf] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.form-section-heading strong[b-cfjf9hn9sf] {
    color: #343d4f;
    font-size: 15px;
}

.form-section-heading small[b-cfjf9hn9sf] {
    color: #8e97a5;
    font-size: 13px;
}

.provider-grid[b-cfjf9hn9sf] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.provider-card[b-cfjf9hn9sf] {
    appearance: none;
    width: 100%;
    padding: 13px;
    display: grid;
    grid-template-columns: 37px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 11px;
    border: 1px solid #dde2ea;
    border-radius: 11px;
    background: #fff;
    color: inherit;
    text-align: left;
    cursor: pointer;
    transition: .16s ease;
}

    .provider-card:hover[b-cfjf9hn9sf] {
        border-color: #aeb6d9;
    }

    .provider-card.selected[b-cfjf9hn9sf] {
        border-color: #6774db;
        background: #fafaff;
        box-shadow: 0 0 0 3px rgba(103, 116, 219, .08);
    }

.provider-icon[b-cfjf9hn9sf] {
    width: 37px;
    height: 37px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: #f1f3f7;
    color: #495268;
    font-size: 12px;
    font-weight: 850;
}

.provider-card.selected .provider-icon[b-cfjf9hn9sf] {
    background: #eaedff;
    color: #5765d4;
}

.provider-card strong[b-cfjf9hn9sf] {
    display: block;
    color: #333c4e;
    font-size: 14px;
}

.provider-card span[b-cfjf9hn9sf] {
    display: block;
    margin-top: 2px;
    color: #929aa7;
    font-size: 12px;
}

.provider-radio[b-cfjf9hn9sf] {
    width: 17px;
    height: 17px;
    padding: 3px;
    border: 2px solid #cdd3df;
    border-radius: 50%;
    box-sizing: border-box;
}

.provider-card.selected .provider-radio[b-cfjf9hn9sf] {
    border-color: #6572da;
}

.radio-dot[b-cfjf9hn9sf] {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.provider-card.selected .radio-dot[b-cfjf9hn9sf] {
    background: #6572da;
}

.form-grid[b-cfjf9hn9sf] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
}

.field[b-cfjf9hn9sf] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

    .field.full[b-cfjf9hn9sf] {
        grid-column: 1 / -1;
    }

    .field label[b-cfjf9hn9sf] {
        color: #485265;
        font-size: 14px;
        font-weight: 700;
    }

.form-control[b-cfjf9hn9sf] {
    width: 100%;
    min-height: 42px;
    padding: 9px 11px;
    box-sizing: border-box;
    border: 1px solid #d8dde7;
    border-radius: 8px;
    outline: none;
    background: #fff;
    color: #182033;
    font: inherit;
    font-size: 14px;
    transition: .15s ease;
}

    .form-control:focus[b-cfjf9hn9sf] {
        border-color: #6976d9;
        box-shadow: 0 0 0 3px rgba(105, 118, 217, .09);
    }

.validation-message[b-cfjf9hn9sf] {
    color: #c64040;
    font-size: 13px;
}

.tls-option[b-cfjf9hn9sf] {
    margin-top: 18px;
    padding: 15px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    border: 1px solid #e4e7ed;
    border-radius: 10px;
    background: #fafbfc;
    cursor: pointer;
}

    .tls-option input[b-cfjf9hn9sf] {
        margin-top: 3px;
    }

    .tls-option > div[b-cfjf9hn9sf] {
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .tls-option strong[b-cfjf9hn9sf] {
        color: #424c5e;
        font-size: 14px;
    }

    .tls-option span[b-cfjf9hn9sf] {
        color: #828c9c;
        font-size: 13px;
        line-height: 1.45;
    }

.connection-result[b-cfjf9hn9sf] {
    margin-top: 20px;
    padding: 13px 14px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    border-radius: 10px;
}

    .connection-result.success[b-cfjf9hn9sf] {
        background: #f0faf4;
        border: 1px solid #c7ead2;
    }

    .connection-result.error[b-cfjf9hn9sf] {
        background: #fff5f5;
        border: 1px solid #f0cccc;
    }

.result-icon[b-cfjf9hn9sf] {
    width: 25px;
    height: 25px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 13px;
    font-weight: 850;
}

.connection-result.success .result-icon[b-cfjf9hn9sf] {
    background: #d8f3e1;
    color: #257946;
}

.connection-result.error .result-icon[b-cfjf9hn9sf] {
    background: #f8dada;
    color: #b33838;
}

.connection-result > div:last-child[b-cfjf9hn9sf] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.connection-result strong[b-cfjf9hn9sf] {
    color: #3d4759;
    font-size: 14px;
}

.connection-result span[b-cfjf9hn9sf] {
    color: #727d8e;
    font-size: 13px;
    line-height: 1.5;
}

.modal-footer[b-cfjf9hn9sf] {
    padding: 16px 25px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: #fafbfc;
    border-top: 1px solid #e9edf2;
}

.modal-footer-right[b-cfjf9hn9sf] {
    display: flex;
    align-items: center;
    gap: 9px;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1100px) {

    .summary-grid[b-cfjf9hn9sf] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .database-main[b-cfjf9hn9sf] {
        grid-template-columns: 44px minmax(0, 1fr) auto;
    }

    .database-metrics[b-cfjf9hn9sf] {
        grid-column: 2;
        grid-row: 2;
        margin-top: -3px;
    }

    .database-actions[b-cfjf9hn9sf] {
        grid-column: 3;
        grid-row: 1 / span 2;
    }

    .database-details[b-cfjf9hn9sf] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 800px) {

    .databases-page[b-cfjf9hn9sf] {
        padding: 26px 18px 60px;
    }

    .page-header[b-cfjf9hn9sf] {
        flex-direction: column;
    }

        .page-header .primary-button[b-cfjf9hn9sf] {
            width: 100%;
        }

    .panel-header[b-cfjf9hn9sf] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar[b-cfjf9hn9sf] {
        width: 100%;
    }

    .search-box[b-cfjf9hn9sf] {
        width: auto;
        flex: 1;
    }

    .database-main[b-cfjf9hn9sf] {
        grid-template-columns: 44px minmax(0, 1fr);
    }

    .database-metrics[b-cfjf9hn9sf] {
        grid-column: 2;
        grid-row: auto;
    }

    .database-actions[b-cfjf9hn9sf] {
        grid-column: 2;
        grid-row: auto;
        align-items: flex-start;
    }

    .database-details[b-cfjf9hn9sf] {
        padding-left: 78px;
    }
}


@media (max-width: 580px) {

    .databases-page[b-cfjf9hn9sf] {
        padding: 22px 14px 50px;
    }

    .summary-grid[b-cfjf9hn9sf] {
        grid-template-columns: 1fr;
    }

    .toolbar[b-cfjf9hn9sf] {
        flex-direction: column;
    }

    .search-box[b-cfjf9hn9sf],
    .provider-filter[b-cfjf9hn9sf] {
        width: 100%;
        box-sizing: border-box;
    }

    .database-main[b-cfjf9hn9sf] {
        padding: 16px;
        grid-template-columns: 40px minmax(0, 1fr);
        gap: 11px;
    }

    .database-metrics[b-cfjf9hn9sf],
    .database-actions[b-cfjf9hn9sf] {
        grid-column: 1 / -1;
        padding-left: 51px;
    }

    .database-metrics[b-cfjf9hn9sf] {
        gap: 18px;
    }

    .database-details[b-cfjf9hn9sf] {
        padding: 15px 16px 17px 67px;
        grid-template-columns: 1fr;
    }

    .modal-backdrop[b-cfjf9hn9sf] {
        padding: 12px;
    }

    .database-modal[b-cfjf9hn9sf] {
        border-radius: 14px;
    }

    .modal-header[b-cfjf9hn9sf],
    .modal-body[b-cfjf9hn9sf],
    .modal-footer[b-cfjf9hn9sf] {
        padding-left: 18px;
        padding-right: 18px;
    }

    .provider-grid[b-cfjf9hn9sf],
    .form-grid[b-cfjf9hn9sf] {
        grid-template-columns: 1fr;
    }

    .field.full[b-cfjf9hn9sf] {
        grid-column: auto;
    }

    .modal-footer[b-cfjf9hn9sf] {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .modal-footer-right[b-cfjf9hn9sf] {
        flex-direction: column;
        align-items: stretch;
    }

    .modal-footer .primary-button[b-cfjf9hn9sf],
    .modal-footer .secondary-button[b-cfjf9hn9sf] {
        width: 100%;
    }
}


/* =========================================================
   SCHEMA REFRESH
========================================================= */

.database-schema-zone[b-cfjf9hn9sf] {
    grid-column: 1 / -1;
    margin-top: 5px;
    padding-top: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-top: 1px solid #eceff3;
}

    .database-schema-zone > div[b-cfjf9hn9sf] {
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 4px;
    }

    .database-schema-zone strong[b-cfjf9hn9sf] {
        color: #39445a;
        font-size: 14px;
        font-weight: 750;
    }

    .database-schema-zone span[b-cfjf9hn9sf] {
        max-width: 650px;
        color: #8c95a4;
        font-size: 13px;
        line-height: 1.55;
    }

.refresh-schema-button[b-cfjf9hn9sf] {
    min-height: 36px;
    flex: 0 0 auto;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid #cfd5ef;
    border-radius: 8px;
    background: #fff;
    color: #5967cf;
    font: inherit;
    font-size: 13px;
    font-weight: 750;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, transform .15s ease;
}

    .refresh-schema-button:hover:not(:disabled)[b-cfjf9hn9sf] {
        background: #f7f8ff;
        border-color: #aeb8ea;
        transform: translateY(-1px);
    }

    .refresh-schema-button:disabled[b-cfjf9hn9sf] {
        cursor: not-allowed;
        opacity: .6;
    }

.refresh-symbol[b-cfjf9hn9sf] {
    color: inherit !important;
    font-size: 15px !important;
    line-height: 1;
}

.refresh-unavailable[b-cfjf9hn9sf] {
    flex: 0 0 auto;
    max-width: 220px !important;
    text-align: right;
    color: #9aa2af !important;
}

@media (max-width: 580px) {

    .database-schema-zone[b-cfjf9hn9sf] {
        align-items: stretch;
        flex-direction: column;
    }

    .refresh-schema-button[b-cfjf9hn9sf] {
        width: 100%;
    }

    .refresh-unavailable[b-cfjf9hn9sf] {
        max-width: none !important;
        text-align: left;
    }
}


/* =========================================================
   DATABASE REMOVAL / DANGER ZONE
========================================================= */

.database-danger-zone[b-cfjf9hn9sf] {
    grid-column: 1 / -1;
    margin-top: 5px;
    padding-top: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-top: 1px solid #eceff3;
}

    .database-danger-zone > div[b-cfjf9hn9sf] {
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 4px;
    }

    .database-danger-zone strong[b-cfjf9hn9sf] {
        color: #8d3434;
        font-size: 14px;
        font-weight: 750;
    }

    .database-danger-zone span[b-cfjf9hn9sf] {
        max-width: 650px;
        color: #8c95a4;
        font-size: 13px;
        line-height: 1.55;
    }

.danger-button[b-cfjf9hn9sf] {
    min-height: 36px;
    flex: 0 0 auto;
    padding: 0 12px;
    border: 1px solid #e4bfc3;
    border-radius: 8px;
    background: #fff;
    color: #aa3f49;
    font: inherit;
    font-size: 13px;
    font-weight: 750;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease;
}

    .danger-button:hover[b-cfjf9hn9sf] {
        background: #fff5f5;
        border-color: #dca8ae;
    }

.remove-database-modal[b-cfjf9hn9sf] {
    width: min(560px, 100%);
}

.danger-eyebrow[b-cfjf9hn9sf] {
    color: #b44750;
}

.remove-modal-body[b-cfjf9hn9sf] {
    padding: 24px 25px;
}

.remove-warning-icon[b-cfjf9hn9sf] {
    width: 48px;
    height: 48px;
    margin-bottom: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #fff0f1;
    color: #ba424d;
    font-size: 22px;
    font-weight: 850;
}

.remove-warning-copy strong[b-cfjf9hn9sf] {
    display: block;
    margin-bottom: 6px;
    color: #313a4c;
    font-size: 15px;
}

.remove-warning-copy p[b-cfjf9hn9sf] {
    margin: 0;
    color: #788294;
    font-size: 14px;
    line-height: 1.65;
}

.remove-effects[b-cfjf9hn9sf] {
    margin-top: 20px;
    padding: 15px 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    border: 1px solid #e7eaf0;
    border-radius: 11px;
    background: #fafbfc;
}

    .remove-effects > div[b-cfjf9hn9sf] {
        display: flex;
        align-items: flex-start;
        gap: 9px;
        color: #4d5769;
        font-size: 13px;
        line-height: 1.5;
    }

.remove-check[b-cfjf9hn9sf] {
    color: #6070cf;
    font-weight: 900;
}

.database-safe-note[b-cfjf9hn9sf] {
    margin-top: 16px;
    padding: 13px 14px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    border: 1px solid #cce5d5;
    border-radius: 10px;
    background: #f3faf6;
}

    .database-safe-note strong[b-cfjf9hn9sf] {
        color: #347553;
        font-size: 13px;
    }

    .database-safe-note span[b-cfjf9hn9sf] {
        color: #667b6f;
        font-size: 13px;
        line-height: 1.5;
    }

.remove-modal-footer[b-cfjf9hn9sf] {
    justify-content: flex-end;
}

.danger-confirm-button[b-cfjf9hn9sf] {
    min-height: 41px;
    padding: 0 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid #ad3c47;
    border-radius: 9px;
    background: #ad3c47;
    color: #fff;
    font: inherit;
    font-size: 14px;
    font-weight: 750;
    cursor: pointer;
    transition: background .15s ease, transform .15s ease;
}

    .danger-confirm-button:hover:not(:disabled)[b-cfjf9hn9sf] {
        background: #96333d;
        transform: translateY(-1px);
    }

    .danger-confirm-button:disabled[b-cfjf9hn9sf] {
        cursor: not-allowed;
        opacity: .6;
    }


@media (max-width: 580px) {

    .database-danger-zone[b-cfjf9hn9sf] {
        align-items: stretch;
        flex-direction: column;
    }

    .danger-button[b-cfjf9hn9sf] {
        width: 100%;
    }

    .remove-modal-body[b-cfjf9hn9sf] {
        padding-left: 18px;
        padding-right: 18px;
    }

    .remove-modal-footer[b-cfjf9hn9sf] {
        flex-direction: column-reverse;
    }

        .remove-modal-footer .secondary-button[b-cfjf9hn9sf],
        .remove-modal-footer .danger-confirm-button[b-cfjf9hn9sf] {
            width: 100%;
        }
}


/* =========================================================
   ADMINISTRATOR ACCESS REQUIRED
========================================================= */

.access-denied-card[b-cfjf9hn9sf] {
    min-height: 480px;
    padding: 48px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 16px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, .025);
}

.access-denied-icon[b-cfjf9hn9sf] {
    width: 52px;
    height: 52px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #fff2f2;
    color: #af4048;
    font-size: 21px;
    font-weight: 850;
}

.access-denied-card h1[b-cfjf9hn9sf] {
    margin: 0;
    color: #283144;
    font-size: 22px;
}

.access-denied-card p[b-cfjf9hn9sf] {
    max-width: 520px;
    margin: 9px 0 0;
    color: #8993a2;
    font-size: 14px;
    line-height: 1.65;
}


/* =========================================================
   FIREWALL / NETWORK ACCESS NOTICE
   ========================================================= */

.firewall-notice[b-cfjf9hn9sf] {
    margin-top: 24px;
    padding: 20px;
    border: 1px solid #cbd8ee;
    border-left: 4px solid #526bd4;
    border-radius: 11px;
    background: #f7f9ff;
}

.firewall-notice-heading[b-cfjf9hn9sf] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.firewall-notice-icon[b-cfjf9hn9sf] {
    width: 31px;
    height: 31px;
    flex: 0 0 31px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #e8eeff;
    color: #3e55b8;
    font-size: 18px;
}

.firewall-notice-heading strong[b-cfjf9hn9sf] {
    color: #223151;
    font-size: 15px;
}

.firewall-notice > p[b-cfjf9hn9sf] {
    margin: 12px 0 0;
    color: #53627a;
    font-size: 13px;
    line-height: 1.65;
}

.firewall-ip-row[b-cfjf9hn9sf] {
    margin-top: 15px;
    padding: 13px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px 16px;
    border: 1px solid #dce4f4;
    border-radius: 9px;
    background: #fff;
}

.firewall-ip-row > span[b-cfjf9hn9sf] {
    color: #5b6880;
    font-size: 12px;
    font-weight: 650;
}

.firewall-ip-row code[b-cfjf9hn9sf] {
    color: #243b86;
    font-family: Consolas, "Liberation Mono", monospace;
    font-size: 15px;
    font-weight: 700;
    user-select: all;
}

.firewall-notice > p.firewall-notice-footnote[b-cfjf9hn9sf] {
    color: #68768b;
    font-size: 12px;
}

@media (max-width: 650px) {
    .firewall-notice[b-cfjf9hn9sf] {
        padding: 17px;
    }
}
/* /Pages/Index.razor.rz.scp.css */
/* =========================================================
   PAGE
========================================================= */

.dashboard-page[b-do4mm0o5vr] {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    padding: 34px 34px 72px;
    box-sizing: border-box;
    color: #182033;
}


/* =========================================================
   LOADING
========================================================= */

.dashboard-loading[b-do4mm0o5vr] {
    min-height: 420px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #667085;
}

    .dashboard-loading > div:last-child[b-do4mm0o5vr] {
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .dashboard-loading strong[b-do4mm0o5vr] {
        color: #263044;
        font-size: 16px;
    }

    .dashboard-loading span[b-do4mm0o5vr] {
        font-size: 14px;
        color: #8c95a5;
    }

.loading-spinner[b-do4mm0o5vr] {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 3px solid #e5e8f0;
    border-top-color: #6472d8;
    animation: dashboard-spin-b-do4mm0o5vr 0.75s linear infinite;
}

@keyframes dashboard-spin-b-do4mm0o5vr {
    to {
        transform: rotate(360deg);
    }
}


/* =========================================================
   ERROR
========================================================= */

.dashboard-error[b-do4mm0o5vr] {
    max-width: 650px;
    margin: 70px auto;
    padding: 18px 20px;
    display: flex;
    align-items: flex-start;
    gap: 13px;
    background: #fff5f5;
    border: 1px solid #efcccc;
    border-radius: 14px;
    color: #8e3434;
}

.dashboard-error-icon[b-do4mm0o5vr] {
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #f8dddd;
    color: #b53f3f;
    font-weight: 800;
}

.dashboard-error > div:last-child[b-do4mm0o5vr] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.dashboard-error strong[b-do4mm0o5vr] {
    font-size: 16px;
}

.dashboard-error span[b-do4mm0o5vr] {
    font-size: 14px;
    line-height: 1.55;
}


/* =========================================================
   HEADER
========================================================= */

.dashboard-header[b-do4mm0o5vr] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 26px;
}

.eyebrow[b-do4mm0o5vr] {
    margin-bottom: 7px;
    color: #6472d8;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.13em;
}

.dashboard-header h1[b-do4mm0o5vr] {
    margin: 0;
    color: #172033;
    font-size: 34px;
    line-height: 1.15;
    font-weight: 760;
    letter-spacing: -0.035em;
}

.dashboard-header p[b-do4mm0o5vr] {
    max-width: 650px;
    margin: 10px 0 0;
    color: #768093;
    font-size: 16px;
    line-height: 1.65;
}

.header-actions[b-do4mm0o5vr] {
    display: flex;
    align-items: center;
    gap: 10px;
}


/* =========================================================
   BUTTONS
========================================================= */

.primary-button[b-do4mm0o5vr],
.secondary-button[b-do4mm0o5vr],
.text-button[b-do4mm0o5vr],
.quick-action[b-do4mm0o5vr] {
    font: inherit;
}

.primary-button[b-do4mm0o5vr],
.secondary-button[b-do4mm0o5vr],
.text-button[b-do4mm0o5vr] {
    cursor: pointer;
}

.primary-button[b-do4mm0o5vr] {
    min-height: 43px;
    padding: 0 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #202941;
    border-radius: 9px;
    background: #202941;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

    .primary-button:hover[b-do4mm0o5vr] {
        background: #161e30;
        transform: translateY(-1px);
        box-shadow: 0 5px 14px rgba(25, 33, 52, 0.12);
    }

.button-plus[b-do4mm0o5vr] {
    font-size: 20px;
    line-height: 1;
    font-weight: 500;
}

.secondary-button[b-do4mm0o5vr] {
    min-height: 39px;
    padding: 0 14px;
    border: 1px solid #d8dde6;
    border-radius: 8px;
    background: #fff;
    color: #364154;
    font-size: 14px;
    font-weight: 700;
    transition: background 0.15s ease, border-color 0.15s ease;
}

    .secondary-button:hover[b-do4mm0o5vr] {
        background: #f7f8fa;
        border-color: #c9cfda;
    }

.text-button[b-do4mm0o5vr] {
    border: none;
    background: transparent;
    color: #5d6bd4;
    font-size: 14px;
    font-weight: 700;
}

    .text-button:hover[b-do4mm0o5vr] {
        text-decoration: underline;
    }


/* =========================================================
   SUBSCRIPTION BANNER
========================================================= */

.subscription-banner[b-do4mm0o5vr] {
    margin-bottom: 20px;
    padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    background: linear-gradient( 135deg, #ffffff 0%, #fafaff 100% );
    border: 1px solid #e1e5ec;
    border-radius: 14px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, 0.025);
}

.subscription-left[b-do4mm0o5vr] {
    display: flex;
    align-items: center;
    gap: 13px;
    min-width: 0;
}

.subscription-icon[b-do4mm0o5vr] {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    background: #202941;
    color: white;
    font-size: 17px;
    font-weight: 800;
}

.subscription-title[b-do4mm0o5vr] {
    display: flex;
    align-items: center;
    gap: 9px;
    flex-wrap: wrap;
}

    .subscription-title strong[b-do4mm0o5vr] {
        color: #20283a;
        font-size: 16px;
    }

.subscription-left p[b-do4mm0o5vr] {
    margin: 4px 0 0;
    color: #7e8796;
    font-size: 14px;
}

.subscription-badge[b-do4mm0o5vr] {
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

    .subscription-badge.trial[b-do4mm0o5vr] {
        background: #eef0ff;
        color: #5965c8;
    }

    .subscription-badge.active[b-do4mm0o5vr] {
        background: #e9f7ef;
        color: #28734c;
    }

    .subscription-badge.warning[b-do4mm0o5vr] {
        background: #fff4e8;
        color: #99602c;
    }

    .subscription-badge.inactive[b-do4mm0o5vr] {
        background: #fff0f1;
        color: #a14655;
    }

.subscription-price[b-do4mm0o5vr] {
    display: flex;
    align-items: baseline;
    gap: 4px;
    white-space: nowrap;
}

    .subscription-price strong[b-do4mm0o5vr] {
        color: #20283a;
        font-size: 19px;
    }

    .subscription-price span[b-do4mm0o5vr] {
        color: #929aa8;
        font-size: 14px;
    }


/* =========================================================
   STATS
========================================================= */

.stats-grid[b-do4mm0o5vr] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.stat-card[b-do4mm0o5vr] {
    padding: 20px;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 14px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, 0.025);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

    .stat-card:hover[b-do4mm0o5vr] {
        transform: translateY(-2px);
        box-shadow: 0 9px 25px rgba(17, 24, 39, 0.05);
    }

.stat-top[b-do4mm0o5vr] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 17px;
}

.stat-icon[b-do4mm0o5vr] {
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    font-size: 13px;
    font-weight: 850;
}

.database-icon[b-do4mm0o5vr] {
    background: #eef0ff;
    color: #5b68cf;
}

.table-icon[b-do4mm0o5vr] {
    background: #edf8f2;
    color: #347c59;
}

.column-icon[b-do4mm0o5vr] {
    background: #fff4e8;
    color: #9c652c;
}

.scope-icon[b-do4mm0o5vr] {
    background: #f3effc;
    color: #7550b2;
}

.stat-label[b-do4mm0o5vr] {
    color: #697386;
    font-size: 14px;
    font-weight: 650;
}

.stat-value[b-do4mm0o5vr] {
    color: #171f30;
    font-size: 31px;
    line-height: 1;
    font-weight: 780;
    letter-spacing: -0.025em;
}

.stat-description[b-do4mm0o5vr] {
    margin-top: 8px;
    color: #949dab;
    font-size: 14px;
}


/* =========================================================
   DASHBOARD LAYOUT
========================================================= */

.dashboard-grid[b-do4mm0o5vr] {
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(320px, 0.85fr);
    gap: 20px;
    margin-bottom: 20px;
}

.bottom-grid[b-do4mm0o5vr] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}


/* =========================================================
   GENERIC CARD
========================================================= */

.dashboard-card[b-do4mm0o5vr] {
    min-width: 0;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, 0.025);
}

.card-header[b-do4mm0o5vr] {
    min-height: 70px;
    padding: 20px 21px 17px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid #edf0f4;
}

    .card-header h2[b-do4mm0o5vr] {
        margin: 0;
        color: #20283a;
        font-size: 17px;
        font-weight: 750;
    }

    .card-header p[b-do4mm0o5vr] {
        margin: 5px 0 0;
        color: #8a93a2;
        font-size: 14px;
        line-height: 1.5;
    }


/* =========================================================
   DATABASE LIST
========================================================= */

.database-list[b-do4mm0o5vr] {
    display: flex;
    flex-direction: column;
}

.database-row[b-do4mm0o5vr] {
    min-height: 78px;
    padding: 15px 20px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 24px;
    border-bottom: 1px solid #eef1f4;
}

    .database-row:last-child[b-do4mm0o5vr] {
        border-bottom: none;
    }

    .database-row:hover[b-do4mm0o5vr] {
        background: #fafbfc;
    }

.database-row-left[b-do4mm0o5vr] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.database-provider-icon[b-do4mm0o5vr] {
    width: 39px;
    height: 39px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #f0f2f7;
    color: #596477;
    font-size: 13px;
    font-weight: 850;
}

.database-name[b-do4mm0o5vr] {
    color: #273043;
    font-size: 15px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.database-meta[b-do4mm0o5vr] {
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 5px;
    color: #929aa8;
    font-size: 14px;
    overflow: hidden;
}

    .database-meta span[b-do4mm0o5vr] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.meta-dot[b-do4mm0o5vr] {
    flex: 0 0 auto;
    color: #c2c7d0;
}

.database-counts[b-do4mm0o5vr] {
    display: flex;
    align-items: center;
    gap: 22px;
}

    .database-counts > div[b-do4mm0o5vr] {
        min-width: 55px;
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .database-counts strong[b-do4mm0o5vr] {
        color: #30394b;
        font-size: 14px;
    }

    .database-counts span[b-do4mm0o5vr] {
        color: #9aa2af;
        font-size: 13px;
    }

.database-row-right[b-do4mm0o5vr] {
    min-width: 105px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 5px;
}

.connection-status-pill[b-do4mm0o5vr] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #397659;
    font-size: 13px;
    font-weight: 700;
}

.status-dot[b-do4mm0o5vr] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #4caf78;
    box-shadow: 0 0 0 3px rgba(76, 175, 120, 0.12);
}

.scan-time[b-do4mm0o5vr] {
    color: #a0a7b3;
    font-size: 13px;
}


/* =========================================================
   EMPTY STATE
========================================================= */

.empty-state[b-do4mm0o5vr] {
    padding: 52px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.empty-icon[b-do4mm0o5vr] {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
    border-radius: 13px;
    background: #f0f2f7;
    color: #596477;
    font-size: 14px;
    font-weight: 850;
}

.empty-state h3[b-do4mm0o5vr] {
    margin: 0;
    color: #283144;
    font-size: 16px;
}

.empty-state p[b-do4mm0o5vr] {
    max-width: 390px;
    margin: 7px 0 18px;
    color: #8c95a4;
    font-size: 14px;
    line-height: 1.6;
}


/* =========================================================
   QUICK ACTIONS
========================================================= */

.quick-action-list[b-do4mm0o5vr] {
    display: flex;
    flex-direction: column;
}

.quick-action[b-do4mm0o5vr] {
    width: 100%;
    padding: 16px 18px;
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    border: none;
    border-bottom: 1px solid #eef1f4;
    background: #fff;
    text-align: left;
    cursor: pointer;
    transition: background 0.15s ease;
}

    .quick-action:last-child[b-do4mm0o5vr] {
        border-bottom: none;
    }

    .quick-action:hover[b-do4mm0o5vr] {
        background: #fafbfc;
    }

    .quick-action.completed[b-do4mm0o5vr] {
        background: #fcfdfc;
    }

        .quick-action.completed:hover[b-do4mm0o5vr] {
            background: #f7faf8;
        }

.quick-action-status[b-do4mm0o5vr],
.quick-action-number[b-do4mm0o5vr] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 14px;
    font-weight: 800;
}

.quick-action-status[b-do4mm0o5vr] {
    background: #e6f5ec;
    color: #2f7a51;
}

.quick-action-number[b-do4mm0o5vr] {
    background: #eff1f6;
    color: #687386;
}

.quick-action > div:nth-child(2)[b-do4mm0o5vr] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.quick-action strong[b-do4mm0o5vr] {
    color: #30394a;
    font-size: 14px;
}

.quick-action span[b-do4mm0o5vr] {
    color: #929aa8;
    font-size: 13px;
    line-height: 1.5;
}

.action-arrow[b-do4mm0o5vr] {
    color: #8f98a7 !important;
    font-size: 15px !important;
}


/* =========================================================
   MCP
========================================================= */

.mcp-status[b-do4mm0o5vr] {
    min-height: 110px;
    padding: 21px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
}

.mcp-status-icon[b-do4mm0o5vr] {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    background: #f0f2f7;
    color: #6d7688;
    font-size: 15px;
    font-weight: 800;
}

    .mcp-status-icon.online[b-do4mm0o5vr] {
        background: #e8f6ee;
        color: #2f7d53;
    }

.mcp-status-content[b-do4mm0o5vr] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

    .mcp-status-content strong[b-do4mm0o5vr] {
        color: #30394a;
        font-size: 15px;
    }

    .mcp-status-content span[b-do4mm0o5vr] {
        color: #9099a7;
        font-size: 14px;
        line-height: 1.5;
    }


/* =========================================================
   ACTIVITY
========================================================= */

.activity-count[b-do4mm0o5vr] {
    padding: 5px 8px;
    border-radius: 999px;
    background: #f2f4f7;
    color: #7b8493;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}

.activity-empty[b-do4mm0o5vr] {
    min-height: 110px;
    padding: 21px;
    display: flex;
    align-items: center;
    gap: 13px;
}

.activity-empty-icon[b-do4mm0o5vr] {
    width: 40px;
    height: 40px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #f1f3f7;
    color: #6c7687;
    font-size: 18px;
}

.activity-empty > div:last-child[b-do4mm0o5vr] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.activity-empty strong[b-do4mm0o5vr] {
    color: #323b4d;
    font-size: 14px;
}

.activity-empty span[b-do4mm0o5vr] {
    color: #919aa8;
    font-size: 13px;
    line-height: 1.5;
}

.activity-list[b-do4mm0o5vr] {
    display: flex;
    flex-direction: column;
}

.activity-row[b-do4mm0o5vr] {
    min-height: 64px;
    padding: 12px 18px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    border-bottom: 1px solid #eef1f4;
}

    .activity-row:last-child[b-do4mm0o5vr] {
        border-bottom: none;
    }

    .activity-row:hover[b-do4mm0o5vr] {
        background: #fafbfc;
    }

.activity-status[b-do4mm0o5vr] {
    width: 27px;
    height: 27px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 13px;
    font-weight: 850;
}

    .activity-status.allowed[b-do4mm0o5vr] {
        background: #e5f4eb;
        color: #2f7b51;
    }

    .activity-status.blocked[b-do4mm0o5vr] {
        background: #fff0f0;
        color: #b34242;
    }

.activity-content[b-do4mm0o5vr] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

    .activity-content strong[b-do4mm0o5vr] {
        color: #313a4b;
        font-size: 14px;
        font-weight: 700;
        text-transform: capitalize;
    }

    .activity-content span[b-do4mm0o5vr] {
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: #929aa7;
        font-size: 13px;
    }

.activity-time[b-do4mm0o5vr] {
    color: #9aa2ae;
    font-size: 13px;
    white-space: nowrap;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1180px) {

    .stats-grid[b-do4mm0o5vr] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-grid[b-do4mm0o5vr] {
        grid-template-columns: 1fr;
    }

    .bottom-grid[b-do4mm0o5vr] {
        grid-template-columns: 1fr;
    }
}


@media (max-width: 760px) {

    .dashboard-page[b-do4mm0o5vr] {
        padding: 26px 18px 60px;
    }

    .dashboard-header[b-do4mm0o5vr] {
        flex-direction: column;
        align-items: stretch;
    }

    .header-actions[b-do4mm0o5vr] {
        width: 100%;
    }

        .header-actions .primary-button[b-do4mm0o5vr] {
            width: 100%;
        }

    .dashboard-header h1[b-do4mm0o5vr] {
        font-size: 29px;
    }

    .subscription-banner[b-do4mm0o5vr] {
        flex-direction: column;
        align-items: flex-start;
    }

    .subscription-price[b-do4mm0o5vr] {
        padding-left: 55px;
    }

    .stats-grid[b-do4mm0o5vr] {
        grid-template-columns: 1fr 1fr;
    }

    .database-row[b-do4mm0o5vr] {
        grid-template-columns: 1fr auto;
    }

    .database-counts[b-do4mm0o5vr] {
        grid-column: 1 / -1;
        padding-left: 51px;
    }

    .database-row-right[b-do4mm0o5vr] {
        grid-column: 2;
        grid-row: 1;
    }
}


@media (max-width: 520px) {

    .dashboard-page[b-do4mm0o5vr] {
        padding: 22px 14px 50px;
    }

    .stats-grid[b-do4mm0o5vr] {
        grid-template-columns: 1fr;
    }

    .stat-card[b-do4mm0o5vr] {
        padding: 18px;
    }

    .subscription-banner[b-do4mm0o5vr] {
        padding: 16px;
    }

    .subscription-price[b-do4mm0o5vr] {
        padding-left: 0;
    }

    .card-header[b-do4mm0o5vr] {
        padding: 18px;
    }

    .database-row[b-do4mm0o5vr] {
        padding: 15px 16px;
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .database-row-right[b-do4mm0o5vr] {
        grid-column: 1;
        grid-row: auto;
        align-items: flex-start;
        padding-left: 51px;
    }

    .database-counts[b-do4mm0o5vr] {
        grid-column: 1;
        padding-left: 51px;
    }

    .quick-action[b-do4mm0o5vr] {
        grid-template-columns: 30px minmax(0, 1fr);
    }

    .action-arrow[b-do4mm0o5vr] {
        display: none;
    }

    .mcp-status[b-do4mm0o5vr] {
        grid-template-columns: auto minmax(0, 1fr);
    }

        .mcp-status .secondary-button[b-do4mm0o5vr] {
            grid-column: 1 / -1;
            width: 100%;
        }

    .activity-row[b-do4mm0o5vr] {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .activity-time[b-do4mm0o5vr] {
        grid-column: 2;
    }
}
/* /Pages/Login.razor.rz.scp.css */
/* =========================================================
   PAGE
========================================================= */

.login-page[b-epyftd0jj4] {
    min-height: 100vh;
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(500px, .92fr);
    background: #f7f8fb;
    color: #182033;
}


/* =========================================================
   LEFT SHOWCASE
========================================================= */

.login-showcase[b-epyftd0jj4] {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
    background:
        radial-gradient(circle at 12% 8%, rgba(118, 131, 229, .24), transparent 24rem),
        radial-gradient(circle at 90% 86%, rgba(83, 184, 137, .10), transparent 25rem),
        linear-gradient(145deg, #151c30 0%, #1b233a 52%, #202941 100%);
    color: #fff;
}

.login-showcase[b-epyftd0jj4]::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .32;
    background-image:
        linear-gradient(rgba(255, 255, 255, .025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .025) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(to bottom, rgba(0,0,0,.9), transparent 88%);
}

.showcase-inner[b-epyftd0jj4] {
    position: relative;
    z-index: 1;
    width: min(720px, calc(100% - 76px));
    min-height: 100vh;
    margin: 0 auto;
    padding: 42px 0 34px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
}

.brand-link[b-epyftd0jj4] {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #fff;
    text-decoration: none;
}

.brand-link:hover[b-epyftd0jj4] {
    color: #fff;
    text-decoration: none;
}

.brand-mark[b-epyftd0jj4] {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 12px;
    background: rgba(255,255,255,.08);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .18);
}

.brand-mark img[b-epyftd0jj4] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.brand-copy[b-epyftd0jj4] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.brand-copy strong[b-epyftd0jj4] {
    color: #fff;
    font-size: 18px;
    line-height: 1.15;
    font-weight: 760;
    letter-spacing: -.02em;
}

.brand-copy small[b-epyftd0jj4] {
    color: #8e9ab2;
    font-size: 10px;
    font-weight: 750;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.showcase-copy[b-epyftd0jj4] {
    margin: auto 0;
    padding: 54px 0;
}

.trial-pill[b-epyftd0jj4] {
    width: fit-content;
    margin-bottom: 25px;
    padding: 8px 12px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(146, 158, 244, .20);
    border-radius: 999px;
    background: rgba(103, 116, 221, .10);
    color: #c8cffd;
    font-size: 12px;
    font-weight: 750;
}

.trial-dot[b-epyftd0jj4] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #7ed5a6;
    box-shadow: 0 0 0 4px rgba(126, 213, 166, .10);
}

.showcase-copy h1[b-epyftd0jj4] {
    max-width: 650px;
    margin: 0;
    color: #fff;
    font-size: clamp(42px, 5vw, 68px);
    line-height: 1.02;
    font-weight: 735;
    letter-spacing: -.045em;
}

.showcase-copy h1 span[b-epyftd0jj4] {
    display: block;
    margin-top: 6px;
    color: #aeb8ff;
}

.showcase-copy > p[b-epyftd0jj4] {
    max-width: 615px;
    margin: 24px 0 0;
    color: #a7b1c3;
    font-size: 17px;
    line-height: 1.7;
}

.feature-list[b-epyftd0jj4] {
    max-width: 620px;
    margin-top: 36px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.feature-item[b-epyftd0jj4] {
    padding: 14px 16px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    border: 1px solid rgba(255, 255, 255, .07);
    border-radius: 12px;
    background: rgba(255, 255, 255, .035);
}

.feature-icon[b-epyftd0jj4] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: rgba(119, 132, 226, .12);
    color: #aeb8ff;
}

.feature-icon svg[b-epyftd0jj4] {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.feature-item > span:last-child[b-epyftd0jj4] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.feature-item strong[b-epyftd0jj4] {
    color: #eef2f8;
    font-size: 14px;
    font-weight: 720;
}

.feature-item small[b-epyftd0jj4] {
    color: #8f9bb0;
    font-size: 12px;
    line-height: 1.5;
}

.showcase-footer[b-epyftd0jj4] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px;
    color: #758198;
    font-size: 11px;
    font-weight: 650;
}

.footer-dot[b-epyftd0jj4] {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #536078;
}


/* =========================================================
   RIGHT LOGIN PANEL
========================================================= */

.login-panel[b-epyftd0jj4] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 42px;
    box-sizing: border-box;
    background:
        radial-gradient(circle at 100% 0%, rgba(99, 102, 241, .06), transparent 25rem),
        #f7f8fb;
}

.login-panel-inner[b-epyftd0jj4] {
    width: min(470px, 100%);
}

.mobile-brand[b-epyftd0jj4] {
    display: none;
}

.login-card[b-epyftd0jj4] {
    width: 100%;
    padding: 36px;
    box-sizing: border-box;
    background: #fff;
    border: 1px solid #e1e5ec;
    border-radius: 20px;
    box-shadow: 0 24px 70px rgba(17, 24, 39, .08);
}

.login-header[b-epyftd0jj4] {
    margin-bottom: 27px;
}

.eyebrow[b-epyftd0jj4] {
    margin-bottom: 9px;
    color: #6674d8;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
}

.login-header h2[b-epyftd0jj4] {
    margin: 0;
    color: #172033;
    font-size: 30px;
    line-height: 1.15;
    font-weight: 760;
    letter-spacing: -.035em;
}

.login-header p[b-epyftd0jj4] {
    margin: 9px 0 0;
    color: #747f90;
    font-size: 14px;
    line-height: 1.6;
}

.login-actions[b-epyftd0jj4] {
    display: flex;
    flex-direction: column;
    gap: 11px;
}

.login-button[b-epyftd0jj4] {
    width: 100%;
    min-height: 54px;
    padding: 0 15px;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) 20px;
    align-items: center;
    gap: 12px;
    border: 1px solid #d7dce5;
    border-radius: 10px;
    background: #fff;
    color: #20283a;
    text-decoration: none;
    font-size: 15px;
    font-weight: 690;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.login-button:hover[b-epyftd0jj4] {
    background: #fafbfc;
    border-color: #c7ced9;
    color: #20283a;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(20, 27, 42, .055);
}

.login-button:focus-visible[b-epyftd0jj4] {
    outline: none;
    border-color: #6976d9;
    box-shadow: 0 0 0 4px rgba(105, 118, 217, .11);
}

.provider-icon[b-epyftd0jj4] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 7px;
    background: #f5f6f8;
}

.microsoft-icon[b-epyftd0jj4] {
    display: grid;
    grid-template-columns: repeat(2, 8px);
    grid-template-rows: repeat(2, 8px);
    gap: 2px;
}

.microsoft-icon span:nth-child(1)[b-epyftd0jj4] { background: #f25022; }
.microsoft-icon span:nth-child(2)[b-epyftd0jj4] { background: #7fba00; }
.microsoft-icon span:nth-child(3)[b-epyftd0jj4] { background: #00a4ef; }
.microsoft-icon span:nth-child(4)[b-epyftd0jj4] { background: #ffb900; }

.microsoft-icon span[b-epyftd0jj4] {
    width: 8px;
    height: 8px;
}

.google-icon[b-epyftd0jj4] {
    color: #4285f4;
    font-size: 18px;
    font-weight: 800;
    font-family: Arial, sans-serif;
}

.button-arrow[b-epyftd0jj4] {
    color: #a0a8b5;
    font-size: 18px;
    text-align: right;
    transition: transform .15s ease;
}

.login-button:hover .button-arrow[b-epyftd0jj4] {
    transform: translateX(2px);
}

.login-divider[b-epyftd0jj4] {
    margin: 26px 0 22px;
}

.login-divider span[b-epyftd0jj4] {
    display: block;
    height: 1px;
    background: #eceff3;
}

.trial-card[b-epyftd0jj4] {
    padding: 14px;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 11px;
    border: 1px solid #dce3f6;
    border-radius: 11px;
    background: #f8f9fe;
}

.trial-card-icon[b-epyftd0jj4] {
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: #e9ecff;
    color: #5d69ce;
}

.trial-card-icon svg[b-epyftd0jj4] {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.trial-card > div:last-child[b-epyftd0jj4] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.trial-card strong[b-epyftd0jj4] {
    color: #3b4558;
    font-size: 13px;
    font-weight: 750;
}

.trial-card span[b-epyftd0jj4] {
    color: #7b8697;
    font-size: 12px;
    line-height: 1.55;
}

.login-footer[b-epyftd0jj4] {
    margin-top: 22px;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.lock-icon[b-epyftd0jj4] {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    margin-top: 1px;
    color: #8791a1;
}

.lock-icon svg[b-epyftd0jj4] {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.login-footer p[b-epyftd0jj4] {
    margin: 0;
    color: #8a94a4;
    font-size: 11px;
    line-height: 1.55;
}

.panel-footer[b-epyftd0jj4] {
    margin-top: 17px;
    text-align: center;
    color: #98a0ad;
    font-size: 11px;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1050px) {

    .login-page[b-epyftd0jj4] {
        grid-template-columns: minmax(0, 1fr) 470px;
    }

    .showcase-inner[b-epyftd0jj4] {
        width: min(620px, calc(100% - 54px));
    }

    .showcase-copy h1[b-epyftd0jj4] {
        font-size: clamp(38px, 5vw, 52px);
    }

    .showcase-copy > p[b-epyftd0jj4] {
        font-size: 15px;
    }
}

@media (max-width: 860px) {

    .login-page[b-epyftd0jj4] {
        display: block;
        min-height: 100vh;
    }

    .login-showcase[b-epyftd0jj4] {
        display: none;
    }

    .login-panel[b-epyftd0jj4] {
        min-height: 100vh;
        padding: 34px 20px;
    }

    .mobile-brand[b-epyftd0jj4] {
        margin-bottom: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        color: #202941;
        font-size: 18px;
        font-weight: 760;
    }

    .mobile-brand .brand-mark[b-epyftd0jj4] {
        width: 38px;
        height: 38px;
        box-shadow: 0 7px 18px rgba(17, 24, 39, .10);
    }
}

@media (max-width: 520px) {

    .login-panel[b-epyftd0jj4] {
        align-items: flex-start;
        padding: 24px 14px;
    }

    .login-card[b-epyftd0jj4] {
        padding: 26px 20px;
        border-radius: 16px;
    }

    .login-header h2[b-epyftd0jj4] {
        font-size: 27px;
    }

    .login-header p[b-epyftd0jj4] {
        font-size: 13px;
    }

    .login-button[b-epyftd0jj4] {
        min-height: 52px;
        font-size: 14px;
    }

    .trial-card[b-epyftd0jj4] {
        grid-template-columns: 32px minmax(0, 1fr);
        padding: 12px;
    }

    .trial-card-icon[b-epyftd0jj4] {
        width: 32px;
        height: 32px;
    }
}
/* /Pages/Marketing/Blog/Blog.razor.rz.scp.css */
.blog-page[b-x8fcjj2t8n] {
    --navy: #0b1422;
    --navy-2: #101d2d;
    --text: #101828;
    --text-2: #344054;
    --muted: #667085;
    --muted-2: #98a2b3;
    --border: #dfe5ec;
    --surface: #ffffff;
    --surface-2: #f7f9fc;
    --surface-3: #eef2f7;
    --blue: #3b63df;
    --blue-dark: #2f57d6;
    --blue-soft: #eef2ff;
    --green: #187b57;
    min-height: 100vh;
    margin: 0;
    background: var(--surface);
    color: var(--text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.blog-page *[b-x8fcjj2t8n],
.blog-page *[b-x8fcjj2t8n]::before,
.blog-page *[b-x8fcjj2t8n]::after {
    box-sizing: border-box;
}

.blog-page a[b-x8fcjj2t8n] {
    text-decoration: none;
}

.shell[b-x8fcjj2t8n] {
    width: min(1160px, calc(100% - 48px));
    margin-inline: auto;
}

/* Header */

.site-header[b-x8fcjj2t8n] {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    background: var(--navy);
}

.nav-shell[b-x8fcjj2t8n] {
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}

.brand[b-x8fcjj2t8n] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #ffffff;
    font-size: 19px;
    font-weight: 750;
    letter-spacing: -0.02em;
}

.brand-logo[b-x8fcjj2t8n] {
    display: block;
    border-radius: 6px;
}

.site-nav[b-x8fcjj2t8n] {
    display: flex;
    align-items: center;
    gap: 28px;
}

.site-nav > a[b-x8fcjj2t8n] {
    color: #c7d2df;
    font-size: 14px;
    font-weight: 600;
    transition: color 0.16s ease;
}

.site-nav > a:hover[b-x8fcjj2t8n],
.site-nav > a.active[b-x8fcjj2t8n] {
    color: #ffffff;
}

.site-nav .nav-button[b-x8fcjj2t8n] {
    padding: 9px 14px;
    border: 1px solid #44546a;
    border-radius: 7px;
    color: #ffffff;
}

/* Hero */

.blog-hero[b-x8fcjj2t8n] {
    padding: 100px 0 94px;
    background: var(--navy);
    color: white;
}

.hero-shell[b-x8fcjj2t8n] {
    max-width: 920px;
    margin-left: max(calc((100% - 1160px) / 2), 24px);
}

.hero-kicker[b-x8fcjj2t8n] {
    margin-bottom: 17px;
    color: #aebfff;
    font-size: 13px;
    font-weight: 750;
}

.blog-hero h1[b-x8fcjj2t8n] {
    max-width: 880px;
    margin: 0;
    color: white;
    font-size: clamp(42px, 5.2vw, 66px);
    line-height: 1.06;
    letter-spacing: -0.048em;
}

.blog-hero p[b-x8fcjj2t8n] {
    max-width: 750px;
    margin: 26px 0 0;
    color: #c3cedb;
    font-size: 18px;
    line-height: 1.72;
}

/* Shared headings */

.section-heading[b-x8fcjj2t8n] {
    margin-bottom: 36px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 48px;
}

.section-heading > div > span[b-x8fcjj2t8n],
.section-label[b-x8fcjj2t8n] {
    display: block;
    margin-bottom: 10px;
    color: #3154bd;
    font-size: 12px;
    font-weight: 750;
}

.section-heading h2[b-x8fcjj2t8n],
.topics-layout h2[b-x8fcjj2t8n] {
    max-width: 720px;
    margin: 0;
    color: var(--text);
    font-size: clamp(30px, 3vw, 42px);
    line-height: 1.14;
    letter-spacing: -0.035em;
}

.section-heading > p[b-x8fcjj2t8n] {
    max-width: 390px;
    margin: 0;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.7;
}

/* Featured */

.featured-section[b-x8fcjj2t8n] {
    padding: 86px 0 52px;
    background: white;
}

.featured-card[b-x8fcjj2t8n] {
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(360px, 0.98fr);
    min-height: 420px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
    color: inherit;
    transition: border-color 0.18s ease, transform 0.18s ease;
}

.featured-card:hover[b-x8fcjj2t8n] {
    border-color: #bcc8d8;
    transform: translateY(-2px);
}

.featured-copy[b-x8fcjj2t8n] {
    padding: 42px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.post-category[b-x8fcjj2t8n] {
    color: #3154bd;
    font-size: 11px;
    font-weight: 750;
}

.featured-copy h3[b-x8fcjj2t8n] {
    max-width: 650px;
    margin: 15px 0 0;
    color: var(--text);
    font-size: 34px;
    line-height: 1.16;
    letter-spacing: -0.034em;
}

.featured-copy > p[b-x8fcjj2t8n] {
    max-width: 620px;
    margin: 18px 0 0;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.74;
}

.post-meta[b-x8fcjj2t8n] {
    margin-top: 24px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    color: var(--muted-2);
    font-size: 11px;
}

.read-link[b-x8fcjj2t8n] {
    margin-top: auto;
    padding-top: 30px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--blue-dark);
    font-size: 13px;
    font-weight: 750;
}

.featured-visual[b-x8fcjj2t8n] {
    min-width: 0;
    padding: 36px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #0f1b2a;
    color: white;
}

.visual-label[b-x8fcjj2t8n] {
    margin-bottom: 24px;
    color: #9eadd1;
    font-size: 11px;
    font-weight: 700;
}

.flow[b-x8fcjj2t8n] {
    display: flex;
    align-items: center;
    gap: 7px;
    overflow-x: auto;
}

.flow > div[b-x8fcjj2t8n] {
    flex: 0 0 auto;
    padding: 10px 11px;
    border: 1px solid #2c3d52;
    border-radius: 6px;
    background: #132236;
    color: #dce4ee;
    font-size: 10px;
    font-weight: 700;
}

.flow > div.flow-highlight[b-x8fcjj2t8n] {
    border-color: #6380e8;
    background: #182a49;
    color: #dce5ff;
}

.flow > span[b-x8fcjj2t8n] {
    color: #697a90;
    font-size: 11px;
}

.permission-card[b-x8fcjj2t8n] {
    margin-top: 24px;
    padding: 18px;
    border: 1px solid #2d3e52;
    border-radius: 8px;
    background: #101b2a;
}

.permission-card > div:first-child[b-x8fcjj2t8n] {
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 7px;
    color: #c8d1de;
    font-size: 10px;
    font-weight: 700;
}

.permission-dot[b-x8fcjj2t8n] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #47d49a;
}

.permission-row[b-x8fcjj2t8n] {
    padding: 9px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #26364a;
    color: #aeb9c8;
    font-size: 10px;
}

.permission-row strong[b-x8fcjj2t8n] {
    color: #5ed9a9;
    font-size: 9px;
}

.permission-row strong.blocked[b-x8fcjj2t8n] {
    color: #e68790;
}

/* Article grid */

.articles-section[b-x8fcjj2t8n] {
    padding: 64px 0 100px;
    background: white;
}

.article-grid[b-x8fcjj2t8n] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.article-card[b-x8fcjj2t8n] {
    min-width: 0;
}

.article-card-link[b-x8fcjj2t8n] {
    min-height: 310px;
    height: 100%;
    padding: 27px;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: #fff;
    color: inherit;
    transition: border-color 0.18s ease, transform 0.18s ease;
}

.article-card-link:hover[b-x8fcjj2t8n] {
    border-color: #bcc8d8;
    transform: translateY(-2px);
}

.article-card-top[b-x8fcjj2t8n] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.card-arrow[b-x8fcjj2t8n] {
    color: var(--muted-2);
    font-size: 17px;
}

.article-card h3[b-x8fcjj2t8n] {
    margin: 20px 0 0;
    color: var(--text);
    font-size: 22px;
    line-height: 1.25;
    letter-spacing: -0.025em;
}

.article-card p[b-x8fcjj2t8n] {
    margin: 13px 0 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.7;
}

.article-card .post-meta[b-x8fcjj2t8n] {
    margin-top: auto;
    padding-top: 30px;
}

/* Topics */

.topics-section[b-x8fcjj2t8n] {
    padding: 92px 0;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    background: var(--surface-2);
}

.topics-layout[b-x8fcjj2t8n] {
    display: grid;
    grid-template-columns: minmax(0, 0.72fr) minmax(0, 1.28fr);
    gap: 80px;
    align-items: start;
}

.topic-grid[b-x8fcjj2t8n] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.topic-card[b-x8fcjj2t8n] {
    min-height: 145px;
    padding: 22px;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: white;
}

.topic-card strong[b-x8fcjj2t8n] {
    color: var(--text);
    font-size: 15px;
}

.topic-card span[b-x8fcjj2t8n] {
    margin-top: 9px;
    color: var(--muted);
    font-size: 12.5px;
    line-height: 1.62;
}

.topic-card:hover[b-x8fcjj2t8n] {
    border-color: #bcc8d8;
}

/* CTA */

.final-cta[b-x8fcjj2t8n] {
    padding: 92px 0;
    background: var(--navy);
    color: white;
}

.final-cta-inner[b-x8fcjj2t8n] {
    max-width: 840px;
    text-align: center;
}

.final-cta-inner > span[b-x8fcjj2t8n] {
    color: #aebfff;
    font-size: 12px;
    font-weight: 750;
}

.final-cta h2[b-x8fcjj2t8n] {
    margin: 13px auto 0;
    max-width: 760px;
    color: white;
    font-size: clamp(34px, 4vw, 50px);
    line-height: 1.11;
    letter-spacing: -0.04em;
}

.final-cta p[b-x8fcjj2t8n] {
    max-width: 650px;
    margin: 20px auto 27px;
    color: #bec9d6;
    font-size: 15px;
    line-height: 1.7;
}

.cta-button[b-x8fcjj2t8n] {
    min-height: 48px;
    padding: 0 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 7px;
    background: white;
    color: var(--navy);
    font-size: 13px;
    font-weight: 750;
}

/* Footer */

.site-footer[b-x8fcjj2t8n] {
    padding: 46px 0;
    background: #070d16;
    color: #9ba8b8;
}

.footer-shell[b-x8fcjj2t8n] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
}

.site-footer p[b-x8fcjj2t8n] {
    margin: 10px 0 0;
    color: #7f8da0;
    font-size: 11px;
}

.footer-links[b-x8fcjj2t8n] {
    display: flex;
    flex-wrap: wrap;
    gap: 22px;
}

.footer-links a[b-x8fcjj2t8n] {
    color: #9ba8b8;
    font-size: 12px;
}

.footer-links a:hover[b-x8fcjj2t8n] {
    color: white;
}

/* Responsive */

@media (max-width: 980px) {
    .featured-card[b-x8fcjj2t8n] {
        grid-template-columns: 1fr;
    }

    .featured-visual[b-x8fcjj2t8n] {
        min-height: 300px;
    }

    .article-grid[b-x8fcjj2t8n] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .topics-layout[b-x8fcjj2t8n] {
        grid-template-columns: 1fr;
        gap: 40px;
    }
}

@media (max-width: 720px) {
    .shell[b-x8fcjj2t8n] {
        width: min(100% - 32px, 1160px);
    }

    .site-nav > a:not(.nav-button)[b-x8fcjj2t8n] {
        display: none;
    }

    .blog-hero[b-x8fcjj2t8n] {
        padding: 72px 0 68px;
    }

    .hero-shell[b-x8fcjj2t8n] {
        margin-left: auto;
    }

    .blog-hero h1[b-x8fcjj2t8n] {
        font-size: clamp(38px, 11vw, 50px);
    }

    .blog-hero p[b-x8fcjj2t8n] {
        font-size: 16px;
    }

    .featured-section[b-x8fcjj2t8n] {
        padding: 65px 0 40px;
    }

    .section-heading[b-x8fcjj2t8n] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .featured-copy[b-x8fcjj2t8n] {
        padding: 28px 24px;
    }

    .featured-copy h3[b-x8fcjj2t8n] {
        font-size: 28px;
    }

    .featured-visual[b-x8fcjj2t8n] {
        min-height: 270px;
        padding: 24px;
    }

    .article-grid[b-x8fcjj2t8n],
    .topic-grid[b-x8fcjj2t8n] {
        grid-template-columns: 1fr;
    }

    .articles-section[b-x8fcjj2t8n] {
        padding: 50px 0 74px;
    }

    .topics-section[b-x8fcjj2t8n],
    .final-cta[b-x8fcjj2t8n] {
        padding: 70px 0;
    }

    .footer-shell[b-x8fcjj2t8n] {
        flex-direction: column;
    }
}
/* /Pages/Marketing/Blog/BuildVsBuyMcpServer.razor.rz.scp.css */
.blog-page[b-ohko6rqzvg] {
    --navy: #0b1422;
    --text: #101828;
    --text-2: #344054;
    --muted: #667085;
    --border: #dfe5ec;
    --surface-2: #f7f9fc;
    --blue: #3b63df;
    --blue-soft: #eef2ff;
    --green: #187b57;
    min-height: 100vh;
    background: #fff;
    color: var(--text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.blog-page *[b-ohko6rqzvg], .blog-page *[b-ohko6rqzvg]::before, .blog-page *[b-ohko6rqzvg]::after { box-sizing: border-box; }
.blog-page a[b-ohko6rqzvg] { text-decoration: none; }
.shell[b-ohko6rqzvg] { width: min(1160px, calc(100% - 48px)); margin-inline: auto; }

.site-header[b-ohko6rqzvg] { border-bottom: 1px solid rgba(255,255,255,.08); background: var(--navy); }
.nav-shell[b-ohko6rqzvg] { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.brand[b-ohko6rqzvg] { display: inline-flex; align-items: center; gap: 10px; color: #fff; font-size: 19px; font-weight: 750; }
.brand-logo[b-ohko6rqzvg] { display: block; border-radius: 6px; }
.site-nav[b-ohko6rqzvg] { display: flex; align-items: center; gap: 28px; }
.site-nav > a[b-ohko6rqzvg] { color: #c7d2df; font-size: 14px; font-weight: 600; }
.site-nav > a:hover[b-ohko6rqzvg], .site-nav > a.active[b-ohko6rqzvg] { color: #fff; }
.site-nav .nav-button[b-ohko6rqzvg] { padding: 9px 14px; border: 1px solid #44546a; border-radius: 7px; color: #fff; }

.article-hero[b-ohko6rqzvg] { padding: 82px 0 74px; background: var(--navy); color: #fff; }
.article-shell[b-ohko6rqzvg] { max-width: 870px; }
.back-link[b-ohko6rqzvg] { display: inline-block; margin-bottom: 42px; color: #aebbd0; font-size: 13px; font-weight: 650; }
.article-kicker[b-ohko6rqzvg] { margin-bottom: 16px; color: #aebfff; font-size: 13px; font-weight: 750; }
.article-hero h1[b-ohko6rqzvg] { margin: 0; max-width: 860px; color: #fff; font-size: clamp(40px,5vw,64px); line-height: 1.07; letter-spacing: -.045em; }
.article-lead[b-ohko6rqzvg] { max-width: 780px; margin: 26px 0 0; color: #c4cedb; font-size: 19px; line-height: 1.72; }
.article-meta[b-ohko6rqzvg] { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 9px; color: #8f9daf; font-size: 12px; }

.article[b-ohko6rqzvg] { padding: 76px 0 105px; }
.article-layout[b-ohko6rqzvg] { display: grid; grid-template-columns: 220px minmax(0,760px); justify-content: center; gap: 72px; }
.toc[b-ohko6rqzvg] { position: sticky; top: 28px; display: flex; flex-direction: column; gap: 12px; padding: 20px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.toc strong[b-ohko6rqzvg] { margin-bottom: 4px; color: var(--text); font-size: 12px; }
.toc a[b-ohko6rqzvg] { color: var(--muted); font-size: 12px; line-height: 1.45; }
.toc a:hover[b-ohko6rqzvg] { color: var(--blue); }

.article-content section[b-ohko6rqzvg] { scroll-margin-top: 28px; margin-bottom: 66px; }
.article-content h2[b-ohko6rqzvg] { margin: 0 0 21px; color: var(--text); font-size: 31px; line-height: 1.2; letter-spacing: -.03em; }
.article-content p[b-ohko6rqzvg] { margin: 0 0 20px; color: var(--text-2); font-size: 16.5px; line-height: 1.82; }
.article-content blockquote[b-ohko6rqzvg] { margin: 31px 0; padding: 20px 23px; border-left: 3px solid var(--blue); background: var(--surface-2); color: var(--text); font-size: 19px; font-weight: 650; line-height: 1.6; }
.example-list[b-ohko6rqzvg] { margin: 28px 0; display: grid; gap: 10px; }
.example-list > div[b-ohko6rqzvg] { padding: 15px 17px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface-2); color: var(--text-2); font-size: 14px; }

.architecture[b-ohko6rqzvg] { margin: 30px 0; padding: 22px; display: flex; align-items: center; gap: 10px; overflow-x: auto; border: 1px solid var(--border); border-radius: 9px; background: #fbfcfe; }
.architecture > div[b-ohko6rqzvg] { flex: 0 0 auto; padding: 10px 12px; border: 1px solid #d8e0ea; border-radius: 6px; background: #fff; color: var(--text); font-size: 11px; font-weight: 700; white-space: nowrap; }
.architecture > span[b-ohko6rqzvg] { color: #98a2b3; }
.architecture-primary[b-ohko6rqzvg] { border-color: #cbd6f9; background: #f7f9ff; }
.architecture-primary > div:nth-of-type(3)[b-ohko6rqzvg] { border-color: #9eb1f3; background: var(--blue-soft); color: #294ab1; }

.callout[b-ohko6rqzvg] { margin: 31px 0; padding: 22px 24px; border: 1px solid #c9d6d0; border-left: 4px solid var(--green); border-radius: 8px; background: #f6faf8; }
.callout strong[b-ohko6rqzvg] { color: #173a2d; font-size: 15px; }
.callout p[b-ohko6rqzvg] { margin: 6px 0 0; color: #415d52; font-size: 14px; }

.stack[b-ohko6rqzvg] { margin: 31px 0; display: grid; gap: 12px; }
.stack > div[b-ohko6rqzvg] { padding: 20px; display: grid; grid-template-columns: 34px 1fr; gap: 15px; border: 1px solid var(--border); border-radius: 8px; background: #fff; }
.stack > div > span[b-ohko6rqzvg] { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 7px; background: var(--blue-soft); color: #3154bd; font-size: 12px; font-weight: 800; }
.stack strong[b-ohko6rqzvg] { color: var(--text); font-size: 15px; }
.stack p[b-ohko6rqzvg] { margin: 4px 0 0; color: var(--muted); font-size: 13.5px; line-height: 1.65; }

.article-cta[b-ohko6rqzvg] { margin-top: 39px; padding: 29px; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 28px; border-radius: 10px; background: var(--navy); }
.cta-label[b-ohko6rqzvg] { display: block; margin-bottom: 8px; color: #aebfff; font-size: 11px; font-weight: 750; }
.article-cta h3[b-ohko6rqzvg] { margin: 0; color: #fff; font-size: 22px; line-height: 1.25; }
.article-cta p[b-ohko6rqzvg] { max-width: 510px; margin: 9px 0 0; color: #bcc7d5; font-size: 13px; line-height: 1.65; }
.cta-button[b-ohko6rqzvg] { min-height: 46px; padding: 0 18px; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; background: var(--blue); color: #fff; font-size: 13px; font-weight: 750; white-space: nowrap; }

.faq-section[b-ohko6rqzvg] { margin-bottom: 0 !important; }
.faq-section details[b-ohko6rqzvg] { border-top: 1px solid var(--border); }
.faq-section details:last-child[b-ohko6rqzvg] { border-bottom: 1px solid var(--border); }
.faq-section summary[b-ohko6rqzvg] { padding: 19px 32px 19px 0; color: var(--text); font-size: 15px; font-weight: 700; cursor: pointer; }
.faq-section details p[b-ohko6rqzvg] { margin: 0 0 20px; max-width: 700px; color: var(--muted); font-size: 14px; }

.final-cta[b-ohko6rqzvg] { padding: 88px 0; background: var(--navy); color: #fff; }
.final-cta-inner[b-ohko6rqzvg] { max-width: 850px; text-align: center; }
.final-cta span[b-ohko6rqzvg] { color: #aebfff; font-size: 12px; font-weight: 750; }
.final-cta h2[b-ohko6rqzvg] { margin: 13px auto 0; max-width: 760px; color: #fff; font-size: clamp(34px,4vw,48px); line-height: 1.12; letter-spacing: -.038em; }
.final-cta p[b-ohko6rqzvg] { max-width: 650px; margin: 19px auto 25px; color: #bec9d6; font-size: 15px; line-height: 1.7; }
.cta-button-light[b-ohko6rqzvg] { background: #fff; color: var(--navy); }

.site-footer[b-ohko6rqzvg] { padding: 44px 0; background: #070d16; color: #9ba8b8; }
.footer-shell[b-ohko6rqzvg] { display: flex; justify-content: space-between; align-items: flex-start; gap: 30px; }
.site-footer p[b-ohko6rqzvg] { margin: 10px 0 0; color: #7f8da0; font-size: 11px; }
.footer-links[b-ohko6rqzvg] { display: flex; flex-wrap: wrap; gap: 22px; }
.footer-links a[b-ohko6rqzvg] { color: #9ba8b8; font-size: 12px; }

@media (max-width: 900px) {
    .article-layout[b-ohko6rqzvg] { grid-template-columns: 1fr; max-width: 780px; gap: 26px; }
    .article-sidebar[b-ohko6rqzvg] { display: none; }
    .article-cta[b-ohko6rqzvg] { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
    .shell[b-ohko6rqzvg] { width: min(100% - 32px,1160px); }
    .site-nav > a:not(.nav-button)[b-ohko6rqzvg] { display: none; }
    .article-hero[b-ohko6rqzvg] { padding: 58px 0 55px; }
    .back-link[b-ohko6rqzvg] { margin-bottom: 30px; }
    .article-hero h1[b-ohko6rqzvg] { font-size: clamp(36px,10vw,48px); }
    .article-lead[b-ohko6rqzvg] { font-size: 17px; }
    .article[b-ohko6rqzvg] { padding: 56px 0 75px; }
    .article-content section[b-ohko6rqzvg] { margin-bottom: 52px; }
    .article-content h2[b-ohko6rqzvg] { font-size: 27px; }
    .article-content p[b-ohko6rqzvg] { font-size: 16px; }
    .architecture[b-ohko6rqzvg] { padding: 17px; }
    .final-cta[b-ohko6rqzvg] { padding: 68px 0; }
    .footer-shell[b-ohko6rqzvg] { flex-direction: column; }
}


/* ============================================================
   MCP DATABASE ARTICLE ELEMENTS
   ============================================================ */

.quick-answer[b-ohko6rqzvg] {
    margin: 0 0 62px;
    padding: 28px 30px;
    border: 1px solid #ccd8f6;
    border-left: 4px solid #3b63df;
    border-radius: 9px;
    background: #f5f7ff;
}

.quick-answer-label[b-ohko6rqzvg] {
    display: block;
    margin-bottom: 11px;
    color: #3154bd;
    font-size: 12px;
    font-weight: 780;
    letter-spacing: 0.02em;
}

.quick-answer p[b-ohko6rqzvg] {
    margin: 0;
    font-size: 15.5px;
    line-height: 1.76;
}

.article-content strong[b-ohko6rqzvg] {
    color: #17243a;
}

.article-content code[b-ohko6rqzvg] {
    padding: 2px 5px;
    border-radius: 4px;
    background: #f1f4f9;
    color: #214993;
    font-size: 0.9em;
}

.architecture .architecture-focus[b-ohko6rqzvg] {
    border-color: #9eb1f3;
    background: #e9efff;
    color: #294ab1;
}

.capability-grid[b-ohko6rqzvg] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 31px 0;
}

.capability-card[b-ohko6rqzvg] {
    min-width: 0;
    padding: 20px 18px;
    border: 1px solid #dfe5ec;
    border-radius: 9px;
    background: #fbfcfe;
}

.capability-tag[b-ohko6rqzvg] {
    margin-bottom: 13px;
    color: #3154bd;
    font-size: 11px;
    font-weight: 750;
}

.capability-card h3[b-ohko6rqzvg] {
    color: #101828;
    font-size: 15px;
    line-height: 1.35;
}

.capability-card p[b-ohko6rqzvg] {
    margin: 9px 0 0;
    color: #667085;
    font-size: 12.5px;
    line-height: 1.65;
}

.identity-comparison[b-ohko6rqzvg] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin: 31px 0;
}

.identity-panel[b-ohko6rqzvg] {
    padding: 23px 22px;
    border: 1px solid #e8d3d5;
    border-radius: 9px;
    background: #fffafb;
}

.identity-panel-safe[b-ohko6rqzvg] {
    border-color: #bbd8ca;
    background: #f7fbf9;
}

.identity-kicker[b-ohko6rqzvg] {
    display: block;
    margin-bottom: 12px;
    color: #97515a;
    font-size: 11px;
    font-weight: 750;
    line-height: 1.5;
}

.identity-panel-safe .identity-kicker[b-ohko6rqzvg] {
    color: #247052;
}

.identity-panel > strong[b-ohko6rqzvg] {
    display: block;
    font-size: 15px;
}

.identity-panel > p[b-ohko6rqzvg] {
    margin: 10px 0 0;
    font-size: 12.5px;
    line-height: 1.7;
}

.policy-example[b-ohko6rqzvg] {
    margin: 32px 0 8px;
    overflow: hidden;
    border: 1px solid #dfe5ec;
    border-radius: 9px;
    background: white;
}

.policy-head[b-ohko6rqzvg] {
    padding: 18px 20px 13px;
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 10px;
    border-bottom: 1px solid #e4e9ef;
    background: #f4f6fa;
    color: #344054;
    font-size: 12px;
    font-weight: 750;
    text-align: center;
}

.policy-head > div:first-child[b-ohko6rqzvg] {
    text-align: left;
}

.policy-row[b-ohko6rqzvg] {
    padding: 14px 20px;
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 10px;
    border-bottom: 1px solid #eef1f5;
    align-items: center;
    font-size: 12px;
}

.policy-row:last-child[b-ohko6rqzvg] {
    border-bottom: 0;
}

.policy-row > span:not(:first-child)[b-ohko6rqzvg] {
    font-size: 11px;
    font-weight: 750;
    text-align: center;
}

.policy-allowed[b-ohko6rqzvg] { color: #197251; }
.policy-denied[b-ohko6rqzvg] { color: #a65058; }

.article-content p.example-note[b-ohko6rqzvg] {
    margin-bottom: 24px;
    color: #7b8797;
    font-size: 11.5px;
}

.article-content a.inline-link[b-ohko6rqzvg],
.article-sources a[b-ohko6rqzvg] {
    color: #3154bd;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.related-card[b-ohko6rqzvg] {
    display: block;
    padding: 26px 28px;
    border: 1px solid #d9e1ed;
    border-radius: 9px;
    background: #f9fbff;
}

.related-card > span:first-child[b-ohko6rqzvg] {
    display: block;
    color: #3154bd;
    font-size: 11px;
    font-weight: 750;
}

.related-card strong[b-ohko6rqzvg] {
    display: block;
    margin-top: 11px;
    color: #16243a;
    font-size: 19px;
    line-height: 1.35;
}

.related-card p[b-ohko6rqzvg] {
    margin: 11px 0 0;
    color: #667085;
    font-size: 13px;
}

.related-card .related-arrow[b-ohko6rqzvg] {
    display: block;
    margin-top: 20px;
    color: #3154bd;
    font-size: 12px;
    font-weight: 750;
}

.article-sources[b-ohko6rqzvg] {
    padding-top: 22px;
    border-top: 1px solid #dfe5ec;
}

.article-sources > strong[b-ohko6rqzvg] {
    color: #344054;
    font-size: 13px;
}

.article-sources p[b-ohko6rqzvg] {
    margin: 9px 0 0;
    color: #667085;
    font-size: 12.5px;
    line-height: 1.75;
}

@media (max-width: 720px) {
    .quick-answer[b-ohko6rqzvg] { padding: 22px; margin-bottom: 49px; }
    .capability-grid[b-ohko6rqzvg], .identity-comparison[b-ohko6rqzvg] { grid-template-columns: 1fr; }
    .policy-head[b-ohko6rqzvg] { padding-inline: 12px; }
    .policy-row[b-ohko6rqzvg] { padding-inline: 12px; grid-template-columns: 1.3fr 1fr 1fr; }
    .related-card[b-ohko6rqzvg] { padding: 21px; }
}


/* New ScopeBase articles: clear long-form reading and accessible tables */
.article-layout[b-ohko6rqzvg], .article-content[b-ohko6rqzvg] { min-width: 0; }
@media (max-width: 900px) { .article-layout[b-ohko6rqzvg] { grid-template-columns: minmax(0, 1fr); } }
.article-content p a[b-ohko6rqzvg],
.article-content li a[b-ohko6rqzvg],
.article-content .source-links a[b-ohko6rqzvg] {
    color: #294eb9;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.article-content p a:hover[b-ohko6rqzvg],
.article-content li a:hover[b-ohko6rqzvg] { color: #183889; }
.article-content ul[b-ohko6rqzvg],
.article-content ol[b-ohko6rqzvg] { margin: 0 0 25px; padding-left: 25px; color: var(--text-2); font-size: 16px; line-height: 1.8; }
.article-content li[b-ohko6rqzvg] { margin-bottom: 9px; padding-left: 2px; }
.article-content h3[b-ohko6rqzvg] { margin: 28px 0 12px; color: var(--text); font-size: 21px; line-height: 1.35; }
.article-content .lede-strong[b-ohko6rqzvg] { font-weight: 700; color: var(--text); }
.article-content .source-links[b-ohko6rqzvg] { padding-top: 22px; margin-top: 30px; border-top: 1px solid var(--border); }
.article-content .source-links h3[b-ohko6rqzvg] { margin-top: 0; font-size: 16px; }
.article-content .source-links p[b-ohko6rqzvg] { font-size: 13.5px; color: var(--muted); }
.article-content .action-link[b-ohko6rqzvg] { font-weight: 700; }
.comparison-table-wrap[b-ohko6rqzvg] { overflow-x: auto; margin: 26px 0; border: 1px solid var(--border); border-radius: 9px; }
.comparison-table[b-ohko6rqzvg] { width: 100%; border-collapse: collapse; min-width: 565px; }
.comparison-table th[b-ohko6rqzvg], .comparison-table td[b-ohko6rqzvg] { padding: 15px 16px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--border); font-size: 13.5px; line-height: 1.6; }
.comparison-table th[b-ohko6rqzvg] { background: #f1f4f9; color: #17243a; font-weight: 750; }
.comparison-table td[b-ohko6rqzvg] { color: #344054; }
.comparison-table tbody tr:last-child td[b-ohko6rqzvg] { border-bottom: 0; }
.comparison-table td:first-child[b-ohko6rqzvg] { font-weight: 700; color: #17243a; }
.article-content .article-cta .cta-button[b-ohko6rqzvg] { text-decoration: none; }
.article-content .related-card[b-ohko6rqzvg] { text-decoration: none; }
.article-content .related-card:hover[b-ohko6rqzvg] { border-color: #a3b8ec; }
.article-content section[id][b-ohko6rqzvg] { scroll-margin-top: 32px; }
@media (max-width: 720px) {
    .article-content ul[b-ohko6rqzvg], .article-content ol[b-ohko6rqzvg] { font-size: 15px; padding-left: 21px; }
    .article-content h3[b-ohko6rqzvg] { font-size: 19px; }
    .comparison-table th[b-ohko6rqzvg], .comparison-table td[b-ohko6rqzvg] { padding: 12px; }
}
/* /Pages/Marketing/Blog/ClaudeSqlServerGuide.razor.rz.scp.css */
.blog-page[b-9r48j9tr2z] {
    --navy: #0b1422;
    --text: #101828;
    --text-2: #344054;
    --muted: #667085;
    --border: #dfe5ec;
    --surface-2: #f7f9fc;
    --blue: #3b63df;
    --blue-soft: #eef2ff;
    --green: #187b57;
    min-height: 100vh;
    background: #fff;
    color: var(--text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.blog-page *[b-9r48j9tr2z], .blog-page *[b-9r48j9tr2z]::before, .blog-page *[b-9r48j9tr2z]::after { box-sizing: border-box; }
.blog-page a[b-9r48j9tr2z] { text-decoration: none; }
.shell[b-9r48j9tr2z] { width: min(1160px, calc(100% - 48px)); margin-inline: auto; }

.site-header[b-9r48j9tr2z] { border-bottom: 1px solid rgba(255,255,255,.08); background: var(--navy); }
.nav-shell[b-9r48j9tr2z] { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.brand[b-9r48j9tr2z] { display: inline-flex; align-items: center; gap: 10px; color: #fff; font-size: 19px; font-weight: 750; }
.brand-logo[b-9r48j9tr2z] { display: block; border-radius: 6px; }
.site-nav[b-9r48j9tr2z] { display: flex; align-items: center; gap: 28px; }
.site-nav > a[b-9r48j9tr2z] { color: #c7d2df; font-size: 14px; font-weight: 600; }
.site-nav > a:hover[b-9r48j9tr2z], .site-nav > a.active[b-9r48j9tr2z] { color: #fff; }
.site-nav .nav-button[b-9r48j9tr2z] { padding: 9px 14px; border: 1px solid #44546a; border-radius: 7px; color: #fff; }

.article-hero[b-9r48j9tr2z] { padding: 82px 0 74px; background: var(--navy); color: #fff; }
.article-shell[b-9r48j9tr2z] { max-width: 870px; }
.back-link[b-9r48j9tr2z] { display: inline-block; margin-bottom: 42px; color: #aebbd0; font-size: 13px; font-weight: 650; }
.article-kicker[b-9r48j9tr2z] { margin-bottom: 16px; color: #aebfff; font-size: 13px; font-weight: 750; }
.article-hero h1[b-9r48j9tr2z] { margin: 0; max-width: 860px; color: #fff; font-size: clamp(40px,5vw,64px); line-height: 1.07; letter-spacing: -.045em; }
.article-lead[b-9r48j9tr2z] { max-width: 780px; margin: 26px 0 0; color: #c4cedb; font-size: 19px; line-height: 1.72; }
.article-meta[b-9r48j9tr2z] { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 9px; color: #8f9daf; font-size: 12px; }

.article[b-9r48j9tr2z] { padding: 76px 0 105px; }
.article-layout[b-9r48j9tr2z] { display: grid; grid-template-columns: 220px minmax(0,760px); justify-content: center; gap: 72px; }
.toc[b-9r48j9tr2z] { position: sticky; top: 28px; display: flex; flex-direction: column; gap: 12px; padding: 20px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.toc strong[b-9r48j9tr2z] { margin-bottom: 4px; color: var(--text); font-size: 12px; }
.toc a[b-9r48j9tr2z] { color: var(--muted); font-size: 12px; line-height: 1.45; }
.toc a:hover[b-9r48j9tr2z] { color: var(--blue); }

.article-content section[b-9r48j9tr2z] { scroll-margin-top: 28px; margin-bottom: 66px; }
.article-content h2[b-9r48j9tr2z] { margin: 0 0 21px; color: var(--text); font-size: 31px; line-height: 1.2; letter-spacing: -.03em; }
.article-content p[b-9r48j9tr2z] { margin: 0 0 20px; color: var(--text-2); font-size: 16.5px; line-height: 1.82; }
.article-content blockquote[b-9r48j9tr2z] { margin: 31px 0; padding: 20px 23px; border-left: 3px solid var(--blue); background: var(--surface-2); color: var(--text); font-size: 19px; font-weight: 650; line-height: 1.6; }
.example-list[b-9r48j9tr2z] { margin: 28px 0; display: grid; gap: 10px; }
.example-list > div[b-9r48j9tr2z] { padding: 15px 17px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface-2); color: var(--text-2); font-size: 14px; }

.architecture[b-9r48j9tr2z] { margin: 30px 0; padding: 22px; display: flex; align-items: center; gap: 10px; overflow-x: auto; border: 1px solid var(--border); border-radius: 9px; background: #fbfcfe; }
.architecture > div[b-9r48j9tr2z] { flex: 0 0 auto; padding: 10px 12px; border: 1px solid #d8e0ea; border-radius: 6px; background: #fff; color: var(--text); font-size: 11px; font-weight: 700; white-space: nowrap; }
.architecture > span[b-9r48j9tr2z] { color: #98a2b3; }
.architecture-primary[b-9r48j9tr2z] { border-color: #cbd6f9; background: #f7f9ff; }
.architecture-primary > div:nth-of-type(3)[b-9r48j9tr2z] { border-color: #9eb1f3; background: var(--blue-soft); color: #294ab1; }

.callout[b-9r48j9tr2z] { margin: 31px 0; padding: 22px 24px; border: 1px solid #c9d6d0; border-left: 4px solid var(--green); border-radius: 8px; background: #f6faf8; }
.callout strong[b-9r48j9tr2z] { color: #173a2d; font-size: 15px; }
.callout p[b-9r48j9tr2z] { margin: 6px 0 0; color: #415d52; font-size: 14px; }

.stack[b-9r48j9tr2z] { margin: 31px 0; display: grid; gap: 12px; }
.stack > div[b-9r48j9tr2z] { padding: 20px; display: grid; grid-template-columns: 34px 1fr; gap: 15px; border: 1px solid var(--border); border-radius: 8px; background: #fff; }
.stack > div > span[b-9r48j9tr2z] { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 7px; background: var(--blue-soft); color: #3154bd; font-size: 12px; font-weight: 800; }
.stack strong[b-9r48j9tr2z] { color: var(--text); font-size: 15px; }
.stack p[b-9r48j9tr2z] { margin: 4px 0 0; color: var(--muted); font-size: 13.5px; line-height: 1.65; }

.article-cta[b-9r48j9tr2z] { margin-top: 39px; padding: 29px; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 28px; border-radius: 10px; background: var(--navy); }
.cta-label[b-9r48j9tr2z] { display: block; margin-bottom: 8px; color: #aebfff; font-size: 11px; font-weight: 750; }
.article-cta h3[b-9r48j9tr2z] { margin: 0; color: #fff; font-size: 22px; line-height: 1.25; }
.article-cta p[b-9r48j9tr2z] { max-width: 510px; margin: 9px 0 0; color: #bcc7d5; font-size: 13px; line-height: 1.65; }
.cta-button[b-9r48j9tr2z] { min-height: 46px; padding: 0 18px; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; background: var(--blue); color: #fff; font-size: 13px; font-weight: 750; white-space: nowrap; }

.faq-section[b-9r48j9tr2z] { margin-bottom: 0 !important; }
.faq-section details[b-9r48j9tr2z] { border-top: 1px solid var(--border); }
.faq-section details:last-child[b-9r48j9tr2z] { border-bottom: 1px solid var(--border); }
.faq-section summary[b-9r48j9tr2z] { padding: 19px 32px 19px 0; color: var(--text); font-size: 15px; font-weight: 700; cursor: pointer; }
.faq-section details p[b-9r48j9tr2z] { margin: 0 0 20px; max-width: 700px; color: var(--muted); font-size: 14px; }

.final-cta[b-9r48j9tr2z] { padding: 88px 0; background: var(--navy); color: #fff; }
.final-cta-inner[b-9r48j9tr2z] { max-width: 850px; text-align: center; }
.final-cta span[b-9r48j9tr2z] { color: #aebfff; font-size: 12px; font-weight: 750; }
.final-cta h2[b-9r48j9tr2z] { margin: 13px auto 0; max-width: 760px; color: #fff; font-size: clamp(34px,4vw,48px); line-height: 1.12; letter-spacing: -.038em; }
.final-cta p[b-9r48j9tr2z] { max-width: 650px; margin: 19px auto 25px; color: #bec9d6; font-size: 15px; line-height: 1.7; }
.cta-button-light[b-9r48j9tr2z] { background: #fff; color: var(--navy); }

.site-footer[b-9r48j9tr2z] { padding: 44px 0; background: #070d16; color: #9ba8b8; }
.footer-shell[b-9r48j9tr2z] { display: flex; justify-content: space-between; align-items: flex-start; gap: 30px; }
.site-footer p[b-9r48j9tr2z] { margin: 10px 0 0; color: #7f8da0; font-size: 11px; }
.footer-links[b-9r48j9tr2z] { display: flex; flex-wrap: wrap; gap: 22px; }
.footer-links a[b-9r48j9tr2z] { color: #9ba8b8; font-size: 12px; }

@media (max-width: 900px) {
    .article-layout[b-9r48j9tr2z] { grid-template-columns: 1fr; max-width: 780px; gap: 26px; }
    .article-sidebar[b-9r48j9tr2z] { display: none; }
    .article-cta[b-9r48j9tr2z] { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
    .shell[b-9r48j9tr2z] { width: min(100% - 32px,1160px); }
    .site-nav > a:not(.nav-button)[b-9r48j9tr2z] { display: none; }
    .article-hero[b-9r48j9tr2z] { padding: 58px 0 55px; }
    .back-link[b-9r48j9tr2z] { margin-bottom: 30px; }
    .article-hero h1[b-9r48j9tr2z] { font-size: clamp(36px,10vw,48px); }
    .article-lead[b-9r48j9tr2z] { font-size: 17px; }
    .article[b-9r48j9tr2z] { padding: 56px 0 75px; }
    .article-content section[b-9r48j9tr2z] { margin-bottom: 52px; }
    .article-content h2[b-9r48j9tr2z] { font-size: 27px; }
    .article-content p[b-9r48j9tr2z] { font-size: 16px; }
    .architecture[b-9r48j9tr2z] { padding: 17px; }
    .final-cta[b-9r48j9tr2z] { padding: 68px 0; }
    .footer-shell[b-9r48j9tr2z] { flex-direction: column; }
}


/* ============================================================
   MCP DATABASE ARTICLE ELEMENTS
   ============================================================ */

.quick-answer[b-9r48j9tr2z] {
    margin: 0 0 62px;
    padding: 28px 30px;
    border: 1px solid #ccd8f6;
    border-left: 4px solid #3b63df;
    border-radius: 9px;
    background: #f5f7ff;
}

.quick-answer-label[b-9r48j9tr2z] {
    display: block;
    margin-bottom: 11px;
    color: #3154bd;
    font-size: 12px;
    font-weight: 780;
    letter-spacing: 0.02em;
}

.quick-answer p[b-9r48j9tr2z] {
    margin: 0;
    font-size: 15.5px;
    line-height: 1.76;
}

.article-content strong[b-9r48j9tr2z] {
    color: #17243a;
}

.article-content code[b-9r48j9tr2z] {
    padding: 2px 5px;
    border-radius: 4px;
    background: #f1f4f9;
    color: #214993;
    font-size: 0.9em;
}

.architecture .architecture-focus[b-9r48j9tr2z] {
    border-color: #9eb1f3;
    background: #e9efff;
    color: #294ab1;
}

.capability-grid[b-9r48j9tr2z] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 31px 0;
}

.capability-card[b-9r48j9tr2z] {
    min-width: 0;
    padding: 20px 18px;
    border: 1px solid #dfe5ec;
    border-radius: 9px;
    background: #fbfcfe;
}

.capability-tag[b-9r48j9tr2z] {
    margin-bottom: 13px;
    color: #3154bd;
    font-size: 11px;
    font-weight: 750;
}

.capability-card h3[b-9r48j9tr2z] {
    color: #101828;
    font-size: 15px;
    line-height: 1.35;
}

.capability-card p[b-9r48j9tr2z] {
    margin: 9px 0 0;
    color: #667085;
    font-size: 12.5px;
    line-height: 1.65;
}

.identity-comparison[b-9r48j9tr2z] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin: 31px 0;
}

.identity-panel[b-9r48j9tr2z] {
    padding: 23px 22px;
    border: 1px solid #e8d3d5;
    border-radius: 9px;
    background: #fffafb;
}

.identity-panel-safe[b-9r48j9tr2z] {
    border-color: #bbd8ca;
    background: #f7fbf9;
}

.identity-kicker[b-9r48j9tr2z] {
    display: block;
    margin-bottom: 12px;
    color: #97515a;
    font-size: 11px;
    font-weight: 750;
    line-height: 1.5;
}

.identity-panel-safe .identity-kicker[b-9r48j9tr2z] {
    color: #247052;
}

.identity-panel > strong[b-9r48j9tr2z] {
    display: block;
    font-size: 15px;
}

.identity-panel > p[b-9r48j9tr2z] {
    margin: 10px 0 0;
    font-size: 12.5px;
    line-height: 1.7;
}

.policy-example[b-9r48j9tr2z] {
    margin: 32px 0 8px;
    overflow: hidden;
    border: 1px solid #dfe5ec;
    border-radius: 9px;
    background: white;
}

.policy-head[b-9r48j9tr2z] {
    padding: 18px 20px 13px;
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 10px;
    border-bottom: 1px solid #e4e9ef;
    background: #f4f6fa;
    color: #344054;
    font-size: 12px;
    font-weight: 750;
    text-align: center;
}

.policy-head > div:first-child[b-9r48j9tr2z] {
    text-align: left;
}

.policy-row[b-9r48j9tr2z] {
    padding: 14px 20px;
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 10px;
    border-bottom: 1px solid #eef1f5;
    align-items: center;
    font-size: 12px;
}

.policy-row:last-child[b-9r48j9tr2z] {
    border-bottom: 0;
}

.policy-row > span:not(:first-child)[b-9r48j9tr2z] {
    font-size: 11px;
    font-weight: 750;
    text-align: center;
}

.policy-allowed[b-9r48j9tr2z] { color: #197251; }
.policy-denied[b-9r48j9tr2z] { color: #a65058; }

.article-content p.example-note[b-9r48j9tr2z] {
    margin-bottom: 24px;
    color: #7b8797;
    font-size: 11.5px;
}

.article-content a.inline-link[b-9r48j9tr2z],
.article-sources a[b-9r48j9tr2z] {
    color: #3154bd;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.related-card[b-9r48j9tr2z] {
    display: block;
    padding: 26px 28px;
    border: 1px solid #d9e1ed;
    border-radius: 9px;
    background: #f9fbff;
}

.related-card > span:first-child[b-9r48j9tr2z] {
    display: block;
    color: #3154bd;
    font-size: 11px;
    font-weight: 750;
}

.related-card strong[b-9r48j9tr2z] {
    display: block;
    margin-top: 11px;
    color: #16243a;
    font-size: 19px;
    line-height: 1.35;
}

.related-card p[b-9r48j9tr2z] {
    margin: 11px 0 0;
    color: #667085;
    font-size: 13px;
}

.related-card .related-arrow[b-9r48j9tr2z] {
    display: block;
    margin-top: 20px;
    color: #3154bd;
    font-size: 12px;
    font-weight: 750;
}

.article-sources[b-9r48j9tr2z] {
    padding-top: 22px;
    border-top: 1px solid #dfe5ec;
}

.article-sources > strong[b-9r48j9tr2z] {
    color: #344054;
    font-size: 13px;
}

.article-sources p[b-9r48j9tr2z] {
    margin: 9px 0 0;
    color: #667085;
    font-size: 12.5px;
    line-height: 1.75;
}

@media (max-width: 720px) {
    .quick-answer[b-9r48j9tr2z] { padding: 22px; margin-bottom: 49px; }
    .capability-grid[b-9r48j9tr2z], .identity-comparison[b-9r48j9tr2z] { grid-template-columns: 1fr; }
    .policy-head[b-9r48j9tr2z] { padding-inline: 12px; }
    .policy-row[b-9r48j9tr2z] { padding-inline: 12px; grid-template-columns: 1.3fr 1fr 1fr; }
    .related-card[b-9r48j9tr2z] { padding: 21px; }
}


/* New ScopeBase articles: clear long-form reading and accessible tables */
.article-layout[b-9r48j9tr2z], .article-content[b-9r48j9tr2z] { min-width: 0; }
@media (max-width: 900px) { .article-layout[b-9r48j9tr2z] { grid-template-columns: minmax(0, 1fr); } }
.article-content p a[b-9r48j9tr2z],
.article-content li a[b-9r48j9tr2z],
.article-content .source-links a[b-9r48j9tr2z] {
    color: #294eb9;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.article-content p a:hover[b-9r48j9tr2z],
.article-content li a:hover[b-9r48j9tr2z] { color: #183889; }
.article-content ul[b-9r48j9tr2z],
.article-content ol[b-9r48j9tr2z] { margin: 0 0 25px; padding-left: 25px; color: var(--text-2); font-size: 16px; line-height: 1.8; }
.article-content li[b-9r48j9tr2z] { margin-bottom: 9px; padding-left: 2px; }
.article-content h3[b-9r48j9tr2z] { margin: 28px 0 12px; color: var(--text); font-size: 21px; line-height: 1.35; }
.article-content .lede-strong[b-9r48j9tr2z] { font-weight: 700; color: var(--text); }
.article-content .source-links[b-9r48j9tr2z] { padding-top: 22px; margin-top: 30px; border-top: 1px solid var(--border); }
.article-content .source-links h3[b-9r48j9tr2z] { margin-top: 0; font-size: 16px; }
.article-content .source-links p[b-9r48j9tr2z] { font-size: 13.5px; color: var(--muted); }
.article-content .action-link[b-9r48j9tr2z] { font-weight: 700; }
.comparison-table-wrap[b-9r48j9tr2z] { overflow-x: auto; margin: 26px 0; border: 1px solid var(--border); border-radius: 9px; }
.comparison-table[b-9r48j9tr2z] { width: 100%; border-collapse: collapse; min-width: 565px; }
.comparison-table th[b-9r48j9tr2z], .comparison-table td[b-9r48j9tr2z] { padding: 15px 16px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--border); font-size: 13.5px; line-height: 1.6; }
.comparison-table th[b-9r48j9tr2z] { background: #f1f4f9; color: #17243a; font-weight: 750; }
.comparison-table td[b-9r48j9tr2z] { color: #344054; }
.comparison-table tbody tr:last-child td[b-9r48j9tr2z] { border-bottom: 0; }
.comparison-table td:first-child[b-9r48j9tr2z] { font-weight: 700; color: #17243a; }
.article-content .article-cta .cta-button[b-9r48j9tr2z] { text-decoration: none; }
.article-content .related-card[b-9r48j9tr2z] { text-decoration: none; }
.article-content .related-card:hover[b-9r48j9tr2z] { border-color: #a3b8ec; }
.article-content section[id][b-9r48j9tr2z] { scroll-margin-top: 32px; }
@media (max-width: 720px) {
    .article-content ul[b-9r48j9tr2z], .article-content ol[b-9r48j9tr2z] { font-size: 15px; padding-left: 21px; }
    .article-content h3[b-9r48j9tr2z] { font-size: 19px; }
    .comparison-table th[b-9r48j9tr2z], .comparison-table td[b-9r48j9tr2z] { padding: 12px; }
}
/* /Pages/Marketing/Blog/EmployeeAiAccess.razor.rz.scp.css */
.blog-page[b-9k393b2eg3] {
    --navy: #0b1422;
    --text: #101828;
    --text-2: #344054;
    --muted: #667085;
    --border: #dfe5ec;
    --surface-2: #f7f9fc;
    --blue: #3b63df;
    --blue-soft: #eef2ff;
    --green: #187b57;
    min-height: 100vh;
    background: #fff;
    color: var(--text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.blog-page *[b-9k393b2eg3], .blog-page *[b-9k393b2eg3]::before, .blog-page *[b-9k393b2eg3]::after { box-sizing: border-box; }
.blog-page a[b-9k393b2eg3] { text-decoration: none; }
.shell[b-9k393b2eg3] { width: min(1160px, calc(100% - 48px)); margin-inline: auto; }

.site-header[b-9k393b2eg3] { border-bottom: 1px solid rgba(255,255,255,.08); background: var(--navy); }
.nav-shell[b-9k393b2eg3] { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.brand[b-9k393b2eg3] { display: inline-flex; align-items: center; gap: 10px; color: #fff; font-size: 19px; font-weight: 750; }
.brand-logo[b-9k393b2eg3] { display: block; border-radius: 6px; }
.site-nav[b-9k393b2eg3] { display: flex; align-items: center; gap: 28px; }
.site-nav > a[b-9k393b2eg3] { color: #c7d2df; font-size: 14px; font-weight: 600; }
.site-nav > a:hover[b-9k393b2eg3], .site-nav > a.active[b-9k393b2eg3] { color: #fff; }
.site-nav .nav-button[b-9k393b2eg3] { padding: 9px 14px; border: 1px solid #44546a; border-radius: 7px; color: #fff; }

.article-hero[b-9k393b2eg3] { padding: 82px 0 74px; background: var(--navy); color: #fff; }
.article-shell[b-9k393b2eg3] { max-width: 870px; }
.back-link[b-9k393b2eg3] { display: inline-block; margin-bottom: 42px; color: #aebbd0; font-size: 13px; font-weight: 650; }
.article-kicker[b-9k393b2eg3] { margin-bottom: 16px; color: #aebfff; font-size: 13px; font-weight: 750; }
.article-hero h1[b-9k393b2eg3] { margin: 0; max-width: 860px; color: #fff; font-size: clamp(40px,5vw,64px); line-height: 1.07; letter-spacing: -.045em; }
.article-lead[b-9k393b2eg3] { max-width: 780px; margin: 26px 0 0; color: #c4cedb; font-size: 19px; line-height: 1.72; }
.article-meta[b-9k393b2eg3] { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 9px; color: #8f9daf; font-size: 12px; }

.article[b-9k393b2eg3] { padding: 76px 0 105px; }
.article-layout[b-9k393b2eg3] { display: grid; grid-template-columns: 220px minmax(0,760px); justify-content: center; gap: 72px; }
.toc[b-9k393b2eg3] { position: sticky; top: 28px; display: flex; flex-direction: column; gap: 12px; padding: 20px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.toc strong[b-9k393b2eg3] { margin-bottom: 4px; color: var(--text); font-size: 12px; }
.toc a[b-9k393b2eg3] { color: var(--muted); font-size: 12px; line-height: 1.45; }
.toc a:hover[b-9k393b2eg3] { color: var(--blue); }

.article-content section[b-9k393b2eg3] { scroll-margin-top: 28px; margin-bottom: 66px; }
.article-content h2[b-9k393b2eg3] { margin: 0 0 21px; color: var(--text); font-size: 31px; line-height: 1.2; letter-spacing: -.03em; }
.article-content p[b-9k393b2eg3] { margin: 0 0 20px; color: var(--text-2); font-size: 16.5px; line-height: 1.82; }
.article-content blockquote[b-9k393b2eg3] { margin: 31px 0; padding: 20px 23px; border-left: 3px solid var(--blue); background: var(--surface-2); color: var(--text); font-size: 19px; font-weight: 650; line-height: 1.6; }
.example-list[b-9k393b2eg3] { margin: 28px 0; display: grid; gap: 10px; }
.example-list > div[b-9k393b2eg3] { padding: 15px 17px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface-2); color: var(--text-2); font-size: 14px; }

.architecture[b-9k393b2eg3] { margin: 30px 0; padding: 22px; display: flex; align-items: center; gap: 10px; overflow-x: auto; border: 1px solid var(--border); border-radius: 9px; background: #fbfcfe; }
.architecture > div[b-9k393b2eg3] { flex: 0 0 auto; padding: 10px 12px; border: 1px solid #d8e0ea; border-radius: 6px; background: #fff; color: var(--text); font-size: 11px; font-weight: 700; white-space: nowrap; }
.architecture > span[b-9k393b2eg3] { color: #98a2b3; }
.architecture-primary[b-9k393b2eg3] { border-color: #cbd6f9; background: #f7f9ff; }
.architecture-primary > div:nth-of-type(3)[b-9k393b2eg3] { border-color: #9eb1f3; background: var(--blue-soft); color: #294ab1; }

.callout[b-9k393b2eg3] { margin: 31px 0; padding: 22px 24px; border: 1px solid #c9d6d0; border-left: 4px solid var(--green); border-radius: 8px; background: #f6faf8; }
.callout strong[b-9k393b2eg3] { color: #173a2d; font-size: 15px; }
.callout p[b-9k393b2eg3] { margin: 6px 0 0; color: #415d52; font-size: 14px; }

.stack[b-9k393b2eg3] { margin: 31px 0; display: grid; gap: 12px; }
.stack > div[b-9k393b2eg3] { padding: 20px; display: grid; grid-template-columns: 34px 1fr; gap: 15px; border: 1px solid var(--border); border-radius: 8px; background: #fff; }
.stack > div > span[b-9k393b2eg3] { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 7px; background: var(--blue-soft); color: #3154bd; font-size: 12px; font-weight: 800; }
.stack strong[b-9k393b2eg3] { color: var(--text); font-size: 15px; }
.stack p[b-9k393b2eg3] { margin: 4px 0 0; color: var(--muted); font-size: 13.5px; line-height: 1.65; }

.article-cta[b-9k393b2eg3] { margin-top: 39px; padding: 29px; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 28px; border-radius: 10px; background: var(--navy); }
.cta-label[b-9k393b2eg3] { display: block; margin-bottom: 8px; color: #aebfff; font-size: 11px; font-weight: 750; }
.article-cta h3[b-9k393b2eg3] { margin: 0; color: #fff; font-size: 22px; line-height: 1.25; }
.article-cta p[b-9k393b2eg3] { max-width: 510px; margin: 9px 0 0; color: #bcc7d5; font-size: 13px; line-height: 1.65; }
.cta-button[b-9k393b2eg3] { min-height: 46px; padding: 0 18px; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; background: var(--blue); color: #fff; font-size: 13px; font-weight: 750; white-space: nowrap; }

.faq-section[b-9k393b2eg3] { margin-bottom: 0 !important; }
.faq-section details[b-9k393b2eg3] { border-top: 1px solid var(--border); }
.faq-section details:last-child[b-9k393b2eg3] { border-bottom: 1px solid var(--border); }
.faq-section summary[b-9k393b2eg3] { padding: 19px 32px 19px 0; color: var(--text); font-size: 15px; font-weight: 700; cursor: pointer; }
.faq-section details p[b-9k393b2eg3] { margin: 0 0 20px; max-width: 700px; color: var(--muted); font-size: 14px; }

.final-cta[b-9k393b2eg3] { padding: 88px 0; background: var(--navy); color: #fff; }
.final-cta-inner[b-9k393b2eg3] { max-width: 850px; text-align: center; }
.final-cta span[b-9k393b2eg3] { color: #aebfff; font-size: 12px; font-weight: 750; }
.final-cta h2[b-9k393b2eg3] { margin: 13px auto 0; max-width: 760px; color: #fff; font-size: clamp(34px,4vw,48px); line-height: 1.12; letter-spacing: -.038em; }
.final-cta p[b-9k393b2eg3] { max-width: 650px; margin: 19px auto 25px; color: #bec9d6; font-size: 15px; line-height: 1.7; }
.cta-button-light[b-9k393b2eg3] { background: #fff; color: var(--navy); }

.site-footer[b-9k393b2eg3] { padding: 44px 0; background: #070d16; color: #9ba8b8; }
.footer-shell[b-9k393b2eg3] { display: flex; justify-content: space-between; align-items: flex-start; gap: 30px; }
.site-footer p[b-9k393b2eg3] { margin: 10px 0 0; color: #7f8da0; font-size: 11px; }
.footer-links[b-9k393b2eg3] { display: flex; flex-wrap: wrap; gap: 22px; }
.footer-links a[b-9k393b2eg3] { color: #9ba8b8; font-size: 12px; }

@media (max-width: 900px) {
    .article-layout[b-9k393b2eg3] { grid-template-columns: 1fr; max-width: 780px; gap: 26px; }
    .article-sidebar[b-9k393b2eg3] { display: none; }
    .article-cta[b-9k393b2eg3] { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
    .shell[b-9k393b2eg3] { width: min(100% - 32px,1160px); }
    .site-nav > a:not(.nav-button)[b-9k393b2eg3] { display: none; }
    .article-hero[b-9k393b2eg3] { padding: 58px 0 55px; }
    .back-link[b-9k393b2eg3] { margin-bottom: 30px; }
    .article-hero h1[b-9k393b2eg3] { font-size: clamp(36px,10vw,48px); }
    .article-lead[b-9k393b2eg3] { font-size: 17px; }
    .article[b-9k393b2eg3] { padding: 56px 0 75px; }
    .article-content section[b-9k393b2eg3] { margin-bottom: 52px; }
    .article-content h2[b-9k393b2eg3] { font-size: 27px; }
    .article-content p[b-9k393b2eg3] { font-size: 16px; }
    .architecture[b-9k393b2eg3] { padding: 17px; }
    .final-cta[b-9k393b2eg3] { padding: 68px 0; }
    .footer-shell[b-9k393b2eg3] { flex-direction: column; }
}


/* ============================================================
   MCP DATABASE ARTICLE ELEMENTS
   ============================================================ */

.quick-answer[b-9k393b2eg3] {
    margin: 0 0 62px;
    padding: 28px 30px;
    border: 1px solid #ccd8f6;
    border-left: 4px solid #3b63df;
    border-radius: 9px;
    background: #f5f7ff;
}

.quick-answer-label[b-9k393b2eg3] {
    display: block;
    margin-bottom: 11px;
    color: #3154bd;
    font-size: 12px;
    font-weight: 780;
    letter-spacing: 0.02em;
}

.quick-answer p[b-9k393b2eg3] {
    margin: 0;
    font-size: 15.5px;
    line-height: 1.76;
}

.article-content strong[b-9k393b2eg3] {
    color: #17243a;
}

.article-content code[b-9k393b2eg3] {
    padding: 2px 5px;
    border-radius: 4px;
    background: #f1f4f9;
    color: #214993;
    font-size: 0.9em;
}

.architecture .architecture-focus[b-9k393b2eg3] {
    border-color: #9eb1f3;
    background: #e9efff;
    color: #294ab1;
}

.capability-grid[b-9k393b2eg3] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 31px 0;
}

.capability-card[b-9k393b2eg3] {
    min-width: 0;
    padding: 20px 18px;
    border: 1px solid #dfe5ec;
    border-radius: 9px;
    background: #fbfcfe;
}

.capability-tag[b-9k393b2eg3] {
    margin-bottom: 13px;
    color: #3154bd;
    font-size: 11px;
    font-weight: 750;
}

.capability-card h3[b-9k393b2eg3] {
    color: #101828;
    font-size: 15px;
    line-height: 1.35;
}

.capability-card p[b-9k393b2eg3] {
    margin: 9px 0 0;
    color: #667085;
    font-size: 12.5px;
    line-height: 1.65;
}

.identity-comparison[b-9k393b2eg3] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin: 31px 0;
}

.identity-panel[b-9k393b2eg3] {
    padding: 23px 22px;
    border: 1px solid #e8d3d5;
    border-radius: 9px;
    background: #fffafb;
}

.identity-panel-safe[b-9k393b2eg3] {
    border-color: #bbd8ca;
    background: #f7fbf9;
}

.identity-kicker[b-9k393b2eg3] {
    display: block;
    margin-bottom: 12px;
    color: #97515a;
    font-size: 11px;
    font-weight: 750;
    line-height: 1.5;
}

.identity-panel-safe .identity-kicker[b-9k393b2eg3] {
    color: #247052;
}

.identity-panel > strong[b-9k393b2eg3] {
    display: block;
    font-size: 15px;
}

.identity-panel > p[b-9k393b2eg3] {
    margin: 10px 0 0;
    font-size: 12.5px;
    line-height: 1.7;
}

.policy-example[b-9k393b2eg3] {
    margin: 32px 0 8px;
    overflow: hidden;
    border: 1px solid #dfe5ec;
    border-radius: 9px;
    background: white;
}

.policy-head[b-9k393b2eg3] {
    padding: 18px 20px 13px;
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 10px;
    border-bottom: 1px solid #e4e9ef;
    background: #f4f6fa;
    color: #344054;
    font-size: 12px;
    font-weight: 750;
    text-align: center;
}

.policy-head > div:first-child[b-9k393b2eg3] {
    text-align: left;
}

.policy-row[b-9k393b2eg3] {
    padding: 14px 20px;
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 10px;
    border-bottom: 1px solid #eef1f5;
    align-items: center;
    font-size: 12px;
}

.policy-row:last-child[b-9k393b2eg3] {
    border-bottom: 0;
}

.policy-row > span:not(:first-child)[b-9k393b2eg3] {
    font-size: 11px;
    font-weight: 750;
    text-align: center;
}

.policy-allowed[b-9k393b2eg3] { color: #197251; }
.policy-denied[b-9k393b2eg3] { color: #a65058; }

.article-content p.example-note[b-9k393b2eg3] {
    margin-bottom: 24px;
    color: #7b8797;
    font-size: 11.5px;
}

.article-content a.inline-link[b-9k393b2eg3],
.article-sources a[b-9k393b2eg3] {
    color: #3154bd;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.related-card[b-9k393b2eg3] {
    display: block;
    padding: 26px 28px;
    border: 1px solid #d9e1ed;
    border-radius: 9px;
    background: #f9fbff;
}

.related-card > span:first-child[b-9k393b2eg3] {
    display: block;
    color: #3154bd;
    font-size: 11px;
    font-weight: 750;
}

.related-card strong[b-9k393b2eg3] {
    display: block;
    margin-top: 11px;
    color: #16243a;
    font-size: 19px;
    line-height: 1.35;
}

.related-card p[b-9k393b2eg3] {
    margin: 11px 0 0;
    color: #667085;
    font-size: 13px;
}

.related-card .related-arrow[b-9k393b2eg3] {
    display: block;
    margin-top: 20px;
    color: #3154bd;
    font-size: 12px;
    font-weight: 750;
}

.article-sources[b-9k393b2eg3] {
    padding-top: 22px;
    border-top: 1px solid #dfe5ec;
}

.article-sources > strong[b-9k393b2eg3] {
    color: #344054;
    font-size: 13px;
}

.article-sources p[b-9k393b2eg3] {
    margin: 9px 0 0;
    color: #667085;
    font-size: 12.5px;
    line-height: 1.75;
}

@media (max-width: 720px) {
    .quick-answer[b-9k393b2eg3] { padding: 22px; margin-bottom: 49px; }
    .capability-grid[b-9k393b2eg3], .identity-comparison[b-9k393b2eg3] { grid-template-columns: 1fr; }
    .policy-head[b-9k393b2eg3] { padding-inline: 12px; }
    .policy-row[b-9k393b2eg3] { padding-inline: 12px; grid-template-columns: 1.3fr 1fr 1fr; }
    .related-card[b-9k393b2eg3] { padding: 21px; }
}


/* New ScopeBase articles: clear long-form reading and accessible tables */
.article-layout[b-9k393b2eg3], .article-content[b-9k393b2eg3] { min-width: 0; }
@media (max-width: 900px) { .article-layout[b-9k393b2eg3] { grid-template-columns: minmax(0, 1fr); } }
.article-content p a[b-9k393b2eg3],
.article-content li a[b-9k393b2eg3],
.article-content .source-links a[b-9k393b2eg3] {
    color: #294eb9;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.article-content p a:hover[b-9k393b2eg3],
.article-content li a:hover[b-9k393b2eg3] { color: #183889; }
.article-content ul[b-9k393b2eg3],
.article-content ol[b-9k393b2eg3] { margin: 0 0 25px; padding-left: 25px; color: var(--text-2); font-size: 16px; line-height: 1.8; }
.article-content li[b-9k393b2eg3] { margin-bottom: 9px; padding-left: 2px; }
.article-content h3[b-9k393b2eg3] { margin: 28px 0 12px; color: var(--text); font-size: 21px; line-height: 1.35; }
.article-content .lede-strong[b-9k393b2eg3] { font-weight: 700; color: var(--text); }
.article-content .source-links[b-9k393b2eg3] { padding-top: 22px; margin-top: 30px; border-top: 1px solid var(--border); }
.article-content .source-links h3[b-9k393b2eg3] { margin-top: 0; font-size: 16px; }
.article-content .source-links p[b-9k393b2eg3] { font-size: 13.5px; color: var(--muted); }
.article-content .action-link[b-9k393b2eg3] { font-weight: 700; }
.comparison-table-wrap[b-9k393b2eg3] { overflow-x: auto; margin: 26px 0; border: 1px solid var(--border); border-radius: 9px; }
.comparison-table[b-9k393b2eg3] { width: 100%; border-collapse: collapse; min-width: 565px; }
.comparison-table th[b-9k393b2eg3], .comparison-table td[b-9k393b2eg3] { padding: 15px 16px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--border); font-size: 13.5px; line-height: 1.6; }
.comparison-table th[b-9k393b2eg3] { background: #f1f4f9; color: #17243a; font-weight: 750; }
.comparison-table td[b-9k393b2eg3] { color: #344054; }
.comparison-table tbody tr:last-child td[b-9k393b2eg3] { border-bottom: 0; }
.comparison-table td:first-child[b-9k393b2eg3] { font-weight: 700; color: #17243a; }
.article-content .article-cta .cta-button[b-9k393b2eg3] { text-decoration: none; }
.article-content .related-card[b-9k393b2eg3] { text-decoration: none; }
.article-content .related-card:hover[b-9k393b2eg3] { border-color: #a3b8ec; }
.article-content section[id][b-9k393b2eg3] { scroll-margin-top: 32px; }
@media (max-width: 720px) {
    .article-content ul[b-9k393b2eg3], .article-content ol[b-9k393b2eg3] { font-size: 15px; padding-left: 21px; }
    .article-content h3[b-9k393b2eg3] { font-size: 19px; }
    .comparison-table th[b-9k393b2eg3], .comparison-table td[b-9k393b2eg3] { padding: 12px; }
}
/* /Pages/Marketing/Blog/McpDatabaseServer.razor.rz.scp.css */
.blog-page[b-3br5ryp622] {
    --navy: #0b1422;
    --text: #101828;
    --text-2: #344054;
    --muted: #667085;
    --border: #dfe5ec;
    --surface-2: #f7f9fc;
    --blue: #3b63df;
    --blue-soft: #eef2ff;
    --green: #187b57;
    min-height: 100vh;
    background: #fff;
    color: var(--text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.blog-page *[b-3br5ryp622], .blog-page *[b-3br5ryp622]::before, .blog-page *[b-3br5ryp622]::after { box-sizing: border-box; }
.blog-page a[b-3br5ryp622] { text-decoration: none; }
.shell[b-3br5ryp622] { width: min(1160px, calc(100% - 48px)); margin-inline: auto; }

.site-header[b-3br5ryp622] { border-bottom: 1px solid rgba(255,255,255,.08); background: var(--navy); }
.nav-shell[b-3br5ryp622] { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.brand[b-3br5ryp622] { display: inline-flex; align-items: center; gap: 10px; color: #fff; font-size: 19px; font-weight: 750; }
.brand-logo[b-3br5ryp622] { display: block; border-radius: 6px; }
.site-nav[b-3br5ryp622] { display: flex; align-items: center; gap: 28px; }
.site-nav > a[b-3br5ryp622] { color: #c7d2df; font-size: 14px; font-weight: 600; }
.site-nav > a:hover[b-3br5ryp622], .site-nav > a.active[b-3br5ryp622] { color: #fff; }
.site-nav .nav-button[b-3br5ryp622] { padding: 9px 14px; border: 1px solid #44546a; border-radius: 7px; color: #fff; }

.article-hero[b-3br5ryp622] { padding: 82px 0 74px; background: var(--navy); color: #fff; }
.article-shell[b-3br5ryp622] { max-width: 870px; }
.back-link[b-3br5ryp622] { display: inline-block; margin-bottom: 42px; color: #aebbd0; font-size: 13px; font-weight: 650; }
.article-kicker[b-3br5ryp622] { margin-bottom: 16px; color: #aebfff; font-size: 13px; font-weight: 750; }
.article-hero h1[b-3br5ryp622] { margin: 0; max-width: 860px; color: #fff; font-size: clamp(40px,5vw,64px); line-height: 1.07; letter-spacing: -.045em; }
.article-lead[b-3br5ryp622] { max-width: 780px; margin: 26px 0 0; color: #c4cedb; font-size: 19px; line-height: 1.72; }
.article-meta[b-3br5ryp622] { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 9px; color: #8f9daf; font-size: 12px; }

.article[b-3br5ryp622] { padding: 76px 0 105px; }
.article-layout[b-3br5ryp622] { display: grid; grid-template-columns: 220px minmax(0,760px); justify-content: center; gap: 72px; }
.toc[b-3br5ryp622] { position: sticky; top: 28px; display: flex; flex-direction: column; gap: 12px; padding: 20px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.toc strong[b-3br5ryp622] { margin-bottom: 4px; color: var(--text); font-size: 12px; }
.toc a[b-3br5ryp622] { color: var(--muted); font-size: 12px; line-height: 1.45; }
.toc a:hover[b-3br5ryp622] { color: var(--blue); }

.article-content section[b-3br5ryp622] { scroll-margin-top: 28px; margin-bottom: 66px; }
.article-content h2[b-3br5ryp622] { margin: 0 0 21px; color: var(--text); font-size: 31px; line-height: 1.2; letter-spacing: -.03em; }
.article-content p[b-3br5ryp622] { margin: 0 0 20px; color: var(--text-2); font-size: 16.5px; line-height: 1.82; }
.article-content blockquote[b-3br5ryp622] { margin: 31px 0; padding: 20px 23px; border-left: 3px solid var(--blue); background: var(--surface-2); color: var(--text); font-size: 19px; font-weight: 650; line-height: 1.6; }
.example-list[b-3br5ryp622] { margin: 28px 0; display: grid; gap: 10px; }
.example-list > div[b-3br5ryp622] { padding: 15px 17px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface-2); color: var(--text-2); font-size: 14px; }

.architecture[b-3br5ryp622] { margin: 30px 0; padding: 22px; display: flex; align-items: center; gap: 10px; overflow-x: auto; border: 1px solid var(--border); border-radius: 9px; background: #fbfcfe; }
.architecture > div[b-3br5ryp622] { flex: 0 0 auto; padding: 10px 12px; border: 1px solid #d8e0ea; border-radius: 6px; background: #fff; color: var(--text); font-size: 11px; font-weight: 700; white-space: nowrap; }
.architecture > span[b-3br5ryp622] { color: #98a2b3; }
.architecture-primary[b-3br5ryp622] { border-color: #cbd6f9; background: #f7f9ff; }
.architecture-primary > div:nth-of-type(3)[b-3br5ryp622] { border-color: #9eb1f3; background: var(--blue-soft); color: #294ab1; }

.callout[b-3br5ryp622] { margin: 31px 0; padding: 22px 24px; border: 1px solid #c9d6d0; border-left: 4px solid var(--green); border-radius: 8px; background: #f6faf8; }
.callout strong[b-3br5ryp622] { color: #173a2d; font-size: 15px; }
.callout p[b-3br5ryp622] { margin: 6px 0 0; color: #415d52; font-size: 14px; }

.stack[b-3br5ryp622] { margin: 31px 0; display: grid; gap: 12px; }
.stack > div[b-3br5ryp622] { padding: 20px; display: grid; grid-template-columns: 34px 1fr; gap: 15px; border: 1px solid var(--border); border-radius: 8px; background: #fff; }
.stack > div > span[b-3br5ryp622] { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 7px; background: var(--blue-soft); color: #3154bd; font-size: 12px; font-weight: 800; }
.stack strong[b-3br5ryp622] { color: var(--text); font-size: 15px; }
.stack p[b-3br5ryp622] { margin: 4px 0 0; color: var(--muted); font-size: 13.5px; line-height: 1.65; }

.article-cta[b-3br5ryp622] { margin-top: 39px; padding: 29px; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 28px; border-radius: 10px; background: var(--navy); }
.cta-label[b-3br5ryp622] { display: block; margin-bottom: 8px; color: #aebfff; font-size: 11px; font-weight: 750; }
.article-cta h3[b-3br5ryp622] { margin: 0; color: #fff; font-size: 22px; line-height: 1.25; }
.article-cta p[b-3br5ryp622] { max-width: 510px; margin: 9px 0 0; color: #bcc7d5; font-size: 13px; line-height: 1.65; }
.cta-button[b-3br5ryp622] { min-height: 46px; padding: 0 18px; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; background: var(--blue); color: #fff; font-size: 13px; font-weight: 750; white-space: nowrap; }

.faq-section[b-3br5ryp622] { margin-bottom: 0 !important; }
.faq-section details[b-3br5ryp622] { border-top: 1px solid var(--border); }
.faq-section details:last-child[b-3br5ryp622] { border-bottom: 1px solid var(--border); }
.faq-section summary[b-3br5ryp622] { padding: 19px 32px 19px 0; color: var(--text); font-size: 15px; font-weight: 700; cursor: pointer; }
.faq-section details p[b-3br5ryp622] { margin: 0 0 20px; max-width: 700px; color: var(--muted); font-size: 14px; }

.final-cta[b-3br5ryp622] { padding: 88px 0; background: var(--navy); color: #fff; }
.final-cta-inner[b-3br5ryp622] { max-width: 850px; text-align: center; }
.final-cta span[b-3br5ryp622] { color: #aebfff; font-size: 12px; font-weight: 750; }
.final-cta h2[b-3br5ryp622] { margin: 13px auto 0; max-width: 760px; color: #fff; font-size: clamp(34px,4vw,48px); line-height: 1.12; letter-spacing: -.038em; }
.final-cta p[b-3br5ryp622] { max-width: 650px; margin: 19px auto 25px; color: #bec9d6; font-size: 15px; line-height: 1.7; }
.cta-button-light[b-3br5ryp622] { background: #fff; color: var(--navy); }

.site-footer[b-3br5ryp622] { padding: 44px 0; background: #070d16; color: #9ba8b8; }
.footer-shell[b-3br5ryp622] { display: flex; justify-content: space-between; align-items: flex-start; gap: 30px; }
.site-footer p[b-3br5ryp622] { margin: 10px 0 0; color: #7f8da0; font-size: 11px; }
.footer-links[b-3br5ryp622] { display: flex; flex-wrap: wrap; gap: 22px; }
.footer-links a[b-3br5ryp622] { color: #9ba8b8; font-size: 12px; }

@media (max-width: 900px) {
    .article-layout[b-3br5ryp622] { grid-template-columns: 1fr; max-width: 780px; gap: 26px; }
    .article-sidebar[b-3br5ryp622] { display: none; }
    .article-cta[b-3br5ryp622] { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
    .shell[b-3br5ryp622] { width: min(100% - 32px,1160px); }
    .site-nav > a:not(.nav-button)[b-3br5ryp622] { display: none; }
    .article-hero[b-3br5ryp622] { padding: 58px 0 55px; }
    .back-link[b-3br5ryp622] { margin-bottom: 30px; }
    .article-hero h1[b-3br5ryp622] { font-size: clamp(36px,10vw,48px); }
    .article-lead[b-3br5ryp622] { font-size: 17px; }
    .article[b-3br5ryp622] { padding: 56px 0 75px; }
    .article-content section[b-3br5ryp622] { margin-bottom: 52px; }
    .article-content h2[b-3br5ryp622] { font-size: 27px; }
    .article-content p[b-3br5ryp622] { font-size: 16px; }
    .architecture[b-3br5ryp622] { padding: 17px; }
    .final-cta[b-3br5ryp622] { padding: 68px 0; }
    .footer-shell[b-3br5ryp622] { flex-direction: column; }
}


/* ============================================================
   MCP DATABASE ARTICLE ELEMENTS
   ============================================================ */

.quick-answer[b-3br5ryp622] {
    margin: 0 0 62px;
    padding: 28px 30px;
    border: 1px solid #ccd8f6;
    border-left: 4px solid #3b63df;
    border-radius: 9px;
    background: #f5f7ff;
}

.quick-answer-label[b-3br5ryp622] {
    display: block;
    margin-bottom: 11px;
    color: #3154bd;
    font-size: 12px;
    font-weight: 780;
    letter-spacing: 0.02em;
}

.quick-answer p[b-3br5ryp622] {
    margin: 0;
    font-size: 15.5px;
    line-height: 1.76;
}

.article-content strong[b-3br5ryp622] {
    color: #17243a;
}

.article-content code[b-3br5ryp622] {
    padding: 2px 5px;
    border-radius: 4px;
    background: #f1f4f9;
    color: #214993;
    font-size: 0.9em;
}

.architecture .architecture-focus[b-3br5ryp622] {
    border-color: #9eb1f3;
    background: #e9efff;
    color: #294ab1;
}

.capability-grid[b-3br5ryp622] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 31px 0;
}

.capability-card[b-3br5ryp622] {
    min-width: 0;
    padding: 20px 18px;
    border: 1px solid #dfe5ec;
    border-radius: 9px;
    background: #fbfcfe;
}

.capability-tag[b-3br5ryp622] {
    margin-bottom: 13px;
    color: #3154bd;
    font-size: 11px;
    font-weight: 750;
}

.capability-card h3[b-3br5ryp622] {
    color: #101828;
    font-size: 15px;
    line-height: 1.35;
}

.capability-card p[b-3br5ryp622] {
    margin: 9px 0 0;
    color: #667085;
    font-size: 12.5px;
    line-height: 1.65;
}

.identity-comparison[b-3br5ryp622] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin: 31px 0;
}

.identity-panel[b-3br5ryp622] {
    padding: 23px 22px;
    border: 1px solid #e8d3d5;
    border-radius: 9px;
    background: #fffafb;
}

.identity-panel-safe[b-3br5ryp622] {
    border-color: #bbd8ca;
    background: #f7fbf9;
}

.identity-kicker[b-3br5ryp622] {
    display: block;
    margin-bottom: 12px;
    color: #97515a;
    font-size: 11px;
    font-weight: 750;
    line-height: 1.5;
}

.identity-panel-safe .identity-kicker[b-3br5ryp622] {
    color: #247052;
}

.identity-panel > strong[b-3br5ryp622] {
    display: block;
    font-size: 15px;
}

.identity-panel > p[b-3br5ryp622] {
    margin: 10px 0 0;
    font-size: 12.5px;
    line-height: 1.7;
}

.policy-example[b-3br5ryp622] {
    margin: 32px 0 8px;
    overflow: hidden;
    border: 1px solid #dfe5ec;
    border-radius: 9px;
    background: white;
}

.policy-head[b-3br5ryp622] {
    padding: 18px 20px 13px;
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 10px;
    border-bottom: 1px solid #e4e9ef;
    background: #f4f6fa;
    color: #344054;
    font-size: 12px;
    font-weight: 750;
    text-align: center;
}

.policy-head > div:first-child[b-3br5ryp622] {
    text-align: left;
}

.policy-row[b-3br5ryp622] {
    padding: 14px 20px;
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 10px;
    border-bottom: 1px solid #eef1f5;
    align-items: center;
    font-size: 12px;
}

.policy-row:last-child[b-3br5ryp622] {
    border-bottom: 0;
}

.policy-row > span:not(:first-child)[b-3br5ryp622] {
    font-size: 11px;
    font-weight: 750;
    text-align: center;
}

.policy-allowed[b-3br5ryp622] { color: #197251; }
.policy-denied[b-3br5ryp622] { color: #a65058; }

.article-content p.example-note[b-3br5ryp622] {
    margin-bottom: 24px;
    color: #7b8797;
    font-size: 11.5px;
}

.article-content a.inline-link[b-3br5ryp622],
.article-sources a[b-3br5ryp622] {
    color: #3154bd;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.related-card[b-3br5ryp622] {
    display: block;
    padding: 26px 28px;
    border: 1px solid #d9e1ed;
    border-radius: 9px;
    background: #f9fbff;
}

.related-card > span:first-child[b-3br5ryp622] {
    display: block;
    color: #3154bd;
    font-size: 11px;
    font-weight: 750;
}

.related-card strong[b-3br5ryp622] {
    display: block;
    margin-top: 11px;
    color: #16243a;
    font-size: 19px;
    line-height: 1.35;
}

.related-card p[b-3br5ryp622] {
    margin: 11px 0 0;
    color: #667085;
    font-size: 13px;
}

.related-card .related-arrow[b-3br5ryp622] {
    display: block;
    margin-top: 20px;
    color: #3154bd;
    font-size: 12px;
    font-weight: 750;
}

.article-sources[b-3br5ryp622] {
    padding-top: 22px;
    border-top: 1px solid #dfe5ec;
}

.article-sources > strong[b-3br5ryp622] {
    color: #344054;
    font-size: 13px;
}

.article-sources p[b-3br5ryp622] {
    margin: 9px 0 0;
    color: #667085;
    font-size: 12.5px;
    line-height: 1.75;
}

@media (max-width: 720px) {
    .quick-answer[b-3br5ryp622] { padding: 22px; margin-bottom: 49px; }
    .capability-grid[b-3br5ryp622], .identity-comparison[b-3br5ryp622] { grid-template-columns: 1fr; }
    .policy-head[b-3br5ryp622] { padding-inline: 12px; }
    .policy-row[b-3br5ryp622] { padding-inline: 12px; grid-template-columns: 1.3fr 1fr 1fr; }
    .related-card[b-3br5ryp622] { padding: 21px; }
}
/* /Pages/Marketing/Blog/ScopeBase_Blog_Connect_AI_Database.razor.rz.scp.css */
.blog-page[b-ufg27xbx97] {
    --navy: #0b1422;
    --text: #101828;
    --text-2: #344054;
    --muted: #667085;
    --border: #dfe5ec;
    --surface-2: #f7f9fc;
    --blue: #3b63df;
    --blue-soft: #eef2ff;
    --green: #187b57;
    min-height: 100vh;
    background: #fff;
    color: var(--text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.blog-page *[b-ufg27xbx97], .blog-page *[b-ufg27xbx97]::before, .blog-page *[b-ufg27xbx97]::after { box-sizing: border-box; }
.blog-page a[b-ufg27xbx97] { text-decoration: none; }
.shell[b-ufg27xbx97] { width: min(1160px, calc(100% - 48px)); margin-inline: auto; }

.site-header[b-ufg27xbx97] { border-bottom: 1px solid rgba(255,255,255,.08); background: var(--navy); }
.nav-shell[b-ufg27xbx97] { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.brand[b-ufg27xbx97] { display: inline-flex; align-items: center; gap: 10px; color: #fff; font-size: 19px; font-weight: 750; }
.brand-logo[b-ufg27xbx97] { display: block; border-radius: 6px; }
.site-nav[b-ufg27xbx97] { display: flex; align-items: center; gap: 28px; }
.site-nav > a[b-ufg27xbx97] { color: #c7d2df; font-size: 14px; font-weight: 600; }
.site-nav > a:hover[b-ufg27xbx97], .site-nav > a.active[b-ufg27xbx97] { color: #fff; }
.site-nav .nav-button[b-ufg27xbx97] { padding: 9px 14px; border: 1px solid #44546a; border-radius: 7px; color: #fff; }

.article-hero[b-ufg27xbx97] { padding: 82px 0 74px; background: var(--navy); color: #fff; }
.article-shell[b-ufg27xbx97] { max-width: 870px; }
.back-link[b-ufg27xbx97] { display: inline-block; margin-bottom: 42px; color: #aebbd0; font-size: 13px; font-weight: 650; }
.article-kicker[b-ufg27xbx97] { margin-bottom: 16px; color: #aebfff; font-size: 13px; font-weight: 750; }
.article-hero h1[b-ufg27xbx97] { margin: 0; max-width: 860px; color: #fff; font-size: clamp(40px,5vw,64px); line-height: 1.07; letter-spacing: -.045em; }
.article-lead[b-ufg27xbx97] { max-width: 780px; margin: 26px 0 0; color: #c4cedb; font-size: 19px; line-height: 1.72; }
.article-meta[b-ufg27xbx97] { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 9px; color: #8f9daf; font-size: 12px; }

.article[b-ufg27xbx97] { padding: 76px 0 105px; }
.article-layout[b-ufg27xbx97] { display: grid; grid-template-columns: 220px minmax(0,760px); justify-content: center; gap: 72px; }
.toc[b-ufg27xbx97] { position: sticky; top: 28px; display: flex; flex-direction: column; gap: 12px; padding: 20px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.toc strong[b-ufg27xbx97] { margin-bottom: 4px; color: var(--text); font-size: 12px; }
.toc a[b-ufg27xbx97] { color: var(--muted); font-size: 12px; line-height: 1.45; }
.toc a:hover[b-ufg27xbx97] { color: var(--blue); }

.article-content section[b-ufg27xbx97] { scroll-margin-top: 28px; margin-bottom: 66px; }
.article-content h2[b-ufg27xbx97] { margin: 0 0 21px; color: var(--text); font-size: 31px; line-height: 1.2; letter-spacing: -.03em; }
.article-content p[b-ufg27xbx97] { margin: 0 0 20px; color: var(--text-2); font-size: 16.5px; line-height: 1.82; }
.article-content blockquote[b-ufg27xbx97] { margin: 31px 0; padding: 20px 23px; border-left: 3px solid var(--blue); background: var(--surface-2); color: var(--text); font-size: 19px; font-weight: 650; line-height: 1.6; }
.example-list[b-ufg27xbx97] { margin: 28px 0; display: grid; gap: 10px; }
.example-list > div[b-ufg27xbx97] { padding: 15px 17px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface-2); color: var(--text-2); font-size: 14px; }

.architecture[b-ufg27xbx97] { margin: 30px 0; padding: 22px; display: flex; align-items: center; gap: 10px; overflow-x: auto; border: 1px solid var(--border); border-radius: 9px; background: #fbfcfe; }
.architecture > div[b-ufg27xbx97] { flex: 0 0 auto; padding: 10px 12px; border: 1px solid #d8e0ea; border-radius: 6px; background: #fff; color: var(--text); font-size: 11px; font-weight: 700; white-space: nowrap; }
.architecture > span[b-ufg27xbx97] { color: #98a2b3; }
.architecture-primary[b-ufg27xbx97] { border-color: #cbd6f9; background: #f7f9ff; }
.architecture-primary > div:nth-of-type(3)[b-ufg27xbx97] { border-color: #9eb1f3; background: var(--blue-soft); color: #294ab1; }

.callout[b-ufg27xbx97] { margin: 31px 0; padding: 22px 24px; border: 1px solid #c9d6d0; border-left: 4px solid var(--green); border-radius: 8px; background: #f6faf8; }
.callout strong[b-ufg27xbx97] { color: #173a2d; font-size: 15px; }
.callout p[b-ufg27xbx97] { margin: 6px 0 0; color: #415d52; font-size: 14px; }

.stack[b-ufg27xbx97] { margin: 31px 0; display: grid; gap: 12px; }
.stack > div[b-ufg27xbx97] { padding: 20px; display: grid; grid-template-columns: 34px 1fr; gap: 15px; border: 1px solid var(--border); border-radius: 8px; background: #fff; }
.stack > div > span[b-ufg27xbx97] { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 7px; background: var(--blue-soft); color: #3154bd; font-size: 12px; font-weight: 800; }
.stack strong[b-ufg27xbx97] { color: var(--text); font-size: 15px; }
.stack p[b-ufg27xbx97] { margin: 4px 0 0; color: var(--muted); font-size: 13.5px; line-height: 1.65; }

.article-cta[b-ufg27xbx97] { margin-top: 39px; padding: 29px; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 28px; border-radius: 10px; background: var(--navy); }
.cta-label[b-ufg27xbx97] { display: block; margin-bottom: 8px; color: #aebfff; font-size: 11px; font-weight: 750; }
.article-cta h3[b-ufg27xbx97] { margin: 0; color: #fff; font-size: 22px; line-height: 1.25; }
.article-cta p[b-ufg27xbx97] { max-width: 510px; margin: 9px 0 0; color: #bcc7d5; font-size: 13px; line-height: 1.65; }
.cta-button[b-ufg27xbx97] { min-height: 46px; padding: 0 18px; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; background: var(--blue); color: #fff; font-size: 13px; font-weight: 750; white-space: nowrap; }

.faq-section[b-ufg27xbx97] { margin-bottom: 0 !important; }
.faq-section details[b-ufg27xbx97] { border-top: 1px solid var(--border); }
.faq-section details:last-child[b-ufg27xbx97] { border-bottom: 1px solid var(--border); }
.faq-section summary[b-ufg27xbx97] { padding: 19px 32px 19px 0; color: var(--text); font-size: 15px; font-weight: 700; cursor: pointer; }
.faq-section details p[b-ufg27xbx97] { margin: 0 0 20px; max-width: 700px; color: var(--muted); font-size: 14px; }

.final-cta[b-ufg27xbx97] { padding: 88px 0; background: var(--navy); color: #fff; }
.final-cta-inner[b-ufg27xbx97] { max-width: 850px; text-align: center; }
.final-cta span[b-ufg27xbx97] { color: #aebfff; font-size: 12px; font-weight: 750; }
.final-cta h2[b-ufg27xbx97] { margin: 13px auto 0; max-width: 760px; color: #fff; font-size: clamp(34px,4vw,48px); line-height: 1.12; letter-spacing: -.038em; }
.final-cta p[b-ufg27xbx97] { max-width: 650px; margin: 19px auto 25px; color: #bec9d6; font-size: 15px; line-height: 1.7; }
.cta-button-light[b-ufg27xbx97] { background: #fff; color: var(--navy); }

.site-footer[b-ufg27xbx97] { padding: 44px 0; background: #070d16; color: #9ba8b8; }
.footer-shell[b-ufg27xbx97] { display: flex; justify-content: space-between; align-items: flex-start; gap: 30px; }
.site-footer p[b-ufg27xbx97] { margin: 10px 0 0; color: #7f8da0; font-size: 11px; }
.footer-links[b-ufg27xbx97] { display: flex; flex-wrap: wrap; gap: 22px; }
.footer-links a[b-ufg27xbx97] { color: #9ba8b8; font-size: 12px; }

@media (max-width: 900px) {
    .article-layout[b-ufg27xbx97] { grid-template-columns: 1fr; max-width: 780px; gap: 26px; }
    .article-sidebar[b-ufg27xbx97] { display: none; }
    .article-cta[b-ufg27xbx97] { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
    .shell[b-ufg27xbx97] { width: min(100% - 32px,1160px); }
    .site-nav > a:not(.nav-button)[b-ufg27xbx97] { display: none; }
    .article-hero[b-ufg27xbx97] { padding: 58px 0 55px; }
    .back-link[b-ufg27xbx97] { margin-bottom: 30px; }
    .article-hero h1[b-ufg27xbx97] { font-size: clamp(36px,10vw,48px); }
    .article-lead[b-ufg27xbx97] { font-size: 17px; }
    .article[b-ufg27xbx97] { padding: 56px 0 75px; }
    .article-content section[b-ufg27xbx97] { margin-bottom: 52px; }
    .article-content h2[b-ufg27xbx97] { font-size: 27px; }
    .article-content p[b-ufg27xbx97] { font-size: 16px; }
    .architecture[b-ufg27xbx97] { padding: 17px; }
    .final-cta[b-ufg27xbx97] { padding: 68px 0; }
    .footer-shell[b-ufg27xbx97] { flex-direction: column; }
}
/* /Pages/Marketing/Home.razor.rz.scp.css */
/* ============================================================
   SCOPEBASE HOME PAGE
   Blazor CSS isolation stylesheet
   ============================================================ */

.scopebase-page[b-1swgmozhph] {
    --navy-950: #050b14;
    --navy-900: #07111f;
    --navy-850: #0a1526;
    --navy-800: #0e1b30;
    --navy-700: #182840;
    --blue-700: #2547c7;
    --blue-600: #315bea;
    --blue-500: #4169f5;
    --blue-400: #6685fb;
    --blue-100: #edf2ff;
    --blue-50: #f6f8ff;
    --cyan: #55d6f4;
    --green: #22b87c;
    --green-soft: #eafaf4;
    --red: #db5964;
    --red-soft: #fff0f1;
    --text: #101828;
    --text-2: #344054;
    --muted: #657084;
    --muted-light: #93a0b4;
    --surface: #ffffff;
    --surface-2: #f7f9fc;
    --surface-3: #eef2f7;
    --border: #e3e8ef;
    --border-dark: rgba(255, 255, 255, 0.1);
    --shadow-small: 0 4px 16px rgba(11, 24, 45, 0.06);
    --shadow: 0 22px 65px rgba(9, 22, 45, 0.11);
    --shadow-large: 0 35px 100px rgba(5, 14, 30, 0.18);
    width: 100%;
    min-height: 100vh;
    margin: 0;
    padding: 0;
    background: var(--surface);
    color: var(--text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 16px;
    line-height: 1.6;
    overflow-x: hidden;
}


    /* ============================================================
   BASE
   ============================================================ */

    .scopebase-page *[b-1swgmozhph],
    .scopebase-page *[b-1swgmozhph]::before,
    .scopebase-page *[b-1swgmozhph]::after {
        box-sizing: border-box;
    }


    .scopebase-page a[b-1swgmozhph] {
        text-decoration: none;
    }


    .scopebase-page button[b-1swgmozhph],
    .scopebase-page input[b-1swgmozhph],
    .scopebase-page textarea[b-1swgmozhph],
    .scopebase-page select[b-1swgmozhph] {
        font: inherit;
    }


    .scopebase-page svg[b-1swgmozhph] {
        display: block;
    }


.container[b-1swgmozhph] {
    width: min(1180px, calc(100% - 48px));
    margin-inline: auto;
}


.section[b-1swgmozhph] {
    position: relative;
    padding: 118px 0;
}


/* Headings are the actual anchor targets, positioned below the fixed navigation. */
#how-it-works[b-1swgmozhph],
#access-control[b-1swgmozhph],
#product-tour[b-1swgmozhph],
#security[b-1swgmozhph],
#about[b-1swgmozhph],
#pricing[b-1swgmozhph],
#faq[b-1swgmozhph],
#support[b-1swgmozhph],
#watch-demo[b-1swgmozhph] {
    scroll-margin-top: 96px;
}


.skip-link[b-1swgmozhph] {
    position: fixed;
    z-index: 9999;
    top: 12px;
    left: 12px;
    transform: translateY(-150%);
    padding: 10px 16px;
    background: white;
    color: var(--navy-900);
    border-radius: 8px;
    box-shadow: var(--shadow);
    font-size: 14px;
    font-weight: 700;
    transition: transform 0.2s ease;
}


    .skip-link:focus[b-1swgmozhph] {
        transform: translateY(0);
    }


/* ============================================================
   BUTTONS
   ============================================================ */

.button[b-1swgmozhph] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 46px;
    padding: 0 22px;
    border: 1px solid transparent;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}


    .button:hover[b-1swgmozhph] {
        transform: translateY(-1px);
    }


.button-primary[b-1swgmozhph] {
    color: #fff;
    background: linear-gradient( 135deg, var(--blue-500), var(--blue-600) );
    border-color: rgba(255, 255, 255, 0.08);
    box-shadow: 0 10px 28px rgba(49, 91, 234, 0.28);
}


    .button-primary:hover[b-1swgmozhph] {
        background: linear-gradient( 135deg, #5277ff, #315bea );
        box-shadow: 0 14px 34px rgba(49, 91, 234, 0.36);
    }


.button-secondary[b-1swgmozhph] {
    background: #fff;
    color: var(--text);
    border-color: var(--border);
    box-shadow: var(--shadow-small);
}


    .button-secondary:hover[b-1swgmozhph] {
        border-color: #c9d2df;
        background: var(--surface-2);
    }


.button-outline-dark[b-1swgmozhph] {
    color: var(--navy-900);
    background: transparent;
    border-color: #cbd3df;
}


    .button-outline-dark:hover[b-1swgmozhph] {
        background: var(--navy-900);
        border-color: var(--navy-900);
        color: white;
    }


.button-white[b-1swgmozhph] {
    background: white;
    color: var(--navy-900);
    border-color: white;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.22);
}


    .button-white:hover[b-1swgmozhph] {
        background: #f6f8fb;
    }


.button-large[b-1swgmozhph] {
    min-height: 54px;
    padding-inline: 27px;
    border-radius: 12px;
    font-size: 15px;
}


.button-nav[b-1swgmozhph] {
    min-height: 40px;
    padding-inline: 17px;
    border-radius: 8px;
}


.button-full[b-1swgmozhph] {
    width: 100%;
}


/* ============================================================
   NAVIGATION
   ============================================================ */

.site-header[b-1swgmozhph] {
    position: fixed;
    z-index: 1000;
    top: 0;
    right: 0;
    left: 0;
    height: 74px;
    background: rgba(7, 17, 31, 0.88);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}


.nav-shell[b-1swgmozhph] {
    width: min(1220px, calc(100% - 48px));
    height: 74px;
    margin-inline: auto;
    display: flex;
    align-items: center;
}


.brand[b-1swgmozhph] {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    flex: 0 0 auto;
    color: white;
}


.brand-mark[b-1swgmozhph] {
    position: relative;
    display: grid;
    place-items: center;
    width: 31px;
    height: 31px;
    border-radius: 9px;
    background: linear-gradient( 140deg, #6383ff, #355ce8 );
    box-shadow: 0 7px 20px rgba(59, 94, 236, 0.34);
}


    .brand-mark[b-1swgmozhph]::before,
    .brand-mark[b-1swgmozhph]::after {
        content: "";
        position: absolute;
        width: 13px;
        height: 13px;
        border: 1.6px solid rgba(255, 255, 255, 0.92);
        border-radius: 4px;
    }


    .brand-mark[b-1swgmozhph]::before {
        transform: translate(-3px, -2px);
    }


    .brand-mark[b-1swgmozhph]::after {
        transform: translate(3px, 2px);
    }


.brand-mark-inner[b-1swgmozhph] {
    position: absolute;
    z-index: 2;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: white;
}


.brand-name[b-1swgmozhph] {
    font-size: 19px;
    font-weight: 750;
    letter-spacing: -0.4px;
}


.desktop-nav[b-1swgmozhph] {
    display: flex;
    align-items: center;
    gap: 31px;
    margin-left: auto;
    margin-right: 34px;
}


    .desktop-nav a[b-1swgmozhph],
    .sign-in-link[b-1swgmozhph] {
        color: #b9c4d4;
        font-size: 14px;
        font-weight: 550;
        transition: color 0.2s ease;
    }


        .desktop-nav a:hover[b-1swgmozhph],
        .sign-in-link:hover[b-1swgmozhph] {
            color: white;
        }


.nav-actions[b-1swgmozhph] {
    display: flex;
    align-items: center;
    gap: 20px;
}


.mobile-menu[b-1swgmozhph] {
    display: none;
}


/* ============================================================
   HERO
   ============================================================ */

.hero[b-1swgmozhph] {
    position: relative;
    min-height: 790px;
    padding: 168px 0 112px;
    background: linear-gradient( 180deg, var(--navy-900) 0%, #091626 100% );
    color: white;
    overflow: hidden;
}


.hero-grid-background[b-1swgmozhph] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.11;
    background-image: linear-gradient( rgba(255, 255, 255, 0.12) 1px, transparent 1px ), linear-gradient( 90deg, rgba(255, 255, 255, 0.12) 1px, transparent 1px );
    background-size: 54px 54px;
    mask-image: linear-gradient( to bottom, transparent, black 20%, black 75%, transparent );
}


.hero-orb[b-1swgmozhph] {
    position: absolute;
    width: 600px;
    height: 600px;
    border-radius: 50%;
    filter: blur(100px);
    opacity: 0.14;
    pointer-events: none;
}


.hero-orb-one[b-1swgmozhph] {
    top: -260px;
    left: -150px;
    background: #5276ff;
}


.hero-orb-two[b-1swgmozhph] {
    right: -250px;
    bottom: -320px;
    background: #43d8ff;
}


.hero-grid[b-1swgmozhph] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    align-items: center;
    gap: 72px;
}



.hero h1[b-1swgmozhph] {
    max-width: 650px;
    margin: 0;
    color: white;
    font-size: clamp(43px, 4.4vw, 67px);
    line-height: 1.045;
    letter-spacing: -0.052em;
    font-weight: 760;
}


    .hero h1 span[b-1swgmozhph] {
        display: block;
        margin-top: 8px;
        background: linear-gradient( 110deg, #94a9ff, #77dff6 );
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }


.hero-description[b-1swgmozhph] {
    max-width: 610px;
    margin: 28px 0 0;
    color: #aebace;
    font-size: 18px;
    line-height: 1.72;
}


.hero-actions[b-1swgmozhph] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 34px;
}


.hero .button-secondary[b-1swgmozhph] {
    background: rgba(255, 255, 255, 0.035);
    border-color: rgba(255, 255, 255, 0.13);
    color: #dbe2ed;
    box-shadow: none;
}


    .hero .button-secondary:hover[b-1swgmozhph] {
        background: rgba(255, 255, 255, 0.075);
        border-color: rgba(255, 255, 255, 0.22);
    }



/* ============================================================
   HERO PRODUCT WINDOW
   ============================================================ */

.hero-visual[b-1swgmozhph] {
    position: relative;
}


.product-window[b-1swgmozhph] {
    position: relative;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    background: rgba(8, 20, 36, 0.88);
    box-shadow: 0 40px 110px rgba(0, 0, 0, 0.42);
    overflow: hidden;
}


    .product-window[b-1swgmozhph]::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        border-radius: inherit;
        background: linear-gradient( 140deg, rgba(106, 139, 255, 0.07), transparent 35% );
    }


.product-window-header[b-1swgmozhph] {
    position: relative;
    z-index: 2;
    min-height: 53px;
    padding: 0 17px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.018);
}


.window-dots[b-1swgmozhph] {
    display: flex;
    gap: 6px;
}


    .window-dots span[b-1swgmozhph] {
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.18);
    }


.window-title[b-1swgmozhph] {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    color: #8e9caf;
    font-size: 11px;
    font-weight: 650;
}


.connection-status[b-1swgmozhph] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
    color: #83d9b5;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
}


    .connection-status > span[b-1swgmozhph] {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #44d398;
    }


.product-window-body[b-1swgmozhph] {
    position: relative;
    z-index: 2;
    padding: 30px;
}


.access-flow[b-1swgmozhph] {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
    align-items: center;
    gap: 7px;
    padding-bottom: 28px;
}


.flow-node[b-1swgmozhph] {
    position: relative;
    min-width: 0;
    padding: 15px 7px;
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.025);
    text-align: center;
}


.highlighted-node[b-1swgmozhph] {
    border-color: rgba(93, 129, 255, 0.34);
    background: rgba(61, 95, 219, 0.09);
}


.scope-glow[b-1swgmozhph] {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 70px;
    height: 70px;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: rgba(76, 111, 240, 0.22);
    filter: blur(25px);
    pointer-events: none;
}


.flow-icon[b-1swgmozhph] {
    position: relative;
    z-index: 2;
    width: 28px;
    height: 28px;
    margin-bottom: 9px;
    display: grid;
    place-items: center;
    color: #91a7fa;
}


    .flow-icon svg[b-1swgmozhph] {
        width: 25px;
        height: 25px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.55;
        stroke-linecap: round;
        stroke-linejoin: round;
    }


.flow-node strong[b-1swgmozhph] {
    position: relative;
    z-index: 2;
    color: #e8edf6;
    font-size: 11px;
    font-weight: 700;
}


.flow-node small[b-1swgmozhph] {
    position: relative;
    z-index: 2;
    margin-top: 2px;
    color: #647186;
    font-size: 9px;
}


.flow-arrow[b-1swgmozhph] {
    color: #445064;
    font-size: 15px;
}


.permission-card[b-1swgmozhph] {
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.026);
    overflow: hidden;
}


.permission-card-header[b-1swgmozhph] {
    min-height: 46px;
    padding: 0 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    color: #a6b1c2;
    font-size: 10px;
    font-weight: 600;
}


    .permission-card-header > div[b-1swgmozhph] {
        display: flex;
        align-items: center;
        gap: 8px;
    }


.permission-status-dot[b-1swgmozhph] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #4dda9d;
}



.permission-question[b-1swgmozhph] {
    padding: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    color: #e5ebf5;
    font-size: 12px;
    line-height: 1.55;
}


.permission-details[b-1swgmozhph] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    padding: 16px;
}


    .permission-details > div[b-1swgmozhph] {
        display: flex;
        flex-direction: column;
    }


    .permission-details span[b-1swgmozhph] {
        color: #66758b;
        font-size: 8px;
        text-transform: uppercase;
        letter-spacing: 0.07em;
    }


    .permission-details strong[b-1swgmozhph] {
        margin-top: 2px;
        color: #cdd6e4;
        font-size: 10px;
        font-weight: 600;
    }



/* ============================================================
   GENERIC HEADINGS
   ============================================================ */

.section-heading[b-1swgmozhph] {
    max-width: 760px;
    margin: 0 auto 64px;
    text-align: center;
}



.section-heading h2[b-1swgmozhph],
.access-copy h2[b-1swgmozhph],
.mcp-copy h2[b-1swgmozhph],
.security-heading h2[b-1swgmozhph],
.conversation-copy h2[b-1swgmozhph],
.definition-grid h2[b-1swgmozhph],
.faq-intro h2[b-1swgmozhph] {
    margin: 0;
    color: var(--text);
    font-size: clamp(34px, 3.3vw, 49px);
    line-height: 1.12;
    letter-spacing: -0.043em;
    font-weight: 740;
}


.section-heading > p[b-1swgmozhph] {
    max-width: 670px;
    margin: 20px auto 0;
    color: var(--muted);
    font-size: 17px;
    line-height: 1.72;
}


/* ============================================================
   DEFINITION / AEO
   ============================================================ */

.definition-section[b-1swgmozhph] {
    position: relative;
    padding: 72px 0;
    background: white;
    border-bottom: 1px solid var(--border);
}


.definition-grid[b-1swgmozhph] {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
    align-items: start;
    gap: 80px;
}


    .definition-grid h2[b-1swgmozhph] {
        font-size: clamp(29px, 2.6vw, 40px);
    }


.definition-answer[b-1swgmozhph] {
    padding-left: 32px;
    border-left: 2px solid var(--blue-500);
}


    .definition-answer p[b-1swgmozhph] {
        margin: 0 0 16px;
        color: var(--text-2);
        font-size: 16.5px;
        line-height: 1.78;
    }


        .definition-answer p:last-child[b-1swgmozhph] {
            margin-bottom: 0;
        }


    .definition-answer strong[b-1swgmozhph] {
        color: var(--text);
    }


/* ============================================================
   PROBLEM / QUESTIONS
   ============================================================ */

.problem-section[b-1swgmozhph] {
    background: linear-gradient( 180deg, #ffffff, #f8fafe );
}


.question-grid[b-1swgmozhph] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
}


.question-card[b-1swgmozhph] {
    position: relative;
    min-height: 190px;
    padding: 27px 24px 23px;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--border);
    border-radius: 15px;
    background: white;
    box-shadow: 0 5px 20px rgba(12, 25, 48, 0.035);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}


    .question-card:hover[b-1swgmozhph] {
        transform: translateY(-3px);
        border-color: #ced7e5;
        box-shadow: 0 16px 35px rgba(12, 25, 48, 0.07);
    }


.quote-mark[b-1swgmozhph] {
    height: 27px;
    color: #aabaf9;
    font-family: Georgia, serif;
    font-size: 36px;
    line-height: 1;
}


.question-card p[b-1swgmozhph] {
    margin: 10px 0 24px;
    color: var(--text);
    font-size: 15px;
    font-weight: 640;
    line-height: 1.55;
}


.question-category[b-1swgmozhph] {
    margin-top: auto;
    color: var(--muted);
    font-size: 10px;
    font-weight: 750;
    text-transform: uppercase;
    letter-spacing: 0.09em;
}


.answer-strip[b-1swgmozhph] {
    max-width: 780px;
    margin: 43px auto 0;
    padding: 18px 22px;
    display: flex;
    align-items: center;
    gap: 17px;
    border: 1px solid #dce4f3;
    border-radius: 12px;
    background: #f3f6fd;
}


.answer-strip-icon[b-1swgmozhph] {
    flex: 0 0 auto;
    width: 35px;
    height: 35px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    background: var(--blue-500);
    color: white;
    font-size: 17px;
}


.answer-strip > div:last-child[b-1swgmozhph] {
    display: flex;
    flex-direction: column;
}


.answer-strip strong[b-1swgmozhph] {
    color: var(--text);
    font-size: 13px;
}


.answer-strip span[b-1swgmozhph] {
    margin-top: 2px;
    color: var(--muted);
    font-size: 12px;
}


/* ============================================================
   ACCESS CONTROL DARK SECTION
   ============================================================ */

.dark-section[b-1swgmozhph] {
    background: linear-gradient( 155deg, #07111f, #0b1729 );
    color: white;
}


.access-layout[b-1swgmozhph] {
    display: grid;
    grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
    align-items: center;
    gap: 90px;
}


.access-copy h2[b-1swgmozhph] {
    color: white;
}


.access-copy > p[b-1swgmozhph] {
    max-width: 510px;
    margin: 21px 0 0;
    color: #9eabba;
    font-size: 16px;
    line-height: 1.77;
}


.access-statement[b-1swgmozhph] {
    margin-top: 31px;
    padding-left: 18px;
    border-left: 2px solid var(--blue-500);
    color: #a8b4c4;
    font-size: 14px;
}


    .access-statement strong[b-1swgmozhph] {
        margin-left: 4px;
        color: white;
    }


.control-stack[b-1swgmozhph] {
    display: flex;
    flex-direction: column;
    gap: 11px;
}


.control-card[b-1swgmozhph] {
    padding: 23px 24px;
    display: grid;
    grid-template-columns: 45px 1fr;
    gap: 19px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.025);
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}


    .control-card:hover[b-1swgmozhph] {
        transform: translateX(3px);
        border-color: rgba(113, 143, 255, 0.22);
        background: rgba(76, 105, 215, 0.055);
    }


.control-number[b-1swgmozhph] {
    color: #647de0;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.05em;
}


.control-card h3[b-1swgmozhph] {
    margin: 0;
    color: #edf1f7;
    font-size: 15px;
    font-weight: 680;
}


.control-card p[b-1swgmozhph] {
    margin: 7px 0 0;
    color: #8491a4;
    font-size: 13px;
    line-height: 1.62;
}


/* ============================================================
   HOW IT WORKS
   ============================================================ */

.how-section[b-1swgmozhph] {
    background: white;
}


.steps-grid[b-1swgmozhph] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}


.step-card[b-1swgmozhph] {
    position: relative;
    padding: 27px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: white;
    box-shadow: 0 4px 18px rgba(10, 24, 48, 0.035);
}


    .step-card:not(:last-child)[b-1swgmozhph]::after {
        content: "→";
        position: absolute;
        z-index: 4;
        top: 50%;
        right: -16px;
        width: 31px;
        height: 31px;
        transform: translateY(-50%);
        display: grid;
        place-items: center;
        border: 1px solid var(--border);
        border-radius: 50%;
        background: white;
        color: #919daf;
        font-size: 12px;
    }


.step-header[b-1swgmozhph] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 26px;
}


.step-number[b-1swgmozhph] {
    color: #a3adba;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
}


.step-icon[b-1swgmozhph] {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: var(--blue-100);
    color: var(--blue-600);
}


    .step-icon svg[b-1swgmozhph] {
        width: 21px;
        height: 21px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.65;
        stroke-linecap: round;
        stroke-linejoin: round;
    }


.step-card h3[b-1swgmozhph] {
    margin: 0;
    color: var(--text);
    font-size: 16px;
    font-weight: 700;
}


.step-card p[b-1swgmozhph] {
    margin: 11px 0 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.68;
}


/* ============================================================
   MCP SECTION
   ============================================================ */

.mcp-section[b-1swgmozhph] {
    background: var(--surface-2);
}


.mcp-layout[b-1swgmozhph] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    gap: 90px;
}


.mcp-terminal[b-1swgmozhph] {
    overflow: hidden;
    border: 1px solid #1d304b;
    border-radius: 16px;
    background: var(--navy-900);
    box-shadow: 0 27px 70px rgba(8, 19, 36, 0.17);
}


.terminal-top[b-1swgmozhph] {
    min-height: 48px;
    padding: 0 16px;
    display: flex;
    align-items: center;
    gap: 6px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}


    .terminal-top > span[b-1swgmozhph] {
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.18);
    }


    .terminal-top small[b-1swgmozhph] {
        margin-left: auto;
        color: #6d7c91;
        font-size: 10px;
    }


.terminal-content[b-1swgmozhph] {
    padding: 28px;
    color: #bdc7d6;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 12px;
    line-height: 2;
}


    .terminal-content > div[b-1swgmozhph] {
        display: flex;
        gap: 28px;
    }


.terminal-muted[b-1swgmozhph] {
    display: inline-block;
    width: 78px;
    color: #5c6b80;
}


.terminal-success[b-1swgmozhph] {
    color: #50d7a0;
}


.terminal-command[b-1swgmozhph] {
    margin-top: 17px;
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
    color: #8fa7ff;
}


.terminal-response[b-1swgmozhph] {
    color: #5bd8a6;
}


.mcp-copy h2[b-1swgmozhph] {
    margin-top: 0;
}


.mcp-copy p[b-1swgmozhph] {
    max-width: 540px;
    margin: 20px 0 0;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.76;
}


.mcp-copy strong[b-1swgmozhph] {
    color: var(--text);
}


/* ============================================================
   ROLE EXAMPLES
   ============================================================ */

.role-section[b-1swgmozhph] {
    background: white;
}


.role-grid[b-1swgmozhph] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
}


.role-card[b-1swgmozhph] {
    padding: 23px;
    border: 1px solid var(--border);
    border-radius: 15px;
    background: white;
}


.role-card-header[b-1swgmozhph] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 21px;
}


.role-avatar[b-1swgmozhph] {
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: var(--blue-100);
    color: var(--blue-600);
    font-size: 12px;
    font-weight: 800;
}


.role-card-header h3[b-1swgmozhph] {
    margin: 0;
    color: var(--text);
    font-size: 14px;
    font-weight: 700;
}


.role-card-header span[b-1swgmozhph] {
    display: block;
    margin-top: 2px;
    color: var(--muted);
    font-size: 10px;
}


.role-query[b-1swgmozhph] {
    min-height: 106px;
    padding: 15px;
    display: flex;
    align-items: flex-start;
    gap: 9px;
    border-radius: 10px;
}


.role-query-allowed[b-1swgmozhph] {
    background: #f5f8ff;
    border: 1px solid #e7ecfb;
}


.role-query > span[b-1swgmozhph] {
    color: var(--green);
    font-weight: 800;
}


.role-query p[b-1swgmozhph] {
    margin: 0;
    color: var(--text-2);
    font-size: 12px;
    line-height: 1.58;
}


.role-restriction[b-1swgmozhph] {
    margin-top: 11px;
    padding: 9px 11px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    background: var(--red-soft);
    color: #a44d56;
    font-size: 10px;
    font-weight: 650;
}


    .role-restriction > span[b-1swgmozhph] {
        font-weight: 900;
    }


.role-approved[b-1swgmozhph] {
    background: var(--green-soft);
    color: #22805e;
}


/* ============================================================
   SECURITY
   ============================================================ */

.security-section[b-1swgmozhph] {
    background: linear-gradient( 180deg, #f7f9fc, #f3f6fa );
    border-top: 1px solid #edf0f5;
    border-bottom: 1px solid #e6ebf1;
}


.security-heading[b-1swgmozhph] {
    margin-bottom: 58px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.75fr);
    align-items: end;
    gap: 70px;
}


    .security-heading > p[b-1swgmozhph] {
        margin: 0;
        color: var(--muted);
        font-size: 15px;
        line-height: 1.75;
    }


.security-grid[b-1swgmozhph] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}


.security-card[b-1swgmozhph] {
    min-height: 225px;
    padding: 27px;
    border: 1px solid #e0e6ee;
    border-radius: 15px;
    background: white;
}


.security-icon[b-1swgmozhph] {
    width: 42px;
    height: 42px;
    margin-bottom: 23px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: var(--blue-100);
    color: var(--blue-600);
}


    .security-icon svg[b-1swgmozhph] {
        width: 21px;
        height: 21px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.65;
        stroke-linecap: round;
        stroke-linejoin: round;
    }


.security-card h3[b-1swgmozhph] {
    margin: 0;
    color: var(--text);
    font-size: 15px;
    font-weight: 700;
}


.security-card p[b-1swgmozhph] {
    margin: 11px 0 0;
    color: var(--muted);
    font-size: 12.5px;
    line-height: 1.7;
}


/* ============================================================
   CONVERSATION
   ============================================================ */

.conversation-section[b-1swgmozhph] {
    background: white;
}


.conversation-layout[b-1swgmozhph] {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    align-items: center;
    gap: 100px;
}


.conversation-copy p[b-1swgmozhph] {
    max-width: 510px;
    margin: 21px 0 0;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.77;
}


.chat-window[b-1swgmozhph] {
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 17px;
    background: white;
    box-shadow: var(--shadow);
}


.chat-header[b-1swgmozhph] {
    min-height: 55px;
    padding: 0 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--border);
    background: #fbfcfe;
    color: var(--text);
    font-size: 11px;
    font-weight: 700;
}


    .chat-header > div[b-1swgmozhph] {
        display: flex;
        align-items: center;
        gap: 8px;
    }


    .chat-header > span[b-1swgmozhph] {
        color: #7b8798;
        font-size: 9px;
        font-weight: 600;
    }


.online-dot[b-1swgmozhph] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--green);
}


.chat-body[b-1swgmozhph] {
    padding: 25px;
    background: #f8fafd;
}


.chat-message[b-1swgmozhph] {
    max-width: 87%;
    padding: 14px 16px;
    border-radius: 12px;
    font-size: 12px;
    line-height: 1.6;
}


.chat-user[b-1swgmozhph] {
    margin-left: auto;
    background: var(--blue-600);
    color: white;
    border-bottom-right-radius: 4px;
}


.chat-assistant[b-1swgmozhph] {
    margin-top: 18px;
    background: white;
    color: var(--text-2);
    border: 1px solid var(--border);
    border-bottom-left-radius: 4px;
}


    .chat-assistant p[b-1swgmozhph] {
        margin: 12px 0 0;
    }



.result-table[b-1swgmozhph] {
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 8px;
}


    .result-table > div[b-1swgmozhph] {
        padding: 8px 10px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid var(--border);
    }


        .result-table > div:last-child[b-1swgmozhph] {
            border-bottom: none;
        }


    .result-table span[b-1swgmozhph] {
        color: var(--muted);
        font-size: 10px;
    }


    .result-table strong[b-1swgmozhph] {
        color: #25825f;
        font-size: 10px;
    }


/* ============================================================
   PRICING
   ============================================================ */

.pricing-section[b-1swgmozhph] {
    background: linear-gradient( 180deg, #f7f9fc, #ffffff );
}


.pricing-grid[b-1swgmozhph] {
    max-width: 880px;
    margin-inline: auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 19px;
}


.pricing-card[b-1swgmozhph] {
    position: relative;
    padding: 33px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: white;
}


.featured-pricing[b-1swgmozhph] {
    border-color: #afc1ff;
    box-shadow: 0 20px 60px rgba(48, 86, 222, 0.12);
}



.pricing-card h3[b-1swgmozhph] {
    margin: 0;
    color: var(--text);
    font-size: 24px;
    font-weight: 730;
    letter-spacing: -0.025em;
}


.price[b-1swgmozhph] {
    margin-top: 21px;
    display: flex;
    align-items: flex-start;
}


.currency[b-1swgmozhph] {
    margin-top: 7px;
    color: var(--text);
    font-size: 20px;
    font-weight: 700;
}


.price-number[b-1swgmozhph] {
    color: var(--text);
    font-size: 45px;
    font-weight: 760;
    line-height: 1;
    letter-spacing: -0.045em;
}


.price-period[b-1swgmozhph] {
    align-self: flex-end;
    margin: 0 0 4px 7px;
    color: var(--muted);
    font-size: 11px;
}


.enterprise-price[b-1swgmozhph] {
    margin-top: 24px;
    min-height: 45px;
    display: flex;
    align-items: center;
    color: var(--text);
    font-size: 31px;
    font-weight: 740;
    letter-spacing: -0.035em;
}


.price-description[b-1swgmozhph] {
    min-height: 49px;
    margin: 18px 0 23px;
    color: var(--muted);
    font-size: 12.5px;
    line-height: 1.65;
}


.pricing-divider[b-1swgmozhph] {
    height: 1px;
    margin: 27px 0;
    background: var(--border);
}


.feature-list[b-1swgmozhph] {
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    list-style: none;
}


    .feature-list li[b-1swgmozhph] {
        display: flex;
        align-items: center;
        gap: 9px;
        color: var(--text-2);
        font-size: 12px;
    }


        .feature-list li span[b-1swgmozhph] {
            color: var(--green);
            font-size: 12px;
            font-weight: 800;
        }


/* ============================================================
   FAQ
   ============================================================ */

.faq-section[b-1swgmozhph] {
    background: white;
}


.faq-layout[b-1swgmozhph] {
    display: grid;
    grid-template-columns: minmax(0, 0.65fr) minmax(0, 1.35fr);
    align-items: start;
    gap: 100px;
}


.faq-intro[b-1swgmozhph] {
    position: sticky;
    top: 115px;
}


    .faq-intro p[b-1swgmozhph] {
        max-width: 390px;
        margin: 20px 0 0;
        color: var(--muted);
        font-size: 14px;
        line-height: 1.75;
    }


.faq-list[b-1swgmozhph] {
    border-top: 1px solid var(--border);
}


    .faq-list details[b-1swgmozhph] {
        border-bottom: 1px solid var(--border);
    }


    .faq-list summary[b-1swgmozhph] {
        position: relative;
        padding: 21px 42px 21px 0;
        display: block;
        color: var(--text);
        font-size: 14px;
        font-weight: 680;
        cursor: pointer;
        list-style: none;
    }


        .faq-list summary[b-1swgmozhph]::-webkit-details-marker {
            display: none;
        }


        .faq-list summary > span[b-1swgmozhph] {
            position: absolute;
            top: 50%;
            right: 5px;
            transform: translateY(-50%);
            color: #8390a2;
            font-size: 20px;
            font-weight: 300;
            transition: transform 0.2s ease;
        }


    .faq-list details[open] summary > span[b-1swgmozhph] {
        transform: translateY(-50%) rotate(45deg);
    }


    .faq-list details p[b-1swgmozhph] {
        max-width: 690px;
        margin: -5px 0 22px;
        color: var(--muted);
        font-size: 13px;
        line-height: 1.75;
    }


/* ============================================================
   FINAL CTA
   ============================================================ */

.final-cta[b-1swgmozhph] {
    position: relative;
    padding: 112px 0;
    overflow: hidden;
    background: linear-gradient( 145deg, #07111f, #0b1930 );
    color: white;
}


.final-grid[b-1swgmozhph] {
    position: absolute;
    inset: 0;
    opacity: 0.08;
    background-image: linear-gradient( rgba(255, 255, 255, 0.1) 1px, transparent 1px ), linear-gradient( 90deg, rgba(255, 255, 255, 0.1) 1px, transparent 1px );
    background-size: 54px 54px;
}


.final-glow[b-1swgmozhph] {
    position: absolute;
    top: -250px;
    left: 50%;
    width: 700px;
    height: 500px;
    transform: translateX(-50%);
    border-radius: 50%;
    background: #4169f5;
    filter: blur(130px);
    opacity: 0.12;
}


.final-cta-content[b-1swgmozhph] {
    position: relative;
    z-index: 2;
    max-width: 850px;
    text-align: center;
}


.final-cta h2[b-1swgmozhph] {
    margin: 0;
    color: white;
    font-size: clamp(39px, 4vw, 58px);
    line-height: 1.08;
    letter-spacing: -0.048em;
}


    .final-cta h2 span[b-1swgmozhph] {
        display: block;
        color: #90a5ff;
    }


.final-cta p[b-1swgmozhph] {
    max-width: 650px;
    margin: 23px auto 31px;
    color: #9ba9bd;
    font-size: 16px;
    line-height: 1.72;
}


/* ============================================================
   FOOTER
   ============================================================ */

.site-footer[b-1swgmozhph] {
    padding: 52px 0 25px;
    background: #050c16;
    color: #8e9caf;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}


.footer-content[b-1swgmozhph] {
    display: grid;
    grid-template-columns: 1fr auto;
}


.footer-brand p[b-1swgmozhph] {
    margin: 12px 0 0;
    color: #68768a;
    font-size: 11px;
}


.footer-links[b-1swgmozhph] {
    display: flex;
    align-items: flex-start;
    gap: 25px;
    padding-top: 7px;
}


    .footer-links a[b-1swgmozhph] {
        color: #8794a7;
        font-size: 11px;
        transition: color 0.2s ease;
    }


        .footer-links a:hover[b-1swgmozhph] {
            color: white;
        }


.footer-bottom[b-1swgmozhph] {
    grid-column: 1 / -1;
    margin-top: 39px;
    padding-top: 21px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    color: #4f5d70;
    font-size: 10px;
}


/* ============================================================
   RESPONSIVE - 1100
   ============================================================ */

@media (max-width: 1100px) {

    .hero-grid[b-1swgmozhph] {
        gap: 42px;
    }


    .hero h1[b-1swgmozhph] {
        font-size: clamp(41px, 5vw, 58px);
    }


    .access-flow[b-1swgmozhph] {
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
    }


    .flow-arrow[b-1swgmozhph] {
        display: none;
    }


    .question-grid[b-1swgmozhph],
    .role-grid[b-1swgmozhph] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }


    .steps-grid[b-1swgmozhph] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }


    .step-card:not(:last-child)[b-1swgmozhph]::after {
        display: none;
    }


    .security-grid[b-1swgmozhph] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* ============================================================
   RESPONSIVE - 900
   ============================================================ */

@media (max-width: 900px) {

    .section[b-1swgmozhph] {
        padding: 90px 0;
    }


    .desktop-nav[b-1swgmozhph],
    .nav-actions[b-1swgmozhph] {
        display: none;
    }


    .mobile-menu[b-1swgmozhph] {
        position: relative;
        display: block;
        margin-left: auto;
    }


        .mobile-menu > summary[b-1swgmozhph] {
            width: 38px;
            height: 38px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 4px;
            border: 1px solid rgba(255, 255, 255, 0.12);
            border-radius: 8px;
            cursor: pointer;
            list-style: none;
        }


            .mobile-menu > summary[b-1swgmozhph]::-webkit-details-marker {
                display: none;
            }


            .mobile-menu > summary span[b-1swgmozhph] {
                width: 15px;
                height: 1.5px;
                border-radius: 5px;
                background: #c5cedb;
            }


    .mobile-menu-panel[b-1swgmozhph] {
        position: absolute;
        top: 48px;
        right: 0;
        width: 260px;
        padding: 14px;
        display: flex;
        flex-direction: column;
        border: 1px solid rgba(255, 255, 255, 0.1);
        border-radius: 12px;
        background: #0a1526;
        box-shadow: 0 25px 60px rgba(0, 0, 0, 0.4);
    }


        .mobile-menu-panel > a[b-1swgmozhph] {
            padding: 10px 8px;
            color: #b6c0cf;
            font-size: 13px;
        }


    .mobile-menu-actions[b-1swgmozhph] {
        margin-top: 10px;
        padding-top: 13px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
        border-top: 1px solid rgba(255, 255, 255, 0.08);
    }


        .mobile-menu-actions .button[b-1swgmozhph] {
            padding-inline: 10px;
        }


    .hero[b-1swgmozhph] {
        padding: 140px 0 88px;
    }


    .hero-grid[b-1swgmozhph] {
        grid-template-columns: 1fr;
        gap: 62px;
    }


    .hero-copy[b-1swgmozhph] {
        max-width: 720px;
    }


    .hero-visual[b-1swgmozhph] {
        max-width: 720px;
    }


    .definition-grid[b-1swgmozhph],
    .access-layout[b-1swgmozhph],
    .mcp-layout[b-1swgmozhph],
    .conversation-layout[b-1swgmozhph],
    .faq-layout[b-1swgmozhph] {
        grid-template-columns: 1fr;
        gap: 52px;
    }


    .definition-answer[b-1swgmozhph] {
        padding-left: 23px;
    }


    .access-copy > p[b-1swgmozhph],
    .mcp-copy p[b-1swgmozhph],
    .conversation-copy p[b-1swgmozhph] {
        max-width: 680px;
    }


    .security-heading[b-1swgmozhph] {
        grid-template-columns: 1fr;
        gap: 20px;
    }


        .security-heading > p[b-1swgmozhph] {
            max-width: 650px;
        }


    .faq-intro[b-1swgmozhph] {
        position: static;
    }


        .faq-intro p[b-1swgmozhph] {
            max-width: 600px;
        }
}


/* ============================================================
   RESPONSIVE - 650
   ============================================================ */

@media (max-width: 650px) {

    .container[b-1swgmozhph],
    .nav-shell[b-1swgmozhph] {
        width: min(100% - 32px, 1180px);
    }


    .section[b-1swgmozhph] {
        padding: 74px 0;
    }


    .site-header[b-1swgmozhph],
    .nav-shell[b-1swgmozhph] {
        height: 66px;
    }


    .hero[b-1swgmozhph] {
        min-height: 0;
        padding: 121px 0 78px;
    }


        .hero h1[b-1swgmozhph] {
            font-size: clamp(38px, 11vw, 51px);
        }


    .hero-description[b-1swgmozhph] {
        font-size: 16px;
    }


    .hero-actions[b-1swgmozhph] {
        display: grid;
        grid-template-columns: 1fr;
    }


        .hero-actions .button[b-1swgmozhph] {
            width: 100%;
        }



    .product-window-body[b-1swgmozhph] {
        padding: 18px;
    }


    .access-flow[b-1swgmozhph] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }


    .permission-details[b-1swgmozhph] {
        grid-template-columns: 1fr;
    }


    .permission-card-header[b-1swgmozhph] {
        align-items: flex-start;
        flex-direction: column;
        padding: 12px 14px;
        gap: 8px;
    }


    .section-heading[b-1swgmozhph] {
        margin-bottom: 45px;
        text-align: left;
    }


        .section-heading > p[b-1swgmozhph] {
            margin-left: 0;
            margin-right: 0;
        }


    .question-grid[b-1swgmozhph],
    .role-grid[b-1swgmozhph],
    .steps-grid[b-1swgmozhph],
    .security-grid[b-1swgmozhph],
    .pricing-grid[b-1swgmozhph] {
        grid-template-columns: 1fr;
    }


    .question-card[b-1swgmozhph] {
        min-height: 0;
    }


    .answer-strip[b-1swgmozhph] {
        align-items: flex-start;
    }


    .access-layout[b-1swgmozhph] {
        gap: 45px;
    }


    .control-card[b-1swgmozhph] {
        padding: 19px;
        grid-template-columns: 32px 1fr;
    }


    .mcp-layout[b-1swgmozhph] {
        gap: 46px;
    }


    .terminal-content[b-1swgmozhph] {
        padding: 20px;
        font-size: 10px;
    }


        .terminal-content > div[b-1swgmozhph] {
            gap: 10px;
        }


    .terminal-muted[b-1swgmozhph] {
        width: 69px;
    }


    .role-grid[b-1swgmozhph] {
        gap: 12px;
    }


    .security-card[b-1swgmozhph] {
        min-height: 0;
    }


    .conversation-layout[b-1swgmozhph] {
        gap: 48px;
    }


    .chat-body[b-1swgmozhph] {
        padding: 16px;
    }


    .chat-message[b-1swgmozhph] {
        max-width: 95%;
    }


    .pricing-card[b-1swgmozhph] {
        padding: 27px 23px;
    }


    .price-number[b-1swgmozhph] {
        font-size: 42px;
    }


    .final-cta[b-1swgmozhph] {
        padding: 84px 0;
    }


    .footer-content[b-1swgmozhph] {
        grid-template-columns: 1fr;
    }


    .footer-links[b-1swgmozhph] {
        margin-top: 30px;
        flex-wrap: wrap;
        gap: 12px 22px;
    }


    .footer-bottom[b-1swgmozhph] {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }
}


/* ============================================================
   ACCESSIBILITY
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

    .scopebase-page *[b-1swgmozhph],
    .scopebase-page *[b-1swgmozhph]::before,
    .scopebase-page *[b-1swgmozhph]::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}



/* ============================================================
   SCOPEBASE VISUAL REFINEMENTS
   Higher contrast, simpler enterprise styling, security emphasis
   ============================================================ */

.scopebase-page[b-1swgmozhph] {
    --blue-600: #2f57d6;
    --blue-500: #3b63df;
    --text-2: #2f3a4b;
    --muted: #4b586b;
    --muted-light: #667085;
    --border: #d9e0e8;
    --shadow-small: 0 2px 8px rgba(11, 24, 45, 0.05);
    --shadow: 0 14px 38px rgba(9, 22, 45, 0.08);
    --shadow-large: 0 24px 60px rgba(5, 14, 30, 0.12);
}

/* Explicit link colors. Do not rely on inherited anchor colors here;
   Blazor CSS isolation increases selector specificity and can otherwise make
   buttons/brand text inherit the wrong foreground color. */
.site-header .brand-name[b-1swgmozhph],
.site-header .brand[b-1swgmozhph] {
    color: #ffffff;
}

.site-header .sign-in-link[b-1swgmozhph] {
    color: #e7edf6;
}

    .site-header .sign-in-link:hover[b-1swgmozhph] {
        color: #ffffff;
    }

.desktop-nav a[b-1swgmozhph] {
    color: #d0d9e6;
}

    .desktop-nav a:hover[b-1swgmozhph] {
        color: #ffffff;
    }

.button-primary[b-1swgmozhph] {
    color: #ffffff !important;
}

.button-white[b-1swgmozhph] {
    color: #0b1422 !important;
}

.button-secondary[b-1swgmozhph] {
    color: #101828 !important;
}

.footer-brand .brand[b-1swgmozhph],
.footer-brand .brand-name[b-1swgmozhph] {
    color: #ffffff;
}

/* Use the actual brand asset instead of a generated geometric mark. */
.brand-logo[b-1swgmozhph] {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    display: block;
    object-fit: contain;
    border-radius: 6px;
}

/* Remove the synthetic AI-style decorative effects and keep the hero restrained. */
.hero[b-1swgmozhph] {
    background: #0b1422;
}

.hero-grid-background[b-1swgmozhph],
.hero-orb[b-1swgmozhph],
.final-grid[b-1swgmozhph],
.final-glow[b-1swgmozhph],
.scope-glow[b-1swgmozhph] {
    display: none;
}

.hero h1[b-1swgmozhph] {
    letter-spacing: -0.038em;
}

    .hero h1 span[b-1swgmozhph] {
        background: none;
        -webkit-background-clip: initial;
        background-clip: initial;
        color: #dbe5ff;
    }


.hero-description[b-1swgmozhph] {
    color: #d0d7e2;
}


.hero-security-note[b-1swgmozhph] {
    max-width: 610px;
    margin-top: 24px;
    padding: 14px 16px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    border: 1px solid #30435c;
    border-radius: 8px;
    background: #0f1c2d;
}

    .hero-security-note svg[b-1swgmozhph] {
        width: 21px;
        height: 21px;
        flex: 0 0 21px;
        margin-top: 1px;
        fill: none;
        stroke: #7ee0b3;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    .hero-security-note div[b-1swgmozhph] {
        display: flex;
        flex-direction: column;
    }

    .hero-security-note strong[b-1swgmozhph] {
        color: #ffffff;
        font-size: 13px;
    }

    .hero-security-note span[b-1swgmozhph] {
        margin-top: 3px;
        color: #bcc8d7;
        font-size: 12px;
        line-height: 1.5;
    }

/* Less glass, less glow, sharper product UI. */
.product-window[b-1swgmozhph] {
    border-color: #26364b;
    border-radius: 10px;
    background: #0d1827;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.24);
}

    .product-window[b-1swgmozhph]::before {
        display: none;
    }

.product-window-header[b-1swgmozhph] {
    background: #101d2d;
    border-bottom-color: #29394d;
}

.window-title[b-1swgmozhph],
.flow-node small[b-1swgmozhph],
.permission-details span[b-1swgmozhph],
.terminal-top small[b-1swgmozhph],
.terminal-muted[b-1swgmozhph] {
    color: #9eabbd;
}

.flow-node[b-1swgmozhph] {
    border-color: #26364a;
    border-radius: 7px;
    background: #101c2b;
}

.highlighted-node[b-1swgmozhph] {
    border-color: #5474d8;
    background: #14233b;
}

.permission-card[b-1swgmozhph] {
    border-color: #293a50;
    border-radius: 8px;
    background: #101b2a;
}

.permission-card-header[b-1swgmozhph],
.permission-question[b-1swgmozhph] {
    border-bottom-color: #29394d;
}

.permission-card-header[b-1swgmozhph] {
    color: #c8d1de;
}

.permission-details strong[b-1swgmozhph] {
    color: #eef2f7;
}

.flow-arrow[b-1swgmozhph] {
    color: #8190a5;
}

/* Straightforward enterprise typography rather than stylized all-caps labels. */


.section-heading h2[b-1swgmozhph],
.access-copy h2[b-1swgmozhph],
.mcp-copy h2[b-1swgmozhph],
.security-heading h2[b-1swgmozhph],
.conversation-copy h2[b-1swgmozhph],
.definition-grid h2[b-1swgmozhph],
.faq-intro h2[b-1swgmozhph] {
    letter-spacing: -0.032em;
}

/* Sharper cards, subtler shadows. */
.button[b-1swgmozhph] {
    border-radius: 7px;
}

.button-large[b-1swgmozhph] {
    border-radius: 8px;
}

.question-card[b-1swgmozhph],
.step-card[b-1swgmozhph],
.role-card[b-1swgmozhph],
.security-card[b-1swgmozhph],
.pricing-card[b-1swgmozhph],
.chat-window[b-1swgmozhph],
.mcp-terminal[b-1swgmozhph] {
    border-radius: 9px;
    box-shadow: none;
}

    .question-card:hover[b-1swgmozhph] {
        transform: none;
        box-shadow: none;
        border-color: #bfc9d6;
    }

.step-icon[b-1swgmozhph],
.security-icon[b-1swgmozhph],
.role-avatar[b-1swgmozhph] {
    border-radius: 7px;
}

/* Make all copy on dark backgrounds clearly readable. */
.access-copy > p[b-1swgmozhph] {
    color: #c5cfdb;
}

.access-statement[b-1swgmozhph] {
    color: #c5cfdb;
}

.control-card[b-1swgmozhph] {
    border-color: #2a3a4f;
    border-radius: 8px;
    background: #0f1b2a;
}

    .control-card:hover[b-1swgmozhph] {
        transform: none;
        background: #132236;
        border-color: #425a79;
    }

    .control-card p[b-1swgmozhph] {
        color: #b7c2d0;
    }

.control-number[b-1swgmozhph] {
    color: #9eb2ff;
}

/* Database connection assurance immediately below the onboarding steps. */
.connection-security[b-1swgmozhph] {
    margin-top: 34px;
    padding: 24px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px 24px;
    border: 1px solid #cad6cf;
    border-radius: 9px;
    background: #f5faf7;
}

.connection-security-icon[b-1swgmozhph] {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border: 1px solid #bad9ca;
    border-radius: 8px;
    background: #ffffff;
    color: #167653;
}

    .connection-security-icon svg[b-1swgmozhph] {
        width: 23px;
        height: 23px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

.connection-security strong[b-1swgmozhph] {
    color: #17382d;
    font-size: 15px;
}

.connection-security p[b-1swgmozhph] {
    margin: 4px 0 0;
    max-width: 650px;
    color: #405b52;
    font-size: 13px;
    line-height: 1.65;
}

.connection-security-points[b-1swgmozhph] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    color: #24664f;
    font-size: 11px;
    font-weight: 650;
    white-space: nowrap;
}

/* Stronger security section with a clear no-storage statement. */
.security-section[b-1swgmozhph] {
    background: #f5f7fa;
}

.security-heading > p[b-1swgmozhph] {
    color: #445164;
}

.security-assurance[b-1swgmozhph] {
    margin-bottom: 26px;
    padding: 25px 27px;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 18px;
    align-items: start;
    border: 1px solid #bfcfca;
    border-left: 4px solid #1f8a64;
    border-radius: 8px;
    background: #ffffff;
}

.security-assurance-mark[b-1swgmozhph] {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 7px;
    background: #e8f6f0;
    color: #167653;
}

    .security-assurance-mark svg[b-1swgmozhph] {
        width: 23px;
        height: 23px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

.security-assurance strong[b-1swgmozhph] {
    color: #14372c;
    font-size: 18px;
}

.security-assurance p[b-1swgmozhph] {
    margin: 5px 0 0;
    max-width: 800px;
    color: #43574f;
    font-size: 13.5px;
    line-height: 1.7;
}

.security-card p[b-1swgmozhph],
.step-card p[b-1swgmozhph],
.role-card-header span[b-1swgmozhph],
.faq-list details p[b-1swgmozhph],
.faq-intro p[b-1swgmozhph],
.mcp-copy p[b-1swgmozhph],
.conversation-copy p[b-1swgmozhph],
.price-description[b-1swgmozhph] {
    color: #4c596b;
}

/* Footer is dark, but secondary text should still be readable. */
.site-footer[b-1swgmozhph] {
    color: #b7c1cf;
}

.footer-brand p[b-1swgmozhph],
.footer-links a[b-1swgmozhph] {
    color: #aab6c6;
}

.footer-bottom[b-1swgmozhph] {
    color: #8c9aad;
}

.final-cta[b-1swgmozhph] {
    background: #0b1422;
}

    .final-cta p[b-1swgmozhph] {
        color: #c1cad7;
    }

    .final-cta h2 span[b-1swgmozhph] {
        color: #bccaff;
    }

@media (max-width: 900px) {
    .connection-security[b-1swgmozhph] {
        grid-template-columns: auto 1fr;
    }

    .connection-security-points[b-1swgmozhph] {
        grid-column: 1 / -1;
        padding-left: 62px;
        white-space: normal;
    }
}

@media (max-width: 650px) {
    .brand-logo[b-1swgmozhph] {
        width: 29px;
        height: 29px;
        flex-basis: 29px;
    }

    .connection-security[b-1swgmozhph],
    .security-assurance[b-1swgmozhph] {
        grid-template-columns: 1fr;
    }

    .connection-security-points[b-1swgmozhph] {
        grid-column: auto;
        padding-left: 0;
    }
}

/* ============================================================
   PRODUCT SCREENSHOTS
   ============================================================ */

.product-tour-section[b-1swgmozhph] {
    background: #f6f8fb;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

.screenshot-grid[b-1swgmozhph] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}

.screenshot-card[b-1swgmozhph] {
    margin: 0;
    overflow: hidden;
    border: 1px solid #d8e0e9;
    border-radius: 10px;
    background: #ffffff;
}

.screenshot-link[b-1swgmozhph] {
    position: relative;
    display: block;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #eef2f6;
    border-bottom: 1px solid #dfe5ec;
    cursor: zoom-in;
}

.screenshot-link img[b-1swgmozhph] {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    object-fit: contain;
    display: block;
    transition: transform 0.18s ease, filter 0.18s ease;
}

.screenshot-link:hover img[b-1swgmozhph],
.screenshot-link:focus-visible img[b-1swgmozhph] {
    transform: scale(1.012);
    filter: brightness(0.94);
}

.screenshot-link:focus-visible[b-1swgmozhph] {
    outline: 3px solid rgba(59, 99, 223, 0.35);
    outline-offset: -3px;
}

.screenshot-view[b-1swgmozhph] {
    position: absolute;
    right: 14px;
    bottom: 14px;
    padding: 7px 10px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 6px;
    background: rgba(7, 17, 31, 0.88);
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    opacity: 0;
    transform: translateY(4px);
    transition: opacity 0.18s ease, transform 0.18s ease;
    pointer-events: none;
}

.screenshot-link:hover .screenshot-view[b-1swgmozhph],
.screenshot-link:focus-visible .screenshot-view[b-1swgmozhph] {
    opacity: 1;
    transform: translateY(0);
}

.screenshot-card figcaption[b-1swgmozhph] {
    padding: 18px 20px 20px;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.screenshot-card figcaption strong[b-1swgmozhph] {
    color: var(--text);
    font-size: 15px;
    font-weight: 720;
}

.screenshot-card figcaption span[b-1swgmozhph] {
    color: #526075;
    font-size: 12.5px;
    line-height: 1.6;
}

@media (max-width: 900px) {
    .screenshot-grid[b-1swgmozhph] {
        grid-template-columns: 1fr;
    }

    .screenshot-view[b-1swgmozhph] {
        opacity: 1;
        transform: none;
    }
}

@media (max-width: 650px) {
    .screenshot-grid[b-1swgmozhph] {
        gap: 16px;
    }

    .screenshot-card figcaption[b-1swgmozhph] {
        padding: 15px 16px 17px;
    }

    .screenshot-view[b-1swgmozhph] {
        right: 10px;
        bottom: 10px;
    }
}


/* ============================================================
   STARTER + BUSINESS PRICING
   Both plans include the same features; only user limits differ.
   ============================================================ */

.pricing-grid[b-1swgmozhph] {
    max-width: 970px;
    align-items: stretch;
}

.pricing-card[b-1swgmozhph] {
    display: flex;
    flex-direction: column;
}

.starter-pricing[b-1swgmozhph] {
    border-color: var(--border);
    background: #ffffff;
}


.pricing-card .price-description[b-1swgmozhph] {
    min-height: 62px;
}

.pricing-card .pricing-divider[b-1swgmozhph] {
    flex-shrink: 0;
}

.pricing-footnote[b-1swgmozhph] {
    margin: 25px 0 0;
    color: var(--muted);
    font-size: 13px;
    text-align: center;
    line-height: 1.65;
}

@media (max-width: 650px) {
    .pricing-card .price-description[b-1swgmozhph] {
        min-height: 0;
    }

    .pricing-footnote[b-1swgmozhph] {
        padding: 0 10px;
    }
}


/* ============================================================
   SUPPORT AND SALES
   ============================================================ */

.support-section[b-1swgmozhph] {
    background: #f6f8fb;
    border-top: 1px solid var(--border);
}

.support-layout[b-1swgmozhph] {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    gap: 84px;
    align-items: center;
}

.support-intro h2[b-1swgmozhph] {
    max-width: 520px;
    margin: 0;
    color: var(--text);
    font-size: clamp(34px, 3.3vw, 48px);
    line-height: 1.14;
    letter-spacing: -0.032em;
}

.support-intro > p:not(.support-address)[b-1swgmozhph] {
    max-width: 510px;
    margin: 21px 0 27px;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.75;
}

.support-main-button[b-1swgmozhph] {
    width: fit-content;
}

.support-address[b-1swgmozhph] {
    margin: 16px 0 0;
    color: var(--muted);
    font-size: 13px;
}

.support-address a[b-1swgmozhph] {
    color: #2448b8;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.support-address a:hover[b-1swgmozhph] {
    text-decoration: underline;
}

.support-topics[b-1swgmozhph] {
    display: grid;
    gap: 12px;
}

.support-topic[b-1swgmozhph] {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 17px;
    padding: 23px 25px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: #ffffff;
}

.support-topic-number[b-1swgmozhph] {
    padding-top: 2px;
    color: #3154bd;
    font-size: 12px;
    font-weight: 800;
}

.support-topic h3[b-1swgmozhph] {
    margin: 0 0 6px;
    color: var(--text);
    font-size: 16px;
    font-weight: 720;
}

.support-topic p[b-1swgmozhph] {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.67;
}

@media (min-width: 901px) and (max-width: 1180px) {
    .desktop-nav[b-1swgmozhph] {
        gap: 16px;
        margin-right: 18px;
    }

    .nav-actions[b-1swgmozhph] {
        gap: 12px;
    }

    .desktop-nav a[b-1swgmozhph] {
        font-size: 13px;
    }
}

@media (max-width: 900px) {
    .support-layout[b-1swgmozhph] {
        grid-template-columns: 1fr;
        gap: 36px;
    }
}

@media (max-width: 650px) {
    .support-topic[b-1swgmozhph] {
        padding: 19px;
        gap: 10px;
        grid-template-columns: 31px minmax(0, 1fr);
    }
}


/* ============================================================
   HOMEPAGE PRODUCT VIDEO
   ============================================================ */


.scopebase-page .hero .hero-demo-button[b-1swgmozhph] {
    color: #eef3ff !important;
    background: #162438;
    border-color: #384b65;
    box-shadow: none;
}

.scopebase-page .hero .hero-demo-button:hover[b-1swgmozhph],
.scopebase-page .hero .hero-demo-button:focus-visible[b-1swgmozhph] {
    color: #ffffff !important;
    background: #20344e;
    border-color: #5a7499;
}

.demo-section[b-1swgmozhph] {
    padding: 86px 0;
    background: #f5f7fb;
    border-bottom: 1px solid var(--border);
}

.demo-layout[b-1swgmozhph] {
    display: grid;
    grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
    align-items: center;
    gap: 60px;
}

.demo-copy h2[b-1swgmozhph] {
    margin: 0;
    color: var(--text);
    font-size: clamp(32px, 3vw, 44px);
    font-weight: 740;
    letter-spacing: -0.032em;
    line-height: 1.13;
}

.demo-copy > p[b-1swgmozhph] {
    margin: 20px 0 0;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.76;
}

.demo-highlights[b-1swgmozhph] {
    margin: 24px 0 28px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    list-style: none;
}

.demo-highlights li[b-1swgmozhph] {
    position: relative;
    padding-left: 26px;
    color: var(--text-2);
    font-size: 13.5px;
    line-height: 1.6;
}

.demo-highlights li[b-1swgmozhph]::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: #18835f;
    font-weight: 800;
}

.demo-video-frame[b-1swgmozhph] {
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border: 1px solid #cbd5e2;
    border-radius: 10px;
    background: #0b1422;
    box-shadow: 0 16px 42px rgba(11, 24, 45, 0.12);
}

.demo-video-frame iframe[b-1swgmozhph] {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

.demo-video-caption[b-1swgmozhph] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 13px;
    color: var(--muted);
    font-size: 12px;
}

.demo-video-caption a[b-1swgmozhph] {
    color: #2448b8;
    font-weight: 700;
    white-space: nowrap;
}

.demo-video-caption a:hover[b-1swgmozhph],
.demo-video-caption a:focus-visible[b-1swgmozhph] {
    text-decoration: underline;
}

@media (max-width: 980px) {
    .demo-layout[b-1swgmozhph] {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .demo-copy[b-1swgmozhph] {
        max-width: 700px;
    }
}

@media (max-width: 650px) {
    .demo-section[b-1swgmozhph] {
        padding: 68px 0;
    }

    .demo-copy .button[b-1swgmozhph] {
        width: 100%;
    }

    .demo-video-caption[b-1swgmozhph] {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }
}


/* ============================================================
   CLEAN MARKETING PRESENTATION
   Plain statuses instead of badges / tags / pill-shaped labels.
   ============================================================ */

.permission-decision[b-1swgmozhph] {
    color: #70d7ad;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.01em;
}

.permission-access[b-1swgmozhph] {
    display: grid;
    gap: 9px;
    padding: 15px 16px 16px;
    border-top: 1px solid #29394d;
}

.permission-access > div[b-1swgmozhph] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 14px;
}

.permission-access strong[b-1swgmozhph] {
    min-width: 72px;
    color: #9eabbd;
    font-size: 10px;
    font-weight: 650;
}

.permission-access span[b-1swgmozhph] {
    color: #dbe4f1;
    font-size: 11px;
    line-height: 1.5;
}

.query-verification[b-1swgmozhph] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #247654;
    font-size: 11px;
    font-weight: 700;
}

/* Allow/deny examples remain clear without chip-like color blocks. */
.role-restriction[b-1swgmozhph] {
    margin-top: 16px;
    padding: 0;
    border-radius: 0;
    background: transparent;
    font-size: 11px;
}

.role-approved[b-1swgmozhph] {
    background: transparent;
}

/* ============================================================
   FOUNDER STORY
   ============================================================ */


.founder-section[b-1swgmozhph] {
    background: #ffffff;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

.founder-layout[b-1swgmozhph] {
    display: grid;
    grid-template-columns: minmax(0, 0.86fr) minmax(0, 1.14fr);
    align-items: start;
    gap: 90px;
}

.founder-intro h2[b-1swgmozhph] {
    margin: 0;
    color: var(--text);
    font-size: clamp(34px, 3.3vw, 49px);
    font-weight: 740;
    letter-spacing: -0.032em;
    line-height: 1.12;
}

.founder-lead[b-1swgmozhph] {
    max-width: 420px;
    margin: 24px 0 0;
    color: var(--text-2);
    font-size: 18px;
    line-height: 1.7;
}

.founder-byline[b-1swgmozhph] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    max-width: 340px;
    margin-top: 38px;
    padding-top: 20px;
    border-top: 1px solid var(--border);
}

.founder-byline strong[b-1swgmozhph] {
    color: var(--text);
    font-size: 15px;
    font-weight: 730;
}

.founder-byline span[b-1swgmozhph] {
    color: var(--muted);
    font-size: 13px;
}

.founder-story[b-1swgmozhph] {
    padding-left: 34px;
    border-left: 2px solid #d9e0e8;
}

.founder-story p[b-1swgmozhph] {
    margin: 0 0 20px;
    color: var(--text-2);
    font-size: 15.5px;
    line-height: 1.84;
}

.founder-story p:last-child[b-1swgmozhph] {
    margin-bottom: 0;
}

@media (max-width: 900px) {
    .founder-layout[b-1swgmozhph] {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .founder-story[b-1swgmozhph] {
        padding-left: 0;
        border-left: none;
    }

    .founder-byline[b-1swgmozhph] {
        margin-top: 27px;
    }
}

@media (max-width: 650px) {
    .founder-lead[b-1swgmozhph] {
        font-size: 16px;
    }

    .founder-story p[b-1swgmozhph] {
        font-size: 14.5px;
        line-height: 1.78;
    }

    .permission-access > div[b-1swgmozhph] {
        display: grid;
        gap: 2px;
    }
}

/* Give the expanded desktop navigation room on small laptops. */
@media (min-width: 901px) and (max-width: 990px) {
    .desktop-nav[b-1swgmozhph] {
        gap: 12px;
        margin-right: 14px;
    }

    .desktop-nav a[b-1swgmozhph] {
        font-size: 12px;
    }

    .nav-actions[b-1swgmozhph] {
        gap: 10px;
    }

    .button-nav[b-1swgmozhph] {
        padding-inline: 14px;
    }
}


/* Mobile fixed header is 66px tall; leave a small gap above targeted headings. */
@media (max-width: 650px) {
    #how-it-works[b-1swgmozhph],
    #access-control[b-1swgmozhph],
    #product-tour[b-1swgmozhph],
    #security[b-1swgmozhph],
    #about[b-1swgmozhph],
    #pricing[b-1swgmozhph],
    #faq[b-1swgmozhph],
    #support[b-1swgmozhph],
    #watch-demo[b-1swgmozhph] {
        scroll-margin-top: 80px;
    }
}

/* ============================================================
   LEGAL LINKS - HOME FOOTER
   ============================================================ */
.footer-legal[b-1swgmozhph] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 22px;
}
.footer-legal a[b-1swgmozhph] {
    color: #b7c1cf;
    font-size: 11px;
    font-weight: 550;
    white-space: nowrap;
}
.footer-legal a:hover[b-1swgmozhph],
.footer-legal a:focus-visible[b-1swgmozhph] {
    color: #ffffff;
    text-decoration: underline;
    text-underline-offset: 3px;
}
@media (max-width: 650px) {
    .footer-legal[b-1swgmozhph] { margin-top: 6px; }
}
/* /Pages/Marketing/Privacy.razor.rz.scp.css */
/* ScopeBase public legal pages - Blazor CSS isolation */
.legal-page[b-tigk6tu5ur] {
    --navy: #0b1422;
    --navy-deep: #050c16;
    --navy-border: #26374e;
    --primary: #315bd7;
    --text: #101828;
    --text-soft: #344054;
    --muted: #556277;
    --border: #dfe5ec;
    --surface: #f7f9fc;
    min-height: 100vh;
    background: #fff;
    color: var(--text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 15px;
    line-height: 1.75;
    overflow-x: hidden;
}

.legal-page *[b-tigk6tu5ur], .legal-page *[b-tigk6tu5ur]::before, .legal-page *[b-tigk6tu5ur]::after { box-sizing: border-box; }
.legal-page a[b-tigk6tu5ur] { text-decoration: none; }
.legal-page a:focus-visible[b-tigk6tu5ur], .legal-page button:focus-visible[b-tigk6tu5ur],
.legal-page summary:focus-visible[b-tigk6tu5ur] { outline: 3px solid #7593eb; outline-offset: 3px; }
.legal-container[b-tigk6tu5ur] { width: min(1160px, calc(100% - 48px)); margin-inline: auto; }
.legal-skip[b-tigk6tu5ur] {
    position: fixed; z-index: 2500; top: 8px; left: 12px;
    transform: translateY(-180%); background: white; color: #0b1422;
    padding: 9px 15px; border-radius: 5px; font-weight: 700;
}
.legal-skip:focus[b-tigk6tu5ur] { transform: none; }

/* Header shares the homepage's restrained dark navigation aesthetic. */
.legal-header[b-tigk6tu5ur] {
    height: 74px; position: sticky; top: 0; z-index: 1000;
    background: rgba(7, 17, 31, .98); border-bottom: 1px solid #1e2a3c;
}
.legal-nav[b-tigk6tu5ur] { min-height: 74px; display: flex; align-items: center; gap: 30px; }
.legal-brand[b-tigk6tu5ur] { display: inline-flex; align-items: center; gap: 11px; color: #fff; flex: 0 0 auto; }
.legal-brand img[b-tigk6tu5ur] { display: block; width: 32px; height: 32px; border-radius: 6px; object-fit: contain; }
.legal-brand strong[b-tigk6tu5ur] { font-size: 19px; font-weight: 750; letter-spacing: -.4px; }
.legal-nav-links[b-tigk6tu5ur] { display: flex; align-items: center; gap: 27px; margin-left: auto; }
.legal-nav-links a[b-tigk6tu5ur], .legal-signin[b-tigk6tu5ur] { color: #c5d0df; font-size: 13px; font-weight: 600; }
.legal-nav-links a:hover[b-tigk6tu5ur], .legal-signin:hover[b-tigk6tu5ur] { color: white; }
.legal-nav-actions[b-tigk6tu5ur] { display: flex; align-items: center; gap: 20px; }
.legal-start[b-tigk6tu5ur] {
    display: inline-flex; align-items: center; justify-content: center; min-height: 39px;
    padding: 0 17px; border-radius: 7px; background: #315bd7; color: #fff;
    font-size: 13px; font-weight: 700;
}
.legal-start:hover[b-tigk6tu5ur] { background: #416cef; }
.legal-menu[b-tigk6tu5ur] { display: none; margin-left: auto; position: relative; }
.legal-menu > summary[b-tigk6tu5ur] { list-style: none; width: 37px; height: 37px; border: 1px solid #4b5b72; border-radius: 7px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.legal-menu > summary[b-tigk6tu5ur]::-webkit-details-marker { display: none; }
.legal-menu-icon[b-tigk6tu5ur] { width: 15px; height: 12px; display: flex; flex-direction: column; justify-content: space-between; }
.legal-menu-icon i[b-tigk6tu5ur] { height: 2px; background: #e4eaf3; border-radius: 2px; }
.legal-menu-panel[b-tigk6tu5ur] {
    position: absolute; right: 0; top: 47px; width: min(290px, calc(100vw - 32px));
    display: flex; flex-direction: column; padding: 10px; border: 1px solid #273a53;
    border-radius: 9px; background: #0d1a2b; box-shadow: 0 22px 35px rgba(0,0,0,.28);
}
.legal-menu-panel a[b-tigk6tu5ur] { display: block; padding: 9px 10px; color: #d2deeb; font-size: 13px; }
.legal-menu-panel a:hover[b-tigk6tu5ur] { color: white; background: #182941; }
.legal-menu-panel .legal-start[b-tigk6tu5ur] { text-align: center; padding: 9px 10px; background: #315bd7; margin-top: 5px; }

/* Intro */
.legal-hero[b-tigk6tu5ur] { padding: 63px 0 48px; background: #f7f9fc; border-bottom: 1px solid var(--border); }
.legal-breadcrumb[b-tigk6tu5ur] { display: flex; flex-wrap: wrap; align-items: center; gap: 11px; font-size: 12px; color: #647187; }
.legal-breadcrumb a[b-tigk6tu5ur] { color: #405b8c; }
.legal-breadcrumb a:hover[b-tigk6tu5ur] { text-decoration: underline; }
.legal-hero h1[b-tigk6tu5ur] { margin: 24px 0 14px; font-size: clamp(36px, 4.3vw, 55px); line-height: 1.11; letter-spacing: -.035em; font-weight: 760; }
.legal-intro[b-tigk6tu5ur] { max-width: 770px; margin: 0; color: #3f4c5e; font-size: 16px; line-height: 1.8; }
.legal-updated[b-tigk6tu5ur] { color: #58667b; margin: 20px 0 0; font-size: 12px; font-weight: 600; }

/* Document / table of contents */
.legal-document-layout[b-tigk6tu5ur] { display: grid; grid-template-columns: 245px minmax(0, 1fr); gap: 75px; padding-block: 63px 105px; align-items: start; }
.legal-toc[b-tigk6tu5ur] { position: sticky; top: 100px; }
.legal-toc-heading[b-tigk6tu5ur] { margin: 0 0 13px; color: #243147; font-size: 12px; font-weight: 760; }
.legal-toc nav[b-tigk6tu5ur] { display: flex; flex-direction: column; border-left: 1px solid #d9e1ec; }
.legal-toc nav a[b-tigk6tu5ur] { padding: 8px 0 8px 15px; color: #536175; font-size: 12px; line-height: 1.5; transition: color .15s ease, border-color .15s ease; border-left: 2px solid transparent; margin-left: -1px; }
.legal-toc nav a:hover[b-tigk6tu5ur] { color: #234bbf; border-left-color: #315bd7; }
.legal-toc-help[b-tigk6tu5ur] { margin-top: 24px; padding-top: 19px; border-top: 1px solid var(--border); }
.legal-toc-help strong[b-tigk6tu5ur] { color: #344054; font-size: 12px; }
.legal-toc-help a[b-tigk6tu5ur] { display: block; margin-top: 5px; color: #2852c0; font-size: 12px; overflow-wrap: anywhere; }
.legal-article[b-tigk6tu5ur] { max-width: 785px; min-width: 0; }
.legal-article section[b-tigk6tu5ur] { padding: 0 0 30px; margin: 0 0 33px; border-bottom: 1px solid #e9edf2; scroll-margin-top: 112px; }
.legal-article section:last-of-type[b-tigk6tu5ur] { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
.legal-article h2[b-tigk6tu5ur] { margin: 0 0 15px; font-size: clamp(20px, 2vw, 26px); line-height: 1.32; letter-spacing: -.018em; color: #152236; }
.legal-article h3[b-tigk6tu5ur] { margin: 22px 0 8px; font-size: 15px; font-weight: 750; }
.legal-article p[b-tigk6tu5ur] { margin: 0 0 15px; color: #3d4a5b; font-size: 14px; line-height: 1.85; }
.legal-article p:last-child[b-tigk6tu5ur] { margin-bottom: 0; }
.legal-article ul[b-tigk6tu5ur], .legal-article ol[b-tigk6tu5ur] { padding-left: 20px; margin: 0 0 18px; color: #3d4a5b; }
.legal-article li[b-tigk6tu5ur] { padding-left: 2px; margin: 0 0 8px; font-size: 14px; line-height: 1.78; }
.legal-article strong[b-tigk6tu5ur] { color: #19283b; font-weight: 730; }
.legal-article a[b-tigk6tu5ur] { color: #244dc3; text-decoration: underline; text-underline-offset: 2px; }
.legal-article a:hover[b-tigk6tu5ur] { color: #12388f; }
.legal-article .legal-emphasis[b-tigk6tu5ur] { font-weight: 760; }
.legal-endnote[b-tigk6tu5ur] { margin-top: 44px; padding: 25px 27px; border: 1px solid #dce4ef; border-radius: 8px; background: #f7f9fc; }
.legal-endnote h2[b-tigk6tu5ur] { margin: 0 0 9px; font-size: 19px; }
.legal-endnote p[b-tigk6tu5ur] { margin: 0; }

/* Footer */
.legal-footer[b-tigk6tu5ur] { background: #050c16; color: #a6b3c4; padding: 32px 0; }
.legal-footer-inner[b-tigk6tu5ur] { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 15px 35px; }
.legal-footer p[b-tigk6tu5ur] { font-size: 11px; margin: 0; }
.legal-footer a[b-tigk6tu5ur] { color: #b7c6d7; font-size: 11px; }
.legal-footer a:hover[b-tigk6tu5ur] { color: #fff; }
.legal-footer-links[b-tigk6tu5ur] { display: flex; flex-wrap: wrap; gap: 12px 23px; }
@media (max-width: 960px) {
    .legal-nav-links[b-tigk6tu5ur] { gap: 15px; }
    .legal-nav[b-tigk6tu5ur] { gap: 20px; }
    .legal-document-layout[b-tigk6tu5ur] { gap: 40px; grid-template-columns: 215px minmax(0, 1fr); }
}
@media (max-width: 760px) {
    .legal-header[b-tigk6tu5ur], .legal-nav[b-tigk6tu5ur] { height: 66px; min-height: 66px; }
    .legal-nav-links[b-tigk6tu5ur], .legal-nav-actions[b-tigk6tu5ur] { display: none; }
    .legal-menu[b-tigk6tu5ur] { display: block; }
    .legal-container[b-tigk6tu5ur] { width: calc(100% - 32px); }
    .legal-hero[b-tigk6tu5ur] { padding: 45px 0 40px; }
    .legal-document-layout[b-tigk6tu5ur] { grid-template-columns: 1fr; gap: 40px; padding-block: 42px 70px; }
    .legal-toc[b-tigk6tu5ur] { position: static; padding: 19px 20px; border: 1px solid var(--border); border-radius: 7px; background: #fafbfd; }
    .legal-toc nav[b-tigk6tu5ur] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-left: none; gap: 0 16px; }
    .legal-toc nav a[b-tigk6tu5ur] { margin-left: 0; padding: 7px 0; border: 0; font-size: 12px; }
    .legal-toc-help[b-tigk6tu5ur] { margin-top: 13px; }
    .legal-article section[b-tigk6tu5ur] { scroll-margin-top: 84px; }
}
@media (max-width: 440px) {
    .legal-hero h1[b-tigk6tu5ur] { font-size: 34px; }
    .legal-toc nav[b-tigk6tu5ur] { grid-template-columns: 1fr; }
    .legal-endnote[b-tigk6tu5ur] { padding: 20px; }
}
@media (prefers-reduced-motion: reduce) {
    .legal-page *[b-tigk6tu5ur] { scroll-behavior: auto !important; transition: none !important; }
}
/* /Pages/Marketing/Terms.razor.rz.scp.css */
/* ScopeBase public legal pages - Blazor CSS isolation */
.legal-page[b-a2tatjelkn] {
    --navy: #0b1422;
    --navy-deep: #050c16;
    --navy-border: #26374e;
    --primary: #315bd7;
    --text: #101828;
    --text-soft: #344054;
    --muted: #556277;
    --border: #dfe5ec;
    --surface: #f7f9fc;
    min-height: 100vh;
    background: #fff;
    color: var(--text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 15px;
    line-height: 1.75;
    overflow-x: hidden;
}

.legal-page *[b-a2tatjelkn], .legal-page *[b-a2tatjelkn]::before, .legal-page *[b-a2tatjelkn]::after { box-sizing: border-box; }
.legal-page a[b-a2tatjelkn] { text-decoration: none; }
.legal-page a:focus-visible[b-a2tatjelkn], .legal-page button:focus-visible[b-a2tatjelkn],
.legal-page summary:focus-visible[b-a2tatjelkn] { outline: 3px solid #7593eb; outline-offset: 3px; }
.legal-container[b-a2tatjelkn] { width: min(1160px, calc(100% - 48px)); margin-inline: auto; }
.legal-skip[b-a2tatjelkn] {
    position: fixed; z-index: 2500; top: 8px; left: 12px;
    transform: translateY(-180%); background: white; color: #0b1422;
    padding: 9px 15px; border-radius: 5px; font-weight: 700;
}
.legal-skip:focus[b-a2tatjelkn] { transform: none; }

/* Header shares the homepage's restrained dark navigation aesthetic. */
.legal-header[b-a2tatjelkn] {
    height: 74px; position: sticky; top: 0; z-index: 1000;
    background: rgba(7, 17, 31, .98); border-bottom: 1px solid #1e2a3c;
}
.legal-nav[b-a2tatjelkn] { min-height: 74px; display: flex; align-items: center; gap: 30px; }
.legal-brand[b-a2tatjelkn] { display: inline-flex; align-items: center; gap: 11px; color: #fff; flex: 0 0 auto; }
.legal-brand img[b-a2tatjelkn] { display: block; width: 32px; height: 32px; border-radius: 6px; object-fit: contain; }
.legal-brand strong[b-a2tatjelkn] { font-size: 19px; font-weight: 750; letter-spacing: -.4px; }
.legal-nav-links[b-a2tatjelkn] { display: flex; align-items: center; gap: 27px; margin-left: auto; }
.legal-nav-links a[b-a2tatjelkn], .legal-signin[b-a2tatjelkn] { color: #c5d0df; font-size: 13px; font-weight: 600; }
.legal-nav-links a:hover[b-a2tatjelkn], .legal-signin:hover[b-a2tatjelkn] { color: white; }
.legal-nav-actions[b-a2tatjelkn] { display: flex; align-items: center; gap: 20px; }
.legal-start[b-a2tatjelkn] {
    display: inline-flex; align-items: center; justify-content: center; min-height: 39px;
    padding: 0 17px; border-radius: 7px; background: #315bd7; color: #fff;
    font-size: 13px; font-weight: 700;
}
.legal-start:hover[b-a2tatjelkn] { background: #416cef; }
.legal-menu[b-a2tatjelkn] { display: none; margin-left: auto; position: relative; }
.legal-menu > summary[b-a2tatjelkn] { list-style: none; width: 37px; height: 37px; border: 1px solid #4b5b72; border-radius: 7px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.legal-menu > summary[b-a2tatjelkn]::-webkit-details-marker { display: none; }
.legal-menu-icon[b-a2tatjelkn] { width: 15px; height: 12px; display: flex; flex-direction: column; justify-content: space-between; }
.legal-menu-icon i[b-a2tatjelkn] { height: 2px; background: #e4eaf3; border-radius: 2px; }
.legal-menu-panel[b-a2tatjelkn] {
    position: absolute; right: 0; top: 47px; width: min(290px, calc(100vw - 32px));
    display: flex; flex-direction: column; padding: 10px; border: 1px solid #273a53;
    border-radius: 9px; background: #0d1a2b; box-shadow: 0 22px 35px rgba(0,0,0,.28);
}
.legal-menu-panel a[b-a2tatjelkn] { display: block; padding: 9px 10px; color: #d2deeb; font-size: 13px; }
.legal-menu-panel a:hover[b-a2tatjelkn] { color: white; background: #182941; }
.legal-menu-panel .legal-start[b-a2tatjelkn] { text-align: center; padding: 9px 10px; background: #315bd7; margin-top: 5px; }

/* Intro */
.legal-hero[b-a2tatjelkn] { padding: 63px 0 48px; background: #f7f9fc; border-bottom: 1px solid var(--border); }
.legal-breadcrumb[b-a2tatjelkn] { display: flex; flex-wrap: wrap; align-items: center; gap: 11px; font-size: 12px; color: #647187; }
.legal-breadcrumb a[b-a2tatjelkn] { color: #405b8c; }
.legal-breadcrumb a:hover[b-a2tatjelkn] { text-decoration: underline; }
.legal-hero h1[b-a2tatjelkn] { margin: 24px 0 14px; font-size: clamp(36px, 4.3vw, 55px); line-height: 1.11; letter-spacing: -.035em; font-weight: 760; }
.legal-intro[b-a2tatjelkn] { max-width: 770px; margin: 0; color: #3f4c5e; font-size: 16px; line-height: 1.8; }
.legal-updated[b-a2tatjelkn] { color: #58667b; margin: 20px 0 0; font-size: 12px; font-weight: 600; }

/* Document / table of contents */
.legal-document-layout[b-a2tatjelkn] { display: grid; grid-template-columns: 245px minmax(0, 1fr); gap: 75px; padding-block: 63px 105px; align-items: start; }
.legal-toc[b-a2tatjelkn] { position: sticky; top: 100px; }
.legal-toc-heading[b-a2tatjelkn] { margin: 0 0 13px; color: #243147; font-size: 12px; font-weight: 760; }
.legal-toc nav[b-a2tatjelkn] { display: flex; flex-direction: column; border-left: 1px solid #d9e1ec; }
.legal-toc nav a[b-a2tatjelkn] { padding: 8px 0 8px 15px; color: #536175; font-size: 12px; line-height: 1.5; transition: color .15s ease, border-color .15s ease; border-left: 2px solid transparent; margin-left: -1px; }
.legal-toc nav a:hover[b-a2tatjelkn] { color: #234bbf; border-left-color: #315bd7; }
.legal-toc-help[b-a2tatjelkn] { margin-top: 24px; padding-top: 19px; border-top: 1px solid var(--border); }
.legal-toc-help strong[b-a2tatjelkn] { color: #344054; font-size: 12px; }
.legal-toc-help a[b-a2tatjelkn] { display: block; margin-top: 5px; color: #2852c0; font-size: 12px; overflow-wrap: anywhere; }
.legal-article[b-a2tatjelkn] { max-width: 785px; min-width: 0; }
.legal-article section[b-a2tatjelkn] { padding: 0 0 30px; margin: 0 0 33px; border-bottom: 1px solid #e9edf2; scroll-margin-top: 112px; }
.legal-article section:last-of-type[b-a2tatjelkn] { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
.legal-article h2[b-a2tatjelkn] { margin: 0 0 15px; font-size: clamp(20px, 2vw, 26px); line-height: 1.32; letter-spacing: -.018em; color: #152236; }
.legal-article h3[b-a2tatjelkn] { margin: 22px 0 8px; font-size: 15px; font-weight: 750; }
.legal-article p[b-a2tatjelkn] { margin: 0 0 15px; color: #3d4a5b; font-size: 14px; line-height: 1.85; }
.legal-article p:last-child[b-a2tatjelkn] { margin-bottom: 0; }
.legal-article ul[b-a2tatjelkn], .legal-article ol[b-a2tatjelkn] { padding-left: 20px; margin: 0 0 18px; color: #3d4a5b; }
.legal-article li[b-a2tatjelkn] { padding-left: 2px; margin: 0 0 8px; font-size: 14px; line-height: 1.78; }
.legal-article strong[b-a2tatjelkn] { color: #19283b; font-weight: 730; }
.legal-article a[b-a2tatjelkn] { color: #244dc3; text-decoration: underline; text-underline-offset: 2px; }
.legal-article a:hover[b-a2tatjelkn] { color: #12388f; }
.legal-article .legal-emphasis[b-a2tatjelkn] { font-weight: 760; }
.legal-endnote[b-a2tatjelkn] { margin-top: 44px; padding: 25px 27px; border: 1px solid #dce4ef; border-radius: 8px; background: #f7f9fc; }
.legal-endnote h2[b-a2tatjelkn] { margin: 0 0 9px; font-size: 19px; }
.legal-endnote p[b-a2tatjelkn] { margin: 0; }

/* Footer */
.legal-footer[b-a2tatjelkn] { background: #050c16; color: #a6b3c4; padding: 32px 0; }
.legal-footer-inner[b-a2tatjelkn] { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 15px 35px; }
.legal-footer p[b-a2tatjelkn] { font-size: 11px; margin: 0; }
.legal-footer a[b-a2tatjelkn] { color: #b7c6d7; font-size: 11px; }
.legal-footer a:hover[b-a2tatjelkn] { color: #fff; }
.legal-footer-links[b-a2tatjelkn] { display: flex; flex-wrap: wrap; gap: 12px 23px; }
@media (max-width: 960px) {
    .legal-nav-links[b-a2tatjelkn] { gap: 15px; }
    .legal-nav[b-a2tatjelkn] { gap: 20px; }
    .legal-document-layout[b-a2tatjelkn] { gap: 40px; grid-template-columns: 215px minmax(0, 1fr); }
}
@media (max-width: 760px) {
    .legal-header[b-a2tatjelkn], .legal-nav[b-a2tatjelkn] { height: 66px; min-height: 66px; }
    .legal-nav-links[b-a2tatjelkn], .legal-nav-actions[b-a2tatjelkn] { display: none; }
    .legal-menu[b-a2tatjelkn] { display: block; }
    .legal-container[b-a2tatjelkn] { width: calc(100% - 32px); }
    .legal-hero[b-a2tatjelkn] { padding: 45px 0 40px; }
    .legal-document-layout[b-a2tatjelkn] { grid-template-columns: 1fr; gap: 40px; padding-block: 42px 70px; }
    .legal-toc[b-a2tatjelkn] { position: static; padding: 19px 20px; border: 1px solid var(--border); border-radius: 7px; background: #fafbfd; }
    .legal-toc nav[b-a2tatjelkn] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-left: none; gap: 0 16px; }
    .legal-toc nav a[b-a2tatjelkn] { margin-left: 0; padding: 7px 0; border: 0; font-size: 12px; }
    .legal-toc-help[b-a2tatjelkn] { margin-top: 13px; }
    .legal-article section[b-a2tatjelkn] { scroll-margin-top: 84px; }
}
@media (max-width: 440px) {
    .legal-hero h1[b-a2tatjelkn] { font-size: 34px; }
    .legal-toc nav[b-a2tatjelkn] { grid-template-columns: 1fr; }
    .legal-endnote[b-a2tatjelkn] { padding: 20px; }
}
@media (prefers-reduced-motion: reduce) {
    .legal-page *[b-a2tatjelkn] { scroll-behavior: auto !important; transition: none !important; }
}
/* /Pages/McpAccess.razor.rz.scp.css */
/* =========================================================
   PAGE
========================================================= */

.mcp-page[b-w1vr4okl01] {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    padding: 34px 34px 72px;
    box-sizing: border-box;
    color: #182033;
}


/* =========================================================
   LOADING / ERRORS / MESSAGES
========================================================= */

.page-loading[b-w1vr4okl01] {
    min-height: 420px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #667085;
}

.page-loading > div:last-child[b-w1vr4okl01] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.page-loading strong[b-w1vr4okl01] {
    color: #263044;
    font-size: 16px;
}

.page-loading span[b-w1vr4okl01] {
    color: #8c95a5;
    font-size: 14px;
}

.loading-spinner[b-w1vr4okl01],
.button-spinner[b-w1vr4okl01] {
    border-radius: 50%;
    border-style: solid;
    border-right-color: transparent;
    animation: spin-b-w1vr4okl01 .7s linear infinite;
}

.loading-spinner[b-w1vr4okl01] {
    width: 30px;
    height: 30px;
    border-width: 3px;
    border-color: #e5e8f0;
    border-top-color: #6472d8;
}

.button-spinner[b-w1vr4okl01] {
    width: 13px;
    height: 13px;
    border-width: 2px;
    border-color: currentColor;
    border-right-color: transparent;
}

@keyframes spin-b-w1vr4okl01 {
    to {
        transform: rotate(360deg);
    }
}

.page-error[b-w1vr4okl01],
.page-message[b-w1vr4okl01] {
    margin-bottom: 20px;
    padding: 14px 16px;
    display: flex;
    align-items: flex-start;
    gap: 11px;
    border-radius: 12px;
}

.page-error[b-w1vr4okl01] {
    background: #fff5f5;
    border: 1px solid #efcccc;
    color: #943c3c;
}

.page-message[b-w1vr4okl01] {
    background: #f0faf4;
    border: 1px solid #c8ead3;
    color: #347251;
}

.page-error-icon[b-w1vr4okl01],
.page-message-icon[b-w1vr4okl01] {
    width: 27px;
    height: 27px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 14px;
    font-weight: 850;
}

.page-error-icon[b-w1vr4okl01] {
    background: #f8dada;
    color: #b33838;
}

.page-message-icon[b-w1vr4okl01] {
    background: #d8f3e1;
    color: #257946;
}

.page-error > div:last-child[b-w1vr4okl01] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.page-error strong[b-w1vr4okl01] {
    font-size: 15px;
}

.page-error span[b-w1vr4okl01],
.page-message span[b-w1vr4okl01] {
    font-size: 14px;
    line-height: 1.5;
}


/* =========================================================
   ACCESS DENIED
========================================================= */

.access-denied-card[b-w1vr4okl01] {
    min-height: 480px;
    padding: 48px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 16px;
}

.access-denied-icon[b-w1vr4okl01] {
    width: 52px;
    height: 52px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #fff2f2;
    color: #af4048;
    font-size: 21px;
    font-weight: 850;
}

.access-denied-card h1[b-w1vr4okl01] {
    margin: 0;
    color: #283144;
    font-size: 22px;
}

.access-denied-card p[b-w1vr4okl01] {
    max-width: 520px;
    margin: 9px 0 0;
    color: #8993a2;
    font-size: 14px;
    line-height: 1.65;
}


/* =========================================================
   HEADER
========================================================= */

.page-header[b-w1vr4okl01] {
    margin-bottom: 25px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 28px;
}

.eyebrow[b-w1vr4okl01] {
    margin-bottom: 7px;
    color: #6472d8;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .13em;
}

.page-header h1[b-w1vr4okl01] {
    margin: 0;
    color: #172033;
    font-size: 34px;
    line-height: 1.15;
    font-weight: 760;
    letter-spacing: -.035em;
}

.page-header p[b-w1vr4okl01] {
    max-width: 750px;
    margin: 10px 0 0;
    color: #768093;
    font-size: 16px;
    line-height: 1.65;
}


/* =========================================================
   BUTTONS
========================================================= */

.primary-button[b-w1vr4okl01],
.secondary-button[b-w1vr4okl01],
.copy-button[b-w1vr4okl01],
.modal-close[b-w1vr4okl01],
.danger-button[b-w1vr4okl01] {
    font: inherit;
    cursor: pointer;
}

.primary-button[b-w1vr4okl01] {
    min-height: 43px;
    padding: 0 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #202941;
    border-radius: 9px;
    background: #202941;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    transition: .15s ease;
}

.primary-button:hover:not(:disabled)[b-w1vr4okl01] {
    background: #161e30;
    transform: translateY(-1px);
    box-shadow: 0 5px 14px rgba(25, 33, 52, .12);
}

.secondary-button[b-w1vr4okl01] {
    min-height: 41px;
    padding: 0 15px;
    border: 1px solid #d8dde6;
    border-radius: 9px;
    background: #fff;
    color: #364154;
    font-size: 14px;
    font-weight: 700;
    transition: .15s ease;
}

.secondary-button:hover:not(:disabled)[b-w1vr4okl01] {
    background: #f7f8fa;
    border-color: #c9cfda;
}

.danger-secondary[b-w1vr4okl01] {
    color: #9e4149;
}

.primary-button:disabled[b-w1vr4okl01],
.secondary-button:disabled[b-w1vr4okl01],
.danger-button:disabled[b-w1vr4okl01],
.modal-close:disabled[b-w1vr4okl01] {
    cursor: not-allowed;
    opacity: .6;
}

.button-status-dot[b-w1vr4okl01] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #80d1a2;
    box-shadow: 0 0 0 3px rgba(128, 209, 162, .14);
}


/* =========================================================
   HERO STATUS
========================================================= */

.hero-status-card[b-w1vr4okl01] {
    margin-bottom: 20px;
    padding: 21px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, .025);
}

.hero-status-card.enabled[b-w1vr4okl01] {
    border-color: #d5e8dc;
}

.hero-status-left[b-w1vr4okl01] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 15px;
}

.gateway-icon[b-w1vr4okl01] {
    width: 50px;
    height: 50px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    background: #eef0ff;
    color: #5967cf;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .04em;
}

.status-heading[b-w1vr4okl01] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.status-heading h2[b-w1vr4okl01] {
    margin: 0;
    color: #273043;
    font-size: 17px;
    font-weight: 760;
}

.hero-status-left p[b-w1vr4okl01] {
    max-width: 670px;
    margin: 5px 0 0;
    color: #8993a2;
    font-size: 13px;
    line-height: 1.55;
}

.status-badge[b-w1vr4okl01] {
    padding: 4px 7px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.status-badge.enabled[b-w1vr4okl01] {
    background: #e9f7ef;
    color: #2f7651;
}

.status-badge.enabled > span[b-w1vr4okl01] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #4caf78;
}

.status-badge.disabled[b-w1vr4okl01] {
    background: #f2f4f7;
    color: #818b9b;
}

.hero-status-meta[b-w1vr4okl01] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 24px;
}

.hero-status-meta > div[b-w1vr4okl01] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.hero-status-meta span[b-w1vr4okl01] {
    color: #989fac;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.hero-status-meta strong[b-w1vr4okl01] {
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #4a5466;
    font-size: 12px;
}


/* =========================================================
   SUMMARY
========================================================= */

.summary-grid[b-w1vr4okl01] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.summary-card[b-w1vr4okl01] {
    min-width: 0;
    padding: 19px;
    display: flex;
    align-items: center;
    gap: 14px;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 14px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, .025);
}

.summary-icon[b-w1vr4okl01] {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    font-size: 12px;
    font-weight: 850;
}

.database-summary-icon[b-w1vr4okl01] {
    background: #eef0ff;
    color: #5b68cf;
}

.scope-summary-icon[b-w1vr4okl01] {
    background: #edf8f2;
    color: #347c59;
}

.user-summary-icon[b-w1vr4okl01] {
    background: #fff4e8;
    color: #9c652c;
}

.object-summary-icon[b-w1vr4okl01] {
    background: #f4effd;
    color: #7550b2;
}

.summary-card > div:last-child[b-w1vr4okl01] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.summary-label[b-w1vr4okl01] {
    margin-bottom: 3px;
    color: #7a8494;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .055em;
}

.summary-card strong[b-w1vr4okl01] {
    color: #1c2435;
    font-size: 25px;
    line-height: 1.05;
    letter-spacing: -.025em;
}

.summary-card small[b-w1vr4okl01] {
    margin-top: 5px;
    color: #969eab;
    font-size: 13px;
}


/* =========================================================
   GRID / CARDS
========================================================= */

.mcp-grid[b-w1vr4okl01] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 305px;
    gap: 20px;
    align-items: start;
}

.main-column[b-w1vr4okl01],
.side-column[b-w1vr4okl01] {
    min-width: 0;
}

.main-column[b-w1vr4okl01] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.side-column[b-w1vr4okl01] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    position: sticky;
    top: 20px;
}

.panel-card[b-w1vr4okl01],
.side-card[b-w1vr4okl01] {
    overflow: hidden;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, .025);
}

.panel-header[b-w1vr4okl01],
.side-card-header[b-w1vr4okl01] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.panel-header[b-w1vr4okl01] {
    min-height: 74px;
    padding: 17px 19px;
    border-bottom: 1px solid #edf0f4;
}

.panel-kicker[b-w1vr4okl01] {
    margin-bottom: 4px;
    color: #6472d8;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .09em;
}

.panel-header h2[b-w1vr4okl01],
.side-card-header h3[b-w1vr4okl01] {
    margin: 0;
    color: #273043;
    font-weight: 750;
}

.panel-header h2[b-w1vr4okl01] {
    font-size: 16px;
}

.side-card-header h3[b-w1vr4okl01] {
    font-size: 14px;
}

.panel-header p[b-w1vr4okl01] {
    margin: 4px 0 0;
    color: #8b94a3;
    font-size: 12px;
    line-height: 1.5;
}

.protocol-badge[b-w1vr4okl01] {
    padding: 5px 8px;
    border-radius: 6px;
    background: #f0f2f7;
    color: #687385;
    font-size: 11px;
    font-weight: 850;
}

.panel-body[b-w1vr4okl01] {
    padding: 19px;
}


/* =========================================================
   ENDPOINT
========================================================= */

.endpoint-box[b-w1vr4okl01] {
    padding: 13px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    border: 1px solid #dde2ea;
    border-radius: 10px;
    background: #fafbfc;
}

.endpoint-box > div[b-w1vr4okl01] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.endpoint-box span[b-w1vr4okl01] {
    color: #9099a7;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.endpoint-box code[b-w1vr4okl01] {
    overflow-wrap: anywhere;
    color: #334056;
    font-family: Consolas, "SFMono-Regular", monospace;
    font-size: 14px;
}

.copy-button[b-w1vr4okl01] {
    min-height: 32px;
    padding: 0 10px;
    flex: 0 0 auto;
    border: 1px solid #d5dae4;
    border-radius: 7px;
    background: #fff;
    color: #566174;
    font-size: 12px;
    font-weight: 750;
}

.copy-button:hover[b-w1vr4okl01] {
    background: #f5f6f8;
}

.endpoint-note[b-w1vr4okl01] {
    margin-top: 13px;
    padding: 12px 13px;
    display: flex;
    align-items: flex-start;
    gap: 9px;
    border: 1px solid #dce2f4;
    border-radius: 9px;
    background: #f7f8fd;
}

.endpoint-note-icon[b-w1vr4okl01] {
    width: 23px;
    height: 23px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #e7eaff;
    color: #5d69c8;
    font-size: 12px;
    font-weight: 850;
}

.endpoint-note > div:last-child[b-w1vr4okl01] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.endpoint-note strong[b-w1vr4okl01] {
    color: #495469;
    font-size: 12px;
}

.endpoint-note span[b-w1vr4okl01] {
    color: #7d8798;
    font-size: 11px;
    line-height: 1.55;
}


/* =========================================================
   CLIENTS
========================================================= */

.client-grid[b-w1vr4okl01] {
    padding: 17px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.client-card[b-w1vr4okl01] {
    min-width: 0;
    padding: 15px;
    border: 1px solid #e1e5eb;
    border-radius: 11px;
    background: #fff;
}

.client-top[b-w1vr4okl01] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.client-mark[b-w1vr4okl01] {
    width: 36px;
    height: 36px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    font-size: 14px;
    font-weight: 850;
}

.client-mark.chatgpt[b-w1vr4okl01] {
    background: #edf8f2;
    color: #347c59;
}

.client-mark.claude[b-w1vr4okl01] {
    background: #fff3e9;
    color: #a46634;
}

.client-top > div:last-child[b-w1vr4okl01] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.client-top strong[b-w1vr4okl01] {
    color: #374154;
    font-size: 13px;
}

.client-top span[b-w1vr4okl01] {
    color: #949cab;
    font-size: 11px;
}

.client-status[b-w1vr4okl01] {
    margin-top: 13px;
    padding: 7px 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    border-radius: 7px;
    font-size: 11px;
    font-weight: 700;
}

.client-status.planned[b-w1vr4okl01] {
    background: #f6f7fa;
    color: #7b8595;
}

.client-status > span[b-w1vr4okl01] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #f0ad4e;
}

.client-card ol[b-w1vr4okl01] {
    margin: 13px 0 0;
    padding-left: 19px;
    color: #7e8797;
    font-size: 11px;
    line-height: 1.65;
}

.client-card li + li[b-w1vr4okl01] {
    margin-top: 4px;
}


/* =========================================================
   AUTHORIZATION
========================================================= */

.authorization-flow[b-w1vr4okl01] {
    padding: 19px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 9px;
}

.flow-item[b-w1vr4okl01] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.flow-number[b-w1vr4okl01] {
    width: 27px;
    height: 27px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #eef0ff;
    color: #5967cf;
    font-size: 11px;
    font-weight: 850;
}

.flow-item > div:last-child[b-w1vr4okl01] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.flow-item strong[b-w1vr4okl01] {
    color: #3f495c;
    font-size: 11px;
}

.flow-item span[b-w1vr4okl01] {
    color: #949cab;
    font-size: 10px;
    line-height: 1.4;
}

.flow-arrow[b-w1vr4okl01] {
    color: #b4bac4;
    font-size: 17px;
}

.security-points[b-w1vr4okl01] {
    padding: 0 19px 19px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.security-points > div[b-w1vr4okl01] {
    padding: 9px 10px;
    display: flex;
    align-items: flex-start;
    gap: 7px;
    border: 1px solid #e7eaf0;
    border-radius: 8px;
    background: #fafbfc;
    color: #657083;
    font-size: 11px;
    line-height: 1.5;
}

.security-points span[b-w1vr4okl01] {
    color: #397a58;
    font-weight: 900;
}


/* =========================================================
   SIDE CARDS
========================================================= */

.side-card[b-w1vr4okl01] {
    padding: 17px;
}

.side-card-header[b-w1vr4okl01] {
    margin-bottom: 14px;
}

.readiness-count[b-w1vr4okl01] {
    padding: 4px 7px;
    border-radius: 999px;
    background: #f0f2f7;
    color: #6f7a8c;
    font-size: 11px;
    font-weight: 800;
}

.readiness-list[b-w1vr4okl01] {
    display: flex;
    flex-direction: column;
}

.readiness-item[b-w1vr4okl01] {
    padding: 10px 0;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 9px;
    border-top: 1px solid #edf0f4;
}

.readiness-item:first-child[b-w1vr4okl01] {
    border-top: 0;
}

.readiness-icon[b-w1vr4okl01] {
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 7px;
    background: #f0f2f6;
    color: #8992a1;
    font-size: 11px;
    font-weight: 850;
}

.readiness-icon.complete[b-w1vr4okl01] {
    background: #eaf7ef;
    color: #347553;
}

.readiness-icon.pending[b-w1vr4okl01] {
    background: #fff3e6;
    color: #986331;
}

.readiness-item > div:last-child[b-w1vr4okl01] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.readiness-item strong[b-w1vr4okl01] {
    color: #475164;
    font-size: 12px;
}

.readiness-item span[b-w1vr4okl01] {
    color: #929ba9;
    font-size: 11px;
    line-height: 1.4;
}

.config-list[b-w1vr4okl01] {
    display: flex;
    flex-direction: column;
}

.config-list > div[b-w1vr4okl01] {
    padding: 9px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-top: 1px solid #edf0f4;
}

.config-list > div:first-child[b-w1vr4okl01] {
    border-top: 0;
}

.config-list span[b-w1vr4okl01] {
    color: #929aa8;
    font-size: 11px;
}

.config-list strong[b-w1vr4okl01] {
    max-width: 145px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #4a5466;
    font-size: 11px;
}

.config-list strong.positive[b-w1vr4okl01] {
    color: #347553;
}

.security-card-icon[b-w1vr4okl01] {
    width: 36px;
    height: 36px;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #edf8f2;
    color: #347c59;
    font-size: 14px;
    font-weight: 850;
}

.security-card h3[b-w1vr4okl01] {
    margin: 0;
    color: #3d4759;
    font-size: 14px;
}

.security-card p[b-w1vr4okl01] {
    margin: 7px 0 0;
    color: #818b9a;
    font-size: 11px;
    line-height: 1.6;
}


/* =========================================================
   MODAL
========================================================= */

.modal-backdrop[b-w1vr4okl01] {
    position: fixed;
    inset: 0;
    z-index: 1000;
    padding: 30px 18px;
    overflow-y: auto;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    background: rgba(15, 23, 42, .52);
}

.confirm-modal[b-w1vr4okl01] {
    width: min(540px, 100%);
    margin: auto;
    overflow: hidden;
    background: #fff;
    border: 1px solid #e3e7ed;
    border-radius: 17px;
    box-shadow: 0 20px 55px rgba(15, 23, 42, .18);
}

.modal-header[b-w1vr4okl01] {
    padding: 22px 23px 18px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid #edf0f4;
}

.modal-header h2[b-w1vr4okl01] {
    margin: 0;
    color: #182033;
    font-size: 21px;
    letter-spacing: -.02em;
}

.modal-header p[b-w1vr4okl01] {
    margin: 6px 0 0;
    color: #7d8797;
    font-size: 13px;
}

.danger-eyebrow[b-w1vr4okl01] {
    color: #b44750;
}

.modal-close[b-w1vr4okl01] {
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e1e5eb;
    border-radius: 8px;
    background: #fff;
    color: #667085;
    font-size: 22px;
    line-height: 1;
}

.modal-close:hover:not(:disabled)[b-w1vr4okl01] {
    background: #f6f7f9;
}

.modal-body[b-w1vr4okl01] {
    padding: 23px;
    display: flex;
    align-items: flex-start;
    gap: 13px;
}

.warning-icon[b-w1vr4okl01] {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #fff0f1;
    color: #ba424d;
    font-size: 20px;
    font-weight: 850;
}

.warning-copy strong[b-w1vr4okl01] {
    display: block;
    margin-bottom: 5px;
    color: #3d4658;
    font-size: 14px;
}

.warning-copy p[b-w1vr4okl01] {
    margin: 0;
    color: #7d8797;
    font-size: 13px;
    line-height: 1.6;
}

.modal-footer[b-w1vr4okl01] {
    padding: 14px 23px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
    background: #fafbfc;
    border-top: 1px solid #e9edf2;
}

.danger-button[b-w1vr4okl01] {
    min-height: 40px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid #ad3c47;
    border-radius: 9px;
    background: #ad3c47;
    color: #fff;
    font-size: 14px;
    font-weight: 750;
}

.danger-button:hover:not(:disabled)[b-w1vr4okl01] {
    background: #96333d;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1150px) {

    .summary-grid[b-w1vr4okl01] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mcp-grid[b-w1vr4okl01] {
        grid-template-columns: minmax(0, 1fr) 270px;
    }

    .authorization-flow[b-w1vr4okl01] {
        grid-template-columns: 1fr;
    }

    .flow-arrow[b-w1vr4okl01] {
        display: none;
    }

    .flow-item[b-w1vr4okl01] {
        padding: 7px 0;
    }
}


@media (max-width: 900px) {

    .mcp-page[b-w1vr4okl01] {
        padding: 26px 18px 60px;
    }

    .hero-status-card[b-w1vr4okl01] {
        align-items: flex-start;
        flex-direction: column;
    }

    .hero-status-meta[b-w1vr4okl01] {
        width: 100%;
        justify-content: space-between;
    }

    .mcp-grid[b-w1vr4okl01] {
        grid-template-columns: 1fr;
    }

    .side-column[b-w1vr4okl01] {
        position: static;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .security-card[b-w1vr4okl01] {
        grid-column: 1 / -1;
    }
}


@media (max-width: 650px) {

    .mcp-page[b-w1vr4okl01] {
        padding: 22px 14px 50px;
    }

    .page-header[b-w1vr4okl01] {
        flex-direction: column;
    }

    .page-header .primary-button[b-w1vr4okl01],
    .page-header .secondary-button[b-w1vr4okl01] {
        width: 100%;
    }

    .summary-grid[b-w1vr4okl01] {
        grid-template-columns: 1fr;
    }

    .hero-status-meta[b-w1vr4okl01] {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }

    .client-grid[b-w1vr4okl01],
    .security-points[b-w1vr4okl01],
    .side-column[b-w1vr4okl01] {
        grid-template-columns: 1fr;
    }

    .endpoint-box[b-w1vr4okl01] {
        align-items: stretch;
        flex-direction: column;
    }

    .copy-button[b-w1vr4okl01] {
        width: 100%;
    }

    .modal-backdrop[b-w1vr4okl01] {
        padding: 12px;
    }

    .modal-header[b-w1vr4okl01],
    .modal-body[b-w1vr4okl01],
    .modal-footer[b-w1vr4okl01] {
        padding-left: 18px;
        padding-right: 18px;
    }

    .modal-footer[b-w1vr4okl01] {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .modal-footer .secondary-button[b-w1vr4okl01],
    .modal-footer .danger-button[b-w1vr4okl01] {
        width: 100%;
    }
}
/* /Pages/Onboarding/BillingSuccess.razor.rz.scp.css */
.billing-success-page[b-0fnq76mg9d] {
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    box-sizing: border-box;
    background: radial-gradient( circle at top left, rgba(95, 105, 230, 0.10), transparent 34rem ), radial-gradient( circle at bottom right, rgba(69, 179, 129, 0.07), transparent 30rem ), #f7f8fc;
    color: #172033;
}


.billing-success-card[b-0fnq76mg9d] {
    width: 100%;
    max-width: 520px;
    background: #ffffff;
    border: 1px solid #e3e7ee;
    border-radius: 22px;
    padding: 38px 40px 36px;
    box-shadow: 0 24px 70px rgba(17, 24, 39, 0.08);
    text-align: center;
}


/* -----------------------------
   BRAND
----------------------------- */

.brand[b-0fnq76mg9d] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 32px;
    font-size: 20px;
    font-weight: 750;
    color: #1b2336;
}


.brand-mark[b-0fnq76mg9d] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #202941;
    color: #ffffff;
    font-size: 18px;
    font-weight: 800;
}


/* -----------------------------
   STATUS ICON
----------------------------- */

.status-icon[b-0fnq76mg9d] {
    width: 68px;
    height: 68px;
    margin: 0 auto 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}


/* Loading */

.loading-icon[b-0fnq76mg9d] {
    background: #f0f2ff;
}


.spinner-ring[b-0fnq76mg9d] {
    width: 31px;
    height: 31px;
    border-radius: 50%;
    border: 3px solid #d7dbfa;
    border-top-color: #6572dc;
    animation: spin-b-0fnq76mg9d 0.8s linear infinite;
}


@keyframes spin-b-0fnq76mg9d {
    to {
        transform: rotate(360deg);
    }
}


/* Error */

.error-icon[b-0fnq76mg9d] {
    background: #fff0f0;
    color: #c34848;
    font-size: 31px;
    font-weight: 800;
}


/* -----------------------------
   TEXT
----------------------------- */

.billing-success-card h1[b-0fnq76mg9d] {
    margin: 0;
    color: #171f31;
    font-size: 30px;
    line-height: 1.25;
    letter-spacing: -0.025em;
    font-weight: 750;
}


.billing-success-card > p[b-0fnq76mg9d] {
    max-width: 410px;
    margin: 12px auto 0;
    color: #717b8c;
    font-size: 16px;
    line-height: 1.7;
}


/* -----------------------------
   PROGRESS
----------------------------- */

.progress-steps[b-0fnq76mg9d] {
    margin-top: 30px;
    padding: 19px 20px;
    background: #f8f9fc;
    border: 1px solid #e8ebf1;
    border-radius: 14px;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 14px;
}


.progress-step[b-0fnq76mg9d] {
    display: flex;
    align-items: center;
    gap: 11px;
    color: #949baa;
    font-size: 15px;
    font-weight: 600;
}


    .progress-step.active[b-0fnq76mg9d] {
        color: #3f4859;
    }


.step-check[b-0fnq76mg9d],
.step-dot[b-0fnq76mg9d],
.step-pulse[b-0fnq76mg9d] {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    border-radius: 50%;
}


.step-check[b-0fnq76mg9d] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e4f5eb;
    color: #2b8957;
    font-size: 14px;
    font-weight: 900;
}


.step-dot[b-0fnq76mg9d] {
    width: 8px;
    height: 8px;
    margin: 6px;
    background: #d6dae3;
}


.step-pulse[b-0fnq76mg9d] {
    width: 10px;
    height: 10px;
    margin: 5px;
    background: #6673dc;
    position: relative;
}


    .step-pulse[b-0fnq76mg9d]::after {
        content: "";
        position: absolute;
        inset: -4px;
        border-radius: 50%;
        border: 2px solid rgba(102, 115, 220, 0.25);
        animation: pulse-b-0fnq76mg9d 1.5s ease-out infinite;
    }


@keyframes pulse-b-0fnq76mg9d {
    0% {
        transform: scale(0.8);
        opacity: 1;
    }

    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}


/* -----------------------------
   LOADING NOTE
----------------------------- */

.loading-note[b-0fnq76mg9d] {
    margin-top: 22px;
    color: #9aa2b0;
    font-size: 14px;
}


/* -----------------------------
   ERROR STATE
----------------------------- */

.error-message[b-0fnq76mg9d] {
    margin-top: 24px;
    padding: 14px 16px;
    border: 1px solid #efcccc;
    border-radius: 11px;
    background: #fff6f6;
    color: #a43c3c;
    text-align: left;
    font-size: 15px;
    line-height: 1.55;
    overflow-wrap: anywhere;
}


.retry-button[b-0fnq76mg9d] {
    margin-top: 24px;
    min-height: 45px;
    padding: 0 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: #202941;
    color: #ffffff;
    text-decoration: none;
    font-size: 15px;
    font-weight: 700;
    transition: background 0.16s ease, transform 0.16s ease;
}


    .retry-button:hover[b-0fnq76mg9d] {
        background: #151d31;
        color: #ffffff;
        transform: translateY(-1px);
        text-decoration: none;
    }


/* -----------------------------
   MOBILE
----------------------------- */

@media (max-width: 600px) {

    .billing-success-page[b-0fnq76mg9d] {
        padding: 24px 16px;
    }


    .billing-success-card[b-0fnq76mg9d] {
        padding: 30px 22px;
        border-radius: 17px;
    }


        .billing-success-card h1[b-0fnq76mg9d] {
            font-size: 26px;
        }


    .progress-steps[b-0fnq76mg9d] {
        padding: 17px;
    }
}
/* /Pages/Onboarding/DatabaseSetupOnboarding.razor.rz.scp.css */
.setup-page[b-wlabva98hk] {
    min-height: 100vh;
    background: radial-gradient(circle at top left, rgba(84, 104, 255, 0.08), transparent 30rem), #f7f8fc;
    color: #182033;
}

.setup-header[b-wlabva98hk] {
    height: 72px;
    background: rgba(255, 255, 255, 0.92);
    border-bottom: 1px solid #e6e9f0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 40px;
    backdrop-filter: blur(12px);
}

.brand[b-wlabva98hk] {
    display: flex;
    align-items: center;
    gap: 11px;
    color: #182033;
    text-decoration: none;
    font-size: 21px;
    font-weight: 750;
}

.brand-icon[b-wlabva98hk] {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #202941;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
}

.setup-step[b-wlabva98hk] {
    background: #f2f4f8;
    border: 1px solid #e3e6ec;
    border-radius: 999px;
    padding: 7px 13px;
    font-size: 14px;
    font-weight: 700;
    color: #667085;
}

.setup-content[b-wlabva98hk] {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
    padding: 58px 0 90px;
}

.intro[b-wlabva98hk] {
    max-width: 710px;
    margin-bottom: 34px;
}

.eyebrow[b-wlabva98hk] {
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.11em;
    color: #6674d8;
    margin-bottom: 10px;
}

.intro h1[b-wlabva98hk] {
    margin: 0;
    font-size: 40px;
    line-height: 1.15;
    letter-spacing: -0.035em;
    color: #151c2d;
}

.intro p[b-wlabva98hk] {
    margin: 14px 0 0;
    color: #667085;
    line-height: 1.7;
    font-size: 18px;
}

.layout[b-wlabva98hk] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 310px;
    gap: 26px;
    align-items: start;
}

.main-column[b-wlabva98hk] {
    min-width: 0;
}

.side-column[b-wlabva98hk] {
    display: flex;
    flex-direction: column;
    gap: 18px;
    position: sticky;
    top: 24px;
}

.setup-card[b-wlabva98hk] {
    background: white;
    border: 1px solid #e4e7ec;
    border-radius: 18px;
    padding: 28px;
    margin-bottom: 20px;
    box-shadow: 0 8px 32px rgba(16, 24, 40, 0.035);
}

.section-heading[b-wlabva98hk] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 24px;
}

.section-number[b-wlabva98hk] {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    border-radius: 9px;
    background: #eef0ff;
    color: #5967d8;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
}

.section-heading h2[b-wlabva98hk] {
    margin: 1px 0 4px;
    font-size: 21px;
    color: #182033;
}

.section-heading p[b-wlabva98hk] {
    margin: 0;
    color: #7a8495;
    font-size: 16px;
}

.provider-grid[b-wlabva98hk] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.provider-card[b-wlabva98hk] {
    appearance: none;
    width: 100%;
    border: 1px solid #dde2ea;
    border-radius: 13px;
    background: white;
    padding: 16px;
    cursor: pointer;
    display: grid;
    grid-template-columns: 43px 1fr 20px;
    align-items: center;
    gap: 13px;
    text-align: left;
    transition: 0.18s ease;
    color: inherit;
}

    .provider-card:hover[b-wlabva98hk] {
        border-color: #aeb6d9;
        transform: translateY(-1px);
    }

    .provider-card.selected[b-wlabva98hk] {
        border-color: #6774db;
        background: #fafaff;
        box-shadow: 0 0 0 3px rgba(103, 116, 219, 0.09);
    }

.provider-icon[b-wlabva98hk] {
    width: 43px;
    height: 43px;
    border-radius: 10px;
    background: #f1f3f7;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 850;
    color: #495268;
}

.provider-card.selected .provider-icon[b-wlabva98hk] {
    background: #eaedff;
    color: #5765d4;
}

.provider-card strong[b-wlabva98hk] {
    display: block;
    font-size: 16px;
    margin-bottom: 3px;
}

.provider-card span[b-wlabva98hk] {
    display: block;
    color: #8a93a2;
    font-size: 14px;
}

.provider-radio[b-wlabva98hk] {
    width: 18px;
    height: 18px;
    border: 2px solid #cdd3df;
    border-radius: 50%;
    padding: 3px;
}

.provider-card.selected .provider-radio[b-wlabva98hk] {
    border-color: #6572da;
}

.radio-dot[b-wlabva98hk] {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.provider-card.selected .radio-dot[b-wlabva98hk] {
    background: #6572da;
}

.form-grid[b-wlabva98hk] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 19px;
}

.field[b-wlabva98hk] {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

    .field.full[b-wlabva98hk] {
        grid-column: 1 / -1;
    }

    .field label[b-wlabva98hk] {
        font-size: 15px;
        font-weight: 700;
        color: #3e4758;
    }

.form-control[b-wlabva98hk] {
    width: 100%;
    box-sizing: border-box;
    min-height: 45px;
    border: 1px solid #d8dde7;
    border-radius: 9px;
    padding: 10px 12px;
    font: inherit;
    font-size: 16px;
    color: #182033;
    background: #fff;
    outline: none;
    transition: 0.16s ease;
}

    .form-control:focus[b-wlabva98hk] {
        border-color: #6976d9;
        box-shadow: 0 0 0 3px rgba(105, 118, 217, 0.1);
    }

.field-help[b-wlabva98hk] {
    color: #949cab;
    font-size: 14px;
}

.validation-message[b-wlabva98hk] {
    color: #c64040;
    font-size: 14px;
}

.security-option[b-wlabva98hk] {
    border-top: 1px solid #edf0f4;
    margin-top: 24px;
    padding-top: 22px;
    display: flex;
    align-items: flex-start;
    gap: 11px;
}

.security-checkbox[b-wlabva98hk] {
    margin-top: 3px;
}

.security-option strong[b-wlabva98hk] {
    display: block;
    font-size: 15px;
    margin-bottom: 3px;
}

.security-option span[b-wlabva98hk] {
    color: #7b8493;
    font-size: 14px;
}

.connection-status[b-wlabva98hk] {
    border-radius: 12px;
    padding: 15px 17px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 20px;
}

    .connection-status.success[b-wlabva98hk] {
        background: #f0faf4;
        border: 1px solid #c7ead2;
    }

    .connection-status.error[b-wlabva98hk] {
        background: #fff5f5;
        border: 1px solid #f0cccc;
    }

.status-icon[b-wlabva98hk] {
    width: 27px;
    height: 27px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 850;
}

.success .status-icon[b-wlabva98hk] {
    background: #d8f3e1;
    color: #257946;
}

.error .status-icon[b-wlabva98hk] {
    background: #f8dada;
    color: #b33838;
}

.connection-status strong[b-wlabva98hk] {
    display: block;
    font-size: 15px;
    margin-bottom: 3px;
}

.connection-status span[b-wlabva98hk] {
    display: block;
    font-size: 14px;
    color: #667085;
}

.actions[b-wlabva98hk] {
    display: flex;
    justify-content: flex-end;
    gap: 11px;
}

.btn-primary[b-wlabva98hk],
.btn-secondary[b-wlabva98hk] {
    min-height: 45px;
    border-radius: 9px;
    padding: 0 18px;
    font: inherit;
    font-size: 15px;
    font-weight: 750;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    transition: 0.16s ease;
}

.btn-primary[b-wlabva98hk] {
    border: 1px solid #202941;
    background: #202941;
    color: white;
}

    .btn-primary:hover:not(:disabled)[b-wlabva98hk] {
        background: #151d31;
    }

.btn-secondary[b-wlabva98hk] {
    border: 1px solid #d5dae4;
    background: white;
    color: #354052;
}

    .btn-secondary:hover:not(:disabled)[b-wlabva98hk] {
        background: #f7f8fa;
    }

    .btn-primary:disabled[b-wlabva98hk],
    .btn-secondary:disabled[b-wlabva98hk] {
        cursor: not-allowed;
        opacity: 0.6;
    }

.security-card[b-wlabva98hk],
.recommendation-card[b-wlabva98hk] {
    background: white;
    border: 1px solid #e4e7ec;
    border-radius: 16px;
    padding: 21px;
}

.security-icon[b-wlabva98hk] {
    width: 42px;
    height: 42px;
    border-radius: 11px;
    background: #eef8f2;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
}

.security-card h3[b-wlabva98hk] {
    margin: 0 0 8px;
    font-size: 18px;
}

.security-card p[b-wlabva98hk],
.recommendation-card p[b-wlabva98hk] {
    margin: 0;
    color: #778192;
    font-size: 15px;
    line-height: 1.65;
}

.security-items[b-wlabva98hk] {
    margin-top: 18px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    border-top: 1px solid #edf0f4;
    padding-top: 17px;
}

    .security-items div[b-wlabva98hk] {
        font-size: 14px;
        color: #4c5668;
        display: flex;
        gap: 8px;
    }

    .security-items span[b-wlabva98hk] {
        color: #32835a;
        font-weight: 900;
    }

.recommendation-card strong[b-wlabva98hk] {
    display: block;
    color: #5966d2;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 8px;
}

.spinner[b-wlabva98hk] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid currentColor;
    border-right-color: transparent;
    animation: spin-b-wlabva98hk 0.7s linear infinite;
}

@keyframes spin-b-wlabva98hk {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 900px) {
    .layout[b-wlabva98hk] {
        grid-template-columns: 1fr;
    }

    .side-column[b-wlabva98hk] {
        position: static;
    }
}

@media (max-width: 650px) {
    .setup-header[b-wlabva98hk] {
        padding: 0 20px;
    }

    .setup-content[b-wlabva98hk] {
        width: min(100% - 28px, 1180px);
        padding-top: 38px;
    }

    .intro h1[b-wlabva98hk] {
        font-size: 33px;
    }

    .setup-card[b-wlabva98hk] {
        padding: 21px;
    }

    .provider-grid[b-wlabva98hk],
    .form-grid[b-wlabva98hk] {
        grid-template-columns: 1fr;
    }

    .field.full[b-wlabva98hk] {
        grid-column: auto;
    }

    .actions[b-wlabva98hk] {
        flex-direction: column;
    }

    .btn-primary[b-wlabva98hk],
    .btn-secondary[b-wlabva98hk] {
        width: 100%;
    }
}

/* =========================================================
   DATABASE SETUP ACCESS CONTROL
========================================================= */

.setup-state-card[b-wlabva98hk],
.access-denied-card[b-wlabva98hk] {
    min-height: 420px;
    padding: 48px 28px;
    box-sizing: border-box;
    background: #fff;
    border: 1px solid #e4e7ec;
    border-radius: 18px;
    box-shadow: 0 8px 32px rgba(16, 24, 40, 0.035);
}

.setup-state-card[b-wlabva98hk] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
}

.setup-state-card > div:last-child[b-wlabva98hk] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.setup-state-card strong[b-wlabva98hk] {
    color: #263044;
    font-size: 16px;
}

.setup-state-card span[b-wlabva98hk] {
    color: #8c95a5;
    font-size: 14px;
}

.state-spinner[b-wlabva98hk] {
    width: 30px;
    height: 30px;
    flex: 0 0 auto;
    box-sizing: border-box;
    border: 3px solid #e5e8f0;
    border-top-color: #6472d8;
    border-radius: 50%;
    animation: spin-b-wlabva98hk .7s linear infinite;
}

.access-denied-card[b-wlabva98hk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.access-denied-icon[b-wlabva98hk] {
    width: 52px;
    height: 52px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #fff2f2;
    color: #af4048;
    font-size: 21px;
    font-weight: 850;
}

.access-denied-card h1[b-wlabva98hk] {
    margin: 0;
    color: #283144;
    font-size: 23px;
    letter-spacing: -0.02em;
}

.access-denied-card p[b-wlabva98hk] {
    max-width: 560px;
    margin: 10px 0 20px;
    color: #8993a2;
    font-size: 15px;
    line-height: 1.65;
}

.access-denied-card .btn-primary[b-wlabva98hk] {
    text-decoration: none;
}


@media (max-width: 650px) {

    .setup-state-card[b-wlabva98hk],
    .access-denied-card[b-wlabva98hk] {
        min-height: 360px;
        padding: 34px 20px;
    }

    .access-denied-card .btn-primary[b-wlabva98hk] {
        width: 100%;
    }
}



/* Database setup support (also available during access checks) */
.setup-header-actions[b-wlabva98hk] {
    display: flex;
    align-items: center;
    gap: 19px;
}

.setup-header-support[b-wlabva98hk] {
    color: #3d4fc3;
    text-decoration: none;
    font-size: 13px;
    font-weight: 750;
    white-space: nowrap;
}

.setup-header-support:hover[b-wlabva98hk] {
    text-decoration: underline;
}

.support-card[b-wlabva98hk] {
    padding: 21px;
    border: 1px solid #cbd8ee;
    border-radius: 16px;
    background: #f6f8ff;
}

.support-card-heading[b-wlabva98hk] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.support-card-icon[b-wlabva98hk] {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #e5ecff;
    color: #3d4fc3;
    font-size: 16px;
    font-weight: 800;
}

.support-card h3[b-wlabva98hk] {
    margin: 0;
    color: #202c46;
    font-size: 16px;
}

.support-card > p[b-wlabva98hk] {
    margin: 12px 0 0;
    color: #56647b;
    font-size: 13px;
    line-height: 1.65;
}

.support-card-email[b-wlabva98hk] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 15px;
    color: #344ab8;
    font-size: 13px;
    font-weight: 750;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.support-card-email:hover[b-wlabva98hk] {
    text-decoration: underline;
}

.support-card > p.support-safety-note[b-wlabva98hk] {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid #dce4f4;
    color: #768198;
    font-size: 11px;
}

@media (max-width: 650px) {
    .setup-header-actions[b-wlabva98hk] {
        gap: 10px;
    }

    .setup-header-support[b-wlabva98hk] {
        font-size: 12px;
    }

    .setup-step[b-wlabva98hk] {
        padding: 7px 9px;
        font-size: 12px;
    }
}


/* =========================================================
   FIREWALL / NETWORK ACCESS NOTICE
   ========================================================= */

.firewall-notice[b-wlabva98hk] {
    margin-top: 24px;
    padding: 20px;
    border: 1px solid #cbd8ee;
    border-left: 4px solid #526bd4;
    border-radius: 11px;
    background: #f7f9ff;
}

.firewall-notice-heading[b-wlabva98hk] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.firewall-notice-icon[b-wlabva98hk] {
    width: 31px;
    height: 31px;
    flex: 0 0 31px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #e8eeff;
    color: #3e55b8;
    font-size: 18px;
}

.firewall-notice-heading strong[b-wlabva98hk] {
    color: #223151;
    font-size: 15px;
}

.firewall-notice > p[b-wlabva98hk] {
    margin: 12px 0 0;
    color: #53627a;
    font-size: 13px;
    line-height: 1.65;
}

.firewall-ip-row[b-wlabva98hk] {
    margin-top: 15px;
    padding: 13px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px 16px;
    border: 1px solid #dce4f4;
    border-radius: 9px;
    background: #fff;
}

.firewall-ip-row > span[b-wlabva98hk] {
    color: #5b6880;
    font-size: 12px;
    font-weight: 650;
}

.firewall-ip-row code[b-wlabva98hk] {
    color: #243b86;
    font-family: Consolas, "Liberation Mono", monospace;
    font-size: 15px;
    font-weight: 700;
    user-select: all;
}

.firewall-notice > p.firewall-notice-footnote[b-wlabva98hk] {
    color: #68768b;
    font-size: 12px;
}

@media (max-width: 650px) {
    .firewall-notice[b-wlabva98hk] {
        padding: 17px;
    }
}
/* /Pages/Onboarding/Onboarding.razor.rz.scp.css */
.onboarding-page[b-j9ba3a3hm2] {
    min-height: 100vh;
    background: radial-gradient(circle at top left, rgba(79, 70, 229, 0.08), transparent 30%), radial-gradient(circle at top right, rgba(59, 130, 246, 0.06), transparent 26%), #f7f8fb;
    padding: 42px 24px 70px;
    color: #111827;
}

.onboarding-shell[b-j9ba3a3hm2] {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
}

.brand[b-j9ba3a3hm2] {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 50px;
    font-size: 21px;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.brand-mark[b-j9ba3a3hm2] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #111827;
    color: white;
    font-size: 20px;
}

.onboarding-header[b-j9ba3a3hm2] {
    max-width: 720px;
    margin-bottom: 38px;
}

.step-pill[b-j9ba3a3hm2] {
    display: inline-flex;
    align-items: center;
    padding: 7px 12px;
    margin-bottom: 16px;
    border-radius: 999px;
    background: #eef2ff;
    color: #4f46e5;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.onboarding-header h1[b-j9ba3a3hm2] {
    margin: 0;
    font-size: clamp(34px, 5vw, 48px);
    line-height: 1.08;
    letter-spacing: -0.04em;
    font-weight: 750;
}

.onboarding-header p[b-j9ba3a3hm2] {
    max-width: 650px;
    margin: 15px 0 0;
    color: #6b7280;
    font-size: 19px;
    line-height: 1.65;
}

.setup-grid[b-j9ba3a3hm2] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 24px;
    align-items: start;
}

.main-column[b-j9ba3a3hm2] {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.setup-card[b-j9ba3a3hm2],
.summary-card[b-j9ba3a3hm2] {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 18px;
    box-shadow: 0 12px 35px rgba(17, 24, 39, 0.045);
}

.setup-card[b-j9ba3a3hm2] {
    padding: 30px;
}

.section-heading[b-j9ba3a3hm2] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 26px;
}

.section-number[b-j9ba3a3hm2] {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #111827;
    color: white;
    font-size: 16px;
    font-weight: 700;
}

.section-heading h2[b-j9ba3a3hm2] {
    margin: 1px 0 4px;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.section-heading p[b-j9ba3a3hm2] {
    margin: 0;
    color: #6b7280;
    font-size: 16px;
    line-height: 1.55;
}

.field-group[b-j9ba3a3hm2] {
    max-width: 600px;
}

    .field-group label[b-j9ba3a3hm2] {
        display: block;
        margin-bottom: 8px;
        font-size: 16px;
        font-weight: 650;
    }

.form-control[b-j9ba3a3hm2] {
    width: 100%;
    min-height: 50px;
    padding: 0 14px;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    background: white;
    color: #111827;
    font-size: 17px;
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

    .form-control:focus[b-j9ba3a3hm2] {
        border-color: #6366f1;
        box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.1);
    }

.field-help[b-j9ba3a3hm2] {
    display: block;
    margin-top: 7px;
    color: #9ca3af;
    font-size: 14px;
}

.validation-message[b-j9ba3a3hm2] {
    display: block;
    margin-top: 7px;
    color: #dc2626;
    font-size: 15px;
}

.plan-grid[b-j9ba3a3hm2] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

    .plan-grid.two-plans[b-j9ba3a3hm2] {
        max-width: 850px;
    }

    .plan-grid.single-plan[b-j9ba3a3hm2] {
        grid-template-columns: minmax(0, 1fr);
        max-width: 720px;
    }

.plan-card[b-j9ba3a3hm2] {
    position: relative;
    min-width: 0;
    text-align: left;
    padding: 22px;
    border: 1px solid #e5e7eb;
    border-radius: 15px;
    background: white;
    color: inherit;
    cursor: pointer;
    font: inherit;
    transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

    .plan-card:hover[b-j9ba3a3hm2] {
        transform: translateY(-2px);
        border-color: #c7d2fe;
        box-shadow: 0 10px 25px rgba(17, 24, 39, 0.06);
    }

    .plan-card.selected[b-j9ba3a3hm2] {
        border: 2px solid #6366f1;
        padding: 21px;
        background: #fafaff;
        box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.07);
    }

.plan-top[b-j9ba3a3hm2] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

    .plan-top h3[b-j9ba3a3hm2] {
        margin: 0 0 7px;
        font-size: 20px;
        font-weight: 700;
    }

    .plan-top p[b-j9ba3a3hm2] {
        min-height: 63px;
        margin: 0;
        color: #6b7280;
        font-size: 15px;
        line-height: 1.55;
    }

.plan-radio[b-j9ba3a3hm2] {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #d1d5db;
    border-radius: 50%;
}

.plan-card.selected .plan-radio[b-j9ba3a3hm2] {
    border-color: #6366f1;
}

.plan-card.selected .radio-dot[b-j9ba3a3hm2] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #6366f1;
}

.recommended-badge[b-j9ba3a3hm2] {
    position: absolute;
    top: -11px;
    left: 18px;
    padding: 5px 9px;
    border-radius: 999px;
    background: #111827;
    color: white;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.price[b-j9ba3a3hm2] {
    display: flex;
    align-items: baseline;
    margin-top: 22px;
}

.price-dollar[b-j9ba3a3hm2] {
    font-size: 20px;
    font-weight: 650;
}

.price-value[b-j9ba3a3hm2] {
    font-size: 37px;
    line-height: 1;
    font-weight: 750;
    letter-spacing: -0.04em;
}

.price-period[b-j9ba3a3hm2] {
    margin-left: 5px;
    color: #6b7280;
    font-size: 15px;
}

.trial-offer[b-j9ba3a3hm2] {
    margin-top: 18px;
    padding: 14px 15px;
    display: flex;
    align-items: flex-start;
    gap: 11px;
    border: 1px solid #c7ead2;
    border-radius: 11px;
    background: #f0faf4;
}

.trial-offer-check[b-j9ba3a3hm2] {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #d8f3e1;
    color: #257946;
    font-size: 14px;
    font-weight: 900;
}

.trial-offer > div[b-j9ba3a3hm2] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.trial-offer strong[b-j9ba3a3hm2] {
    color: #1f5136;
    font-size: 14px;
}

.trial-offer span:last-child[b-j9ba3a3hm2] {
    color: #4c6b58;
    font-size: 13px;
    line-height: 1.45;
}

.enterprise-price[b-j9ba3a3hm2] {
    height: 35px;
    align-items: center;
    font-size: 27px;
    font-weight: 750;
    letter-spacing: -0.03em;
}

.divider[b-j9ba3a3hm2],
.summary-divider[b-j9ba3a3hm2] {
    height: 1px;
    background: #edf0f3;
}

.divider[b-j9ba3a3hm2] {
    margin: 20px 0;
}

.feature-list[b-j9ba3a3hm2] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 0;
    margin: 0;
    list-style: none;
}

    .feature-list li[b-j9ba3a3hm2] {
        display: flex;
        gap: 8px;
        color: #4b5563;
        font-size: 14px;
        line-height: 1.45;
    }

.check[b-j9ba3a3hm2] {
    color: #4f46e5;
    font-weight: 800;
}

.summary-card[b-j9ba3a3hm2] {
    position: sticky;
    top: 24px;
    padding: 25px;
}

.summary-header[b-j9ba3a3hm2] {
    margin-bottom: 25px;
}

    .summary-header h3[b-j9ba3a3hm2] {
        margin: 0;
        font-size: 20px;
        font-weight: 700;
    }

    .summary-header p[b-j9ba3a3hm2] {
        margin: 5px 0 0;
        color: #9ca3af;
        font-size: 15px;
    }

.summary-row[b-j9ba3a3hm2] {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 17px;
    font-size: 15px;
}

    .summary-row span[b-j9ba3a3hm2] {
        color: #6b7280;
    }

    .summary-row strong[b-j9ba3a3hm2] {
        max-width: 170px;
        text-align: right;
        word-break: break-word;
    }

.summary-divider[b-j9ba3a3hm2] {
    margin: 23px 0;
}

.summary-total[b-j9ba3a3hm2] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 24px;
}

    .summary-total > span[b-j9ba3a3hm2] {
        font-size: 16px;
        font-weight: 650;
    }

    .summary-total > div[b-j9ba3a3hm2] {
        text-align: right;
    }

    .summary-total strong[b-j9ba3a3hm2] {
        display: block;
        font-size: 27px;
        line-height: 1;
        letter-spacing: -0.03em;
    }

    .summary-total small[b-j9ba3a3hm2] {
        display: block;
        margin-top: 4px;
        color: #9ca3af;
    }

.after-trial-row[b-j9ba3a3hm2] {
    margin: -8px 0 22px;
    padding: 12px 13px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border-radius: 9px;
    background: #f7f8fb;
    color: #6b7280;
    font-size: 13px;
}

.after-trial-row strong[b-j9ba3a3hm2] {
    color: #374151;
    text-align: right;
}

.enterprise-summary[b-j9ba3a3hm2] {
    margin-bottom: 22px;
    color: #6b7280;
    font-size: 15px;
    line-height: 1.55;
}

.continue-button[b-j9ba3a3hm2] {
    width: 100%;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: none;
    border-radius: 10px;
    background: #111827;
    color: white;
    font-size: 16px;
    font-weight: 650;
    cursor: pointer;
    transition: background 0.15s ease, transform 0.15s ease;
}

    .continue-button:hover:not(:disabled)[b-j9ba3a3hm2] {
        background: #272f3d;
        transform: translateY(-1px);
    }

    .continue-button:disabled[b-j9ba3a3hm2] {
        opacity: 0.65;
        cursor: not-allowed;
    }

.arrow[b-j9ba3a3hm2] {
    font-size: 19px;
}

.secure-checkout[b-j9ba3a3hm2] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    margin-top: 13px;
    color: #9ca3af;
    font-size: 14px;
}

.lock[b-j9ba3a3hm2] {
    color: #22c55e;
    font-size: 11px;
}

.spinner[b-j9ba3a3hm2] {
    width: 15px;
    height: 15px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-j9ba3a3hm2 0.8s linear infinite;
}

@keyframes spin-b-j9ba3a3hm2 {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 1050px) {
    .setup-grid[b-j9ba3a3hm2] {
        grid-template-columns: 1fr;
    }

    .summary-card[b-j9ba3a3hm2] {
        position: static;
    }
}

@media (max-width: 850px) {
    .plan-grid[b-j9ba3a3hm2] {
        grid-template-columns: 1fr;
    }

    .plan-top p[b-j9ba3a3hm2] {
        min-height: auto;
    }
}

@media (max-width: 600px) {
    .onboarding-page[b-j9ba3a3hm2] {
        padding: 24px 14px 50px;
    }

    .brand[b-j9ba3a3hm2] {
        margin-bottom: 35px;
    }

    .setup-card[b-j9ba3a3hm2],
    .summary-card[b-j9ba3a3hm2] {
        padding: 21px;
        border-radius: 14px;
    }

    .section-heading[b-j9ba3a3hm2] {
        gap: 12px;
    }
}


/* Starter and Business plan selection */
.plan-grid.two-plans[b-j9ba3a3hm2] {
    max-width: none;
    align-items: stretch;
}

.plan-card[b-j9ba3a3hm2] {
    display: block;
    width: 100%;
}

.plan-card:focus-visible[b-j9ba3a3hm2] {
    outline: 3px solid rgba(79, 70, 229, 0.35);
    outline-offset: 3px;
}

.plan-limit[b-j9ba3a3hm2] {
    margin-top: 10px;
    color: #4338ca;
    font-size: 13px;
    font-weight: 700;
}

.checkout-error[b-j9ba3a3hm2] {
    margin-top: 14px;
    padding: 12px 14px;
    border: 1px solid #fecaca;
    border-radius: 9px;
    background: #fef2f2;
    color: #991b1b;
    font-size: 13px;
    line-height: 1.55;
}


/* Support contact below onboarding checkout */
.onboarding-support[b-j9ba3a3hm2] {
    margin-top: 24px;
    padding: 22px 26px;
    display: flex;
    align-items: center;
    gap: 18px;
    border: 1px solid #dce3ed;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 7px 22px rgba(17, 24, 39, 0.025);
}

.onboarding-support-icon[b-j9ba3a3hm2] {
    display: grid;
    place-items: center;
    flex: 0 0 39px;
    width: 39px;
    height: 39px;
    border-radius: 9px;
    background: #eef2ff;
    color: #4f46e5;
    font-size: 20px;
    font-weight: 750;
}

.onboarding-support-copy[b-j9ba3a3hm2] {
    min-width: 0;
    flex: 1;
}

.onboarding-support-copy h2[b-j9ba3a3hm2] {
    margin: 0;
    color: #182033;
    font-size: 16px;
    font-weight: 750;
}

.onboarding-support-copy p[b-j9ba3a3hm2] {
    margin: 4px 0 0;
    color: #667085;
    font-size: 13px;
    line-height: 1.6;
}

.onboarding-support-link[b-j9ba3a3hm2] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #4338ca;
    font-size: 13px;
    font-weight: 750;
    text-decoration: none;
    white-space: nowrap;
}

.onboarding-support-link:hover[b-j9ba3a3hm2] {
    text-decoration: underline;
}

@media (max-width: 800px) {
    .onboarding-support[b-j9ba3a3hm2] {
        flex-wrap: wrap;
    }

    .onboarding-support-link[b-j9ba3a3hm2] {
        padding-left: 57px;
        white-space: normal;
        overflow-wrap: anywhere;
    }
}

@media (max-width: 600px) {
    .onboarding-support[b-j9ba3a3hm2] {
        padding: 20px;
        align-items: flex-start;
        gap: 12px;
    }

    .onboarding-support-link[b-j9ba3a3hm2] {
        flex-basis: 100%;
        padding-left: 0;
    }
}
/* /Pages/Scopes.razor.rz.scp.css */
/* =========================================================
   PAGE
========================================================= */

.scopes-page[b-rf2k01reir] {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    padding: 34px 34px 72px;
    box-sizing: border-box;
    color: #182033;
}


/* =========================================================
   LOADING / ERRORS / MESSAGES
========================================================= */

.page-loading[b-rf2k01reir] {
    min-height: 420px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #667085;
}

    .page-loading > div:last-child[b-rf2k01reir] {
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .page-loading strong[b-rf2k01reir] {
        color: #263044;
        font-size: 16px;
    }

    .page-loading span[b-rf2k01reir] {
        color: #8c95a5;
        font-size: 14px;
    }

.loading-spinner[b-rf2k01reir],
.button-spinner[b-rf2k01reir] {
    border-radius: 50%;
    border-style: solid;
    border-right-color: transparent;
    animation: spin-b-rf2k01reir .7s linear infinite;
}

.loading-spinner[b-rf2k01reir] {
    width: 30px;
    height: 30px;
    border-width: 3px;
    border-color: #e5e8f0;
    border-top-color: #6472d8;
}

.button-spinner[b-rf2k01reir] {
    width: 13px;
    height: 13px;
    border-width: 2px;
    border-color: currentColor;
    border-right-color: transparent;
}

@keyframes spin-b-rf2k01reir {
    to {
        transform: rotate(360deg);
    }
}

.page-error[b-rf2k01reir],
.page-message[b-rf2k01reir] {
    margin-bottom: 20px;
    padding: 14px 16px;
    display: flex;
    align-items: flex-start;
    gap: 11px;
    border-radius: 12px;
}

.page-error[b-rf2k01reir] {
    background: #fff5f5;
    border: 1px solid #efcccc;
    color: #943c3c;
}

.page-message[b-rf2k01reir] {
    background: #f0faf4;
    border: 1px solid #c8ead3;
    color: #347251;
}

.page-error-icon[b-rf2k01reir],
.page-message-icon[b-rf2k01reir] {
    width: 27px;
    height: 27px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 14px;
    font-weight: 850;
}

.page-error-icon[b-rf2k01reir] {
    background: #f8dada;
    color: #b33838;
}

.page-message-icon[b-rf2k01reir] {
    background: #d8f3e1;
    color: #257946;
}

.page-error > div:last-child[b-rf2k01reir] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.page-error strong[b-rf2k01reir] {
    font-size: 15px;
}

.page-error span[b-rf2k01reir],
.page-message span[b-rf2k01reir] {
    font-size: 14px;
    line-height: 1.5;
}


/* =========================================================
   HEADER
========================================================= */

.page-header[b-rf2k01reir] {
    margin-bottom: 25px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 28px;
}

.eyebrow[b-rf2k01reir] {
    margin-bottom: 7px;
    color: #6472d8;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .13em;
}

.page-header h1[b-rf2k01reir] {
    margin: 0;
    color: #172033;
    font-size: 34px;
    line-height: 1.15;
    font-weight: 760;
    letter-spacing: -.035em;
}

.page-header p[b-rf2k01reir] {
    max-width: 720px;
    margin: 10px 0 0;
    color: #768093;
    font-size: 16px;
    line-height: 1.65;
}


/* =========================================================
   BUTTONS
========================================================= */

.primary-button[b-rf2k01reir],
.secondary-button[b-rf2k01reir],
.icon-button[b-rf2k01reir],
.modal-close[b-rf2k01reir] {
    font: inherit;
    cursor: pointer;
}

.primary-button[b-rf2k01reir] {
    min-height: 43px;
    padding: 0 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #202941;
    border-radius: 9px;
    background: #202941;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    transition: .15s ease;
}

    .primary-button:hover:not(:disabled)[b-rf2k01reir] {
        background: #161e30;
        transform: translateY(-1px);
        box-shadow: 0 5px 14px rgba(25, 33, 52, .12);
    }

.secondary-button[b-rf2k01reir] {
    min-height: 40px;
    padding: 0 14px;
    border: 1px solid #d8dde6;
    border-radius: 9px;
    background: #fff;
    color: #364154;
    font-size: 14px;
    font-weight: 700;
    transition: .15s ease;
}

    .secondary-button:hover:not(:disabled)[b-rf2k01reir] {
        background: #f7f8fa;
        border-color: #c9cfda;
    }

    .primary-button:disabled[b-rf2k01reir],
    .secondary-button:disabled[b-rf2k01reir],
    .modal-close:disabled[b-rf2k01reir] {
        cursor: not-allowed;
        opacity: .6;
    }

.button-plus[b-rf2k01reir] {
    font-size: 20px;
    line-height: 1;
    font-weight: 500;
}

.icon-button[b-rf2k01reir] {
    width: 31px;
    height: 31px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dce1e9;
    border-radius: 8px;
    background: #fff;
    color: #566174;
    font-size: 20px;
    line-height: 1;
}

    .icon-button:hover[b-rf2k01reir] {
        background: #f6f7f9;
    }


/* =========================================================
   SUMMARY
========================================================= */

.summary-grid[b-rf2k01reir] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.summary-card[b-rf2k01reir] {
    min-width: 0;
    padding: 19px;
    display: flex;
    align-items: center;
    gap: 14px;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 14px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, .025);
}

.summary-icon[b-rf2k01reir] {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    font-size: 13px;
    font-weight: 850;
}

.scope-summary-icon[b-rf2k01reir] {
    background: #eef0ff;
    color: #5b68cf;
}

.table-summary-icon[b-rf2k01reir] {
    background: #edf8f2;
    color: #347c59;
}

.column-summary-icon[b-rf2k01reir] {
    background: #fff4e8;
    color: #9c652c;
}

.row-summary-icon[b-rf2k01reir] {
    background: #eaf7f8;
    color: #34737c;
}

.user-summary-icon[b-rf2k01reir] {
    background: #f4effd;
    color: #7550b2;
}

.summary-card > div:last-child[b-rf2k01reir] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.summary-label[b-rf2k01reir] {
    margin-bottom: 3px;
    color: #7a8494;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .055em;
}

.summary-card strong[b-rf2k01reir] {
    color: #1c2435;
    font-size: 25px;
    line-height: 1.05;
    letter-spacing: -.025em;
}

.summary-card small[b-rf2k01reir] {
    margin-top: 5px;
    color: #969eab;
    font-size: 13px;
}


/* =========================================================
   LAYOUT
========================================================= */

.scope-layout[b-rf2k01reir] {
    display: grid;
    grid-template-columns: 275px minmax(0, 1fr);
    gap: 20px;
    align-items: start;
}

.scope-list-card[b-rf2k01reir],
.scope-editor-card[b-rf2k01reir] {
    min-width: 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, .025);
}

.scope-list-card[b-rf2k01reir] {
    position: sticky;
    top: 20px;
}


/* =========================================================
   SCOPE LIST
========================================================= */

.scope-list-header[b-rf2k01reir] {
    min-height: 69px;
    padding: 17px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid #edf0f4;
}

    .scope-list-header h2[b-rf2k01reir] {
        margin: 0;
        color: #20283a;
        font-size: 16px;
        font-weight: 750;
    }

    .scope-list-header p[b-rf2k01reir] {
        margin: 4px 0 0;
        color: #8a93a2;
        font-size: 13px;
    }

.scope-list[b-rf2k01reir] {
    padding: 7px;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.scope-list-item[b-rf2k01reir] {
    width: 100%;
    min-height: 58px;
    padding: 9px;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
    transition: .14s ease;
}

    .scope-list-item:hover[b-rf2k01reir] {
        background: #f7f8fa;
    }

    .scope-list-item.active[b-rf2k01reir] {
        border-color: #dfe3fb;
        background: #f6f7ff;
    }

.scope-mark[b-rf2k01reir] {
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: #f0f2f7;
    color: #596477;
    font-size: 14px;
    font-weight: 850;
}

.scope-list-item.active .scope-mark[b-rf2k01reir] {
    background: #e8ebff;
    color: #5967cf;
}

.scope-copy[b-rf2k01reir] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

    .scope-copy strong[b-rf2k01reir] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: #343d4f;
        font-size: 14px;
    }

    .scope-copy span[b-rf2k01reir] {
        color: #959daa;
        font-size: 12px;
    }

.scope-chevron[b-rf2k01reir] {
    color: #a1a8b4;
    font-size: 19px;
}

.scope-list-empty[b-rf2k01reir] {
    padding: 38px 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.empty-icon[b-rf2k01reir] {
    width: 46px;
    height: 46px;
    margin-bottom: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: #f0f2f7;
    color: #596477;
    font-size: 13px;
    font-weight: 850;
}

.scope-list-empty strong[b-rf2k01reir] {
    color: #344054;
    font-size: 14px;
}

.scope-list-empty span[b-rf2k01reir] {
    margin: 6px 0 15px;
    color: #8b95a5;
    font-size: 13px;
    line-height: 1.55;
}


/* =========================================================
   EDITOR
========================================================= */

.editor-empty[b-rf2k01reir] {
    min-height: 510px;
    padding: 55px 25px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.editor-empty-icon[b-rf2k01reir] {
    width: 56px;
    height: 56px;
    margin-bottom: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    background: #eef0ff;
    color: #5c69d1;
    font-size: 25px;
}

.editor-empty h2[b-rf2k01reir] {
    margin: 0;
    color: #273043;
    font-size: 18px;
}

.editor-empty p[b-rf2k01reir] {
    max-width: 470px;
    margin: 8px 0 18px;
    color: #8892a2;
    font-size: 14px;
    line-height: 1.65;
}

.editor-header[b-rf2k01reir] {
    padding: 19px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 1px solid #edf0f4;
}

.selected-scope-title[b-rf2k01reir] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.selected-scope-mark[b-rf2k01reir] {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    background: #eef0ff;
    color: #5c69d1;
    font-size: 15px;
    font-weight: 850;
}

.scope-title-line[b-rf2k01reir] {
    display: flex;
    align-items: center;
    gap: 8px;
}

    .scope-title-line h2[b-rf2k01reir] {
        margin: 0;
        color: #222b3d;
        font-size: 17px;
        font-weight: 760;
    }

.selected-scope-title p[b-rf2k01reir] {
    margin: 4px 0 0;
    color: #8993a2;
    font-size: 13px;
    line-height: 1.45;
}

.active-badge[b-rf2k01reir] {
    padding: 3px 7px;
    border-radius: 999px;
    background: #e9f7ef;
    color: #2f7651;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.scope-header-stats[b-rf2k01reir] {
    display: flex;
    align-items: center;
    gap: 18px;
}

    .scope-header-stats > div[b-rf2k01reir] {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 2px;
    }

    .scope-header-stats span[b-rf2k01reir] {
        color: #939ba8;
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .05em;
    }

    .scope-header-stats strong[b-rf2k01reir] {
        color: #3a4455;
        font-size: 14px;
    }


/* =========================================================
   TOOLBAR
========================================================= */

.editor-toolbar[b-rf2k01reir] {
    padding: 14px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid #edf0f4;
}

.database-tabs[b-rf2k01reir] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
}

.database-tab[b-rf2k01reir] {
    min-height: 34px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    flex: 0 0 auto;
    border: 1px solid #e0e4eb;
    border-radius: 8px;
    background: #fff;
    color: #677184;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: .14s ease;
}

    .database-tab:hover[b-rf2k01reir] {
        background: #f8f9fb;
    }

    .database-tab.active[b-rf2k01reir] {
        border-color: #cfd5fb;
        background: #f3f5ff;
        color: #5865c9;
    }

.database-provider[b-rf2k01reir] {
    font-size: 11px;
    font-weight: 850;
}

.scope-search[b-rf2k01reir] {
    width: 245px;
    height: 36px;
    flex: 0 0 auto;
    padding: 0 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #dce1e9;
    border-radius: 8px;
    background: #fff;
}

    .scope-search:focus-within[b-rf2k01reir] {
        border-color: #6a77d9;
        box-shadow: 0 0 0 3px rgba(105, 118, 217, .08);
    }

    .scope-search svg[b-rf2k01reir] {
        width: 14px;
        height: 14px;
        flex: 0 0 auto;
        fill: none;
        stroke: #8993a3;
        stroke-width: 1.8;
        stroke-linecap: round;
    }

    .scope-search input[b-rf2k01reir] {
        width: 100%;
        min-width: 0;
        border: 0;
        outline: 0;
        background: transparent;
        color: #263044;
        font: inherit;
        font-size: 13px;
    }

        .scope-search input[b-rf2k01reir]::placeholder {
            color: #a1a8b4;
        }


/* =========================================================
   DATABASE CONTEXT
========================================================= */

.database-context[b-rf2k01reir] {
    min-height: 57px;
    padding: 11px 17px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    background: #fcfcfd;
    border-bottom: 1px solid #edf0f4;
}

.database-context-left[b-rf2k01reir] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.database-context-icon[b-rf2k01reir] {
    width: 31px;
    height: 31px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #f0f2f7;
    color: #596477;
    font-size: 11px;
    font-weight: 850;
}

.database-context-left > div:last-child[b-rf2k01reir] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.database-context-left strong[b-rf2k01reir] {
    color: #394254;
    font-size: 13px;
}

.database-context-left span[b-rf2k01reir],
.database-context-right[b-rf2k01reir] {
    color: #969eab;
    font-size: 11px;
}


/* =========================================================
   OBJECTS
========================================================= */

.object-list[b-rf2k01reir] {
    display: flex;
    flex-direction: column;
}

.object-row[b-rf2k01reir] {
    border-bottom: 1px solid #edf0f4;
}

    .object-row:last-child[b-rf2k01reir] {
        border-bottom: 0;
    }

    .object-row.selected[b-rf2k01reir] {
        background: #fdfdff;
    }

.object-main-row[b-rf2k01reir] {
    min-height: 67px;
    padding: 11px 17px;
    display: grid;
    grid-template-columns: 20px 20px 34px minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
}

.object-check[b-rf2k01reir],
.column-card[b-rf2k01reir] {
    position: relative;
}

.object-check[b-rf2k01reir] {
    width: 17px;
    height: 17px;
    cursor: pointer;
}

    .object-check input[b-rf2k01reir],
    .column-card input[b-rf2k01reir] {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    .object-check > span[b-rf2k01reir],
    .column-check[b-rf2k01reir] {
        width: 16px;
        height: 16px;
        box-sizing: border-box;
        display: block;
        border: 1.5px solid #c7ced9;
        border-radius: 5px;
        background: #fff;
        position: relative;
    }

    .object-check input:checked + span[b-rf2k01reir],
    .column-card input:checked + .column-check[b-rf2k01reir] {
        border-color: #6572d8;
        background: #6572d8;
    }

        .object-check input:checked + span[b-rf2k01reir]::after,
        .column-card input:checked + .column-check[b-rf2k01reir]::after {
            content: "";
            position: absolute;
            left: 4px;
            top: 1px;
            width: 4px;
            height: 8px;
            border: solid #fff;
            border-width: 0 2px 2px 0;
            transform: rotate(45deg);
        }

.expand-button[b-rf2k01reir] {
    width: 20px;
    height: 20px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: transparent;
    color: #8993a3;
    font-size: 20px;
    cursor: pointer;
}

.chevron[b-rf2k01reir] {
    display: inline-block;
    transition: transform .16s ease;
}

    .chevron.expanded[b-rf2k01reir] {
        transform: rotate(90deg);
    }

.object-icon[b-rf2k01reir] {
    width: 31px;
    height: 31px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 850;
}

    .object-icon.table[b-rf2k01reir] {
        background: #edf8f2;
        color: #347c59;
    }

    .object-icon.view[b-rf2k01reir] {
        background: #f4effd;
        color: #7550b2;
    }

.object-copy[b-rf2k01reir] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.object-name-line[b-rf2k01reir] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
}

    .object-name-line strong[b-rf2k01reir] {
        max-width: 380px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: #333c4e;
        font-size: 13px;
    }

.schema-badge[b-rf2k01reir],
.type-badge[b-rf2k01reir],
.pk-badge[b-rf2k01reir],
.sensitivity-badge[b-rf2k01reir] {
    flex: 0 0 auto;
    padding: 2px 5px;
    border-radius: 5px;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.schema-badge[b-rf2k01reir] {
    background: #f0f2f5;
    color: #7d8796;
}

.type-badge[b-rf2k01reir] {
    background: #f6f7f9;
    color: #9098a5;
}

.object-copy > span[b-rf2k01reir] {
    color: #989fac;
    font-size: 11px;
}

.access-summary[b-rf2k01reir] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 5px;
}

.access-badge[b-rf2k01reir] {
    padding: 4px 7px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 750;
    white-space: nowrap;
}

    .access-badge.none[b-rf2k01reir] {
        background: #f2f4f7;
        color: #8e97a5;
    }

    .access-badge.all[b-rf2k01reir] {
        background: #e9f7ef;
        color: #347553;
    }

    .access-badge.restricted[b-rf2k01reir] {
        background: #fff4e8;
        color: #96602c;
    }

    .access-badge.row-filtered[b-rf2k01reir] {
        background: #eaf7f8;
        color: #34737c;
    }

.objects-empty[b-rf2k01reir] {
    padding: 55px 25px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    text-align: center;
}

    .objects-empty strong[b-rf2k01reir] {
        color: #404a5c;
        font-size: 14px;
    }

    .objects-empty span[b-rf2k01reir] {
        color: #969eab;
        font-size: 12px;
    }


/* =========================================================
   COLUMN EDITOR
========================================================= */

.object-details[b-rf2k01reir] {
    padding: 15px 17px 17px 97px;
    background: #fafbfc;
    border-top: 1px solid #edf0f4;
}

.object-note[b-rf2k01reir] {
    color: #7f8999;
    font-size: 12px;
}

.column-mode-row[b-rf2k01reir] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

    .column-mode-row > div:first-child[b-rf2k01reir] {
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .column-mode-row strong[b-rf2k01reir] {
        color: #3c4658;
        font-size: 13px;
    }

    .column-mode-row span[b-rf2k01reir] {
        color: #8d96a5;
        font-size: 12px;
    }

.segmented-control[b-rf2k01reir] {
    flex: 0 0 auto;
    padding: 3px;
    display: flex;
    border: 1px solid #dde2e9;
    border-radius: 8px;
    background: #f3f4f6;
}

.segment[b-rf2k01reir] {
    min-height: 28px;
    padding: 0 9px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #778193;
    font: inherit;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}

    .segment.active[b-rf2k01reir] {
        background: #fff;
        color: #4652b2;
        box-shadow: 0 1px 4px rgba(17, 24, 39, .08);
    }

.all-columns-note[b-rf2k01reir] {
    margin-top: 13px;
    padding: 12px 13px;
    display: flex;
    align-items: flex-start;
    gap: 9px;
    border: 1px solid #cfe7d7;
    border-radius: 9px;
    background: #f3faf6;
}

.all-columns-check[b-rf2k01reir] {
    width: 23px;
    height: 23px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #daf0e2;
    color: #347653;
    font-size: 12px;
    font-weight: 850;
}

.all-columns-note > div:last-child[b-rf2k01reir] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.all-columns-note strong[b-rf2k01reir] {
    color: #3d6f53;
    font-size: 12px;
}

.all-columns-note span[b-rf2k01reir] {
    color: #71877a;
    font-size: 11px;
    line-height: 1.5;
}

.column-toolbar[b-rf2k01reir] {
    margin-top: 15px;
    padding-top: 13px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    border-top: 1px solid #e6e9ee;
}

    .column-toolbar > div:first-child[b-rf2k01reir] {
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .column-toolbar strong[b-rf2k01reir] {
        color: #465062;
        font-size: 12px;
    }

    .column-toolbar span[b-rf2k01reir] {
        color: #959daa;
        font-size: 11px;
    }

    .column-toolbar > div:last-child[b-rf2k01reir] {
        display: flex;
        gap: 10px;
    }

    .column-toolbar button[b-rf2k01reir] {
        padding: 0;
        border: 0;
        background: transparent;
        color: #5d69cf;
        font: inherit;
        font-size: 11px;
        font-weight: 700;
        cursor: pointer;
    }

        .column-toolbar button:hover[b-rf2k01reir] {
            text-decoration: underline;
        }

.column-grid[b-rf2k01reir] {
    margin-top: 11px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
}

.column-card[b-rf2k01reir] {
    min-width: 0;
    min-height: 48px;
    padding: 9px 10px;
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    border: 1px solid #e1e5eb;
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
    transition: .13s ease;
}

    .column-card:hover[b-rf2k01reir] {
        border-color: #cfd5e0;
    }

    .column-card.selected[b-rf2k01reir] {
        border-color: #d3d8fa;
        background: #fafaff;
    }

.column-copy[b-rf2k01reir] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.column-name-line[b-rf2k01reir] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 5px;
}

    .column-name-line strong[b-rf2k01reir] {
        max-width: 220px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: #3d4658;
        font-size: 12px;
    }

.column-copy > span[b-rf2k01reir] {
    color: #969eab;
    font-size: 10px;
}

.pk-badge[b-rf2k01reir] {
    background: #eef0ff;
    color: #5f6bc8;
}

.sensitivity-badge[b-rf2k01reir] {
    background: #fff0f1;
    color: #a94850;
}




/* =========================================================
   ROW ACCESS
========================================================= */

.row-access-section[b-rf2k01reir] {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid #e3e7ed;
}

.all-rows-note[b-rf2k01reir] {
    border-color: #cfe8e9;
    background: #f3fbfb;
}

    .all-rows-note .all-columns-check[b-rf2k01reir] {
        background: #dff1f2;
        color: #34737c;
    }

    .all-rows-note strong[b-rf2k01reir] {
        color: #3c6f75;
    }

    .all-rows-note span[b-rf2k01reir] {
        color: #71878a;
    }

.row-filter-toolbar[b-rf2k01reir] {
    margin-top: 15px;
    padding-top: 13px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border-top: 1px solid #e6e9ee;
}

    .row-filter-toolbar > div:first-child[b-rf2k01reir] {
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .row-filter-toolbar strong[b-rf2k01reir] {
        color: #465062;
        font-size: 12px;
    }

    .row-filter-toolbar span[b-rf2k01reir] {
        color: #959daa;
        font-size: 11px;
    }

.row-add-button[b-rf2k01reir] {
    min-height: 32px;
    padding: 0 11px;
    font-size: 12px;
}

.row-filter-empty[b-rf2k01reir] {
    margin-top: 11px;
    padding: 13px;
    border: 1px dashed #d9dee7;
    border-radius: 9px;
    background: #fff;
    color: #8b94a3;
    font-size: 12px;
}

.row-filter-list[b-rf2k01reir] {
    margin-top: 11px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.row-filter-card[b-rf2k01reir] {
    min-width: 0;
    padding: 10px;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) 28px;
    align-items: end;
    gap: 9px;
    border: 1px solid #dde4e7;
    border-radius: 9px;
    background: #fff;
}

.row-filter-number[b-rf2k01reir] {
    width: 24px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 7px;
    background: #eaf7f8;
    color: #34737c;
    font-size: 11px;
    font-weight: 850;
}

.row-filter-fields[b-rf2k01reir] {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(135px, .9fr) minmax(145px, .9fr) minmax(160px, 1.2fr);
    gap: 8px;
}

.row-filter-field[b-rf2k01reir] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

    .row-filter-field label[b-rf2k01reir] {
        color: #7f8998;
        font-size: 10px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: .045em;
    }

.row-filter-control[b-rf2k01reir],
.row-filter-no-value[b-rf2k01reir] {
    width: 100%;
    min-width: 0;
    height: 34px;
    padding: 0 9px;
    box-sizing: border-box;
    border: 1px solid #d9dee6;
    border-radius: 7px;
    outline: none;
    background: #fff;
    color: #3f495b;
    font: inherit;
    font-size: 12px;
}

.row-filter-control:focus[b-rf2k01reir] {
    border-color: #6976d9;
    box-shadow: 0 0 0 3px rgba(105, 118, 217, .08);
}

.row-filter-no-value[b-rf2k01reir] {
    display: flex;
    align-items: center;
    background: #f7f8fa;
    color: #9aa2ae;
}

.row-filter-remove[b-rf2k01reir] {
    width: 28px;
    height: 30px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #ead5d7;
    border-radius: 7px;
    background: #fff8f8;
    color: #a34b53;
    font: inherit;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
}

.row-filter-remove:hover[b-rf2k01reir] {
    background: #fff0f1;
}

.row-filter-help[b-rf2k01reir] {
    margin-top: 10px;
    color: #8992a1;
    font-size: 11px;
    line-height: 1.55;
}

.row-filter-help strong[b-rf2k01reir] {
    color: #667184;
}


/* =========================================================
   SAVE BAR
========================================================= */

.save-bar[b-rf2k01reir] {
    min-height: 66px;
    padding: 12px 17px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    position: sticky;
    bottom: 0;
    z-index: 5;
    background: rgba(255, 255, 255, .97);
    border-top: 1px solid #e5e9ef;
    box-shadow: 0 -8px 18px rgba(17, 24, 39, .025);
}

    .save-bar > div:first-child[b-rf2k01reir] {
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .save-bar strong[b-rf2k01reir] {
        color: #424c5e;
        font-size: 12px;
    }

    .save-bar span[b-rf2k01reir] {
        color: #969eab;
        font-size: 11px;
    }


/* =========================================================
   MODAL
========================================================= */

.modal-backdrop[b-rf2k01reir] {
    position: fixed;
    inset: 0;
    z-index: 1000;
    padding: 30px 18px;
    overflow-y: auto;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    background: rgba(15, 23, 42, .52);
}

.scope-modal[b-rf2k01reir] {
    width: min(540px, 100%);
    margin: auto;
    overflow: hidden;
    background: #fff;
    border: 1px solid #e3e7ed;
    border-radius: 17px;
    box-shadow: 0 20px 55px rgba(15, 23, 42, .18);
}

.modal-header[b-rf2k01reir] {
    padding: 22px 23px 18px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid #edf0f4;
}

    .modal-header h2[b-rf2k01reir] {
        margin: 0;
        color: #182033;
        font-size: 21px;
        letter-spacing: -.02em;
    }

    .modal-header p[b-rf2k01reir] {
        margin: 6px 0 0;
        color: #7d8797;
        font-size: 13px;
    }

.modal-close[b-rf2k01reir] {
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e1e5eb;
    border-radius: 8px;
    background: #fff;
    color: #667085;
    font-size: 22px;
    line-height: 1;
}

    .modal-close:hover:not(:disabled)[b-rf2k01reir] {
        background: #f6f7f9;
    }

.modal-body[b-rf2k01reir] {
    padding: 22px 23px;
    display: flex;
    flex-direction: column;
    gap: 17px;
}

.field[b-rf2k01reir] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

    .field label[b-rf2k01reir] {
        color: #485265;
        font-size: 13px;
        font-weight: 700;
    }

.form-control[b-rf2k01reir] {
    width: 100%;
    min-height: 42px;
    padding: 9px 11px;
    box-sizing: border-box;
    border: 1px solid #d8dde7;
    border-radius: 8px;
    outline: none;
    background: #fff;
    color: #182033;
    font: inherit;
    font-size: 14px;
    transition: .15s ease;
}

    .form-control:focus[b-rf2k01reir] {
        border-color: #6976d9;
        box-shadow: 0 0 0 3px rgba(105, 118, 217, .09);
    }

.description-input[b-rf2k01reir] {
    min-height: 95px;
    resize: vertical;
}

.validation-message[b-rf2k01reir] {
    color: #c64040;
    font-size: 12px;
}

.field-help[b-rf2k01reir] {
    color: #959daa;
    font-size: 12px;
}

.modal-footer[b-rf2k01reir] {
    padding: 14px 23px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
    background: #fafbfc;
    border-top: 1px solid #e9edf2;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1150px) {
    .summary-grid[b-rf2k01reir] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .scope-layout[b-rf2k01reir] {
        grid-template-columns: 230px minmax(0, 1fr);
    }

    .column-grid[b-rf2k01reir] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .scopes-page[b-rf2k01reir] {
        padding: 26px 18px 60px;
    }

    .scope-layout[b-rf2k01reir] {
        grid-template-columns: 1fr;
    }

    .scope-list-card[b-rf2k01reir] {
        position: static;
    }

    .scope-list[b-rf2k01reir] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .editor-toolbar[b-rf2k01reir] {
        align-items: stretch;
        flex-direction: column;
    }

    .scope-search[b-rf2k01reir] {
        width: 100%;
        box-sizing: border-box;
    }

    .object-details[b-rf2k01reir] {
        padding-left: 66px;
    }
}


@media (max-width: 1150px) {
    .row-filter-fields[b-rf2k01reir] {
        grid-template-columns: 1fr 1fr;
    }

    .row-filter-value-field[b-rf2k01reir] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 760px) {
    .row-filter-toolbar[b-rf2k01reir] {
        align-items: stretch;
        flex-direction: column;
    }

    .row-add-button[b-rf2k01reir] {
        width: 100%;
    }

    .row-filter-card[b-rf2k01reir] {
        grid-template-columns: 24px minmax(0, 1fr) 28px;
        align-items: start;
    }

    .row-filter-fields[b-rf2k01reir] {
        grid-template-columns: 1fr;
    }

    .row-filter-value-field[b-rf2k01reir] {
        grid-column: auto;
    }
}

@media (max-width: 650px) {
    .scopes-page[b-rf2k01reir] {
        padding: 22px 14px 50px;
    }

    .page-header[b-rf2k01reir] {
        flex-direction: column;
    }

        .page-header .primary-button[b-rf2k01reir] {
            width: 100%;
        }

    .summary-grid[b-rf2k01reir] {
        grid-template-columns: 1fr;
    }

    .scope-list[b-rf2k01reir] {
        grid-template-columns: 1fr;
    }

    .editor-header[b-rf2k01reir] {
        align-items: flex-start;
        flex-direction: column;
    }

    .scope-header-stats[b-rf2k01reir] {
        width: 100%;
        justify-content: flex-start;
    }

        .scope-header-stats > div[b-rf2k01reir] {
            align-items: flex-start;
        }

    .database-context[b-rf2k01reir] {
        align-items: flex-start;
        flex-direction: column;
    }

    .object-main-row[b-rf2k01reir] {
        grid-template-columns: 20px 20px 31px minmax(0, 1fr);
    }

    .access-summary[b-rf2k01reir] {
        grid-column: 4;
    }

    .object-details[b-rf2k01reir] {
        padding: 14px 14px 16px 53px;
    }

    .column-mode-row[b-rf2k01reir] {
        align-items: stretch;
        flex-direction: column;
    }

    .segmented-control[b-rf2k01reir] {
        width: 100%;
        box-sizing: border-box;
    }

    .segment[b-rf2k01reir] {
        flex: 1;
    }

    .save-bar[b-rf2k01reir] {
        align-items: stretch;
        flex-direction: column;
    }

        .save-bar .primary-button[b-rf2k01reir] {
            width: 100%;
        }

    .modal-backdrop[b-rf2k01reir] {
        padding: 12px;
    }

    .modal-header[b-rf2k01reir],
    .modal-body[b-rf2k01reir],
    .modal-footer[b-rf2k01reir] {
        padding-left: 18px;
        padding-right: 18px;
    }

    .modal-footer[b-rf2k01reir] {
        align-items: stretch;
        flex-direction: column-reverse;
    }

        .modal-footer .primary-button[b-rf2k01reir],
        .modal-footer .secondary-button[b-rf2k01reir] {
            width: 100%;
        }
}


/* =========================================================
   ADMINISTRATOR ACCESS REQUIRED
========================================================= */

.access-denied-card[b-rf2k01reir] {
    min-height: 480px;
    padding: 48px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 16px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, .025);
}

.access-denied-icon[b-rf2k01reir] {
    width: 52px;
    height: 52px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #fff2f2;
    color: #af4048;
    font-size: 21px;
    font-weight: 850;
}

.access-denied-card h1[b-rf2k01reir] {
    margin: 0;
    color: #283144;
    font-size: 22px;
}

.access-denied-card p[b-rf2k01reir] {
    max-width: 520px;
    margin: 9px 0 0;
    color: #8993a2;
    font-size: 14px;
    line-height: 1.65;
}
/* /Pages/Support.razor.rz.scp.css */
/* ScopeBase application support page. Uses the existing app's restrained colors. */
.support-page[b-2nf5w3xezv] {
    min-height: 100vh;
    padding: 48px 44px 84px;
    background: #f7f8fb;
    color: #101828;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.support-page *[b-2nf5w3xezv],
.support-page *[b-2nf5w3xezv]::before,
.support-page *[b-2nf5w3xezv]::after {
    box-sizing: border-box;
}

.support-container[b-2nf5w3xezv] {
    width: min(1120px, 100%);
    margin: 0 auto;
}

.support-page-header[b-2nf5w3xezv] {
    margin-bottom: 34px;
}

.support-page-header h1[b-2nf5w3xezv] {
    margin: 0;
    font-size: clamp(29px, 3vw, 37px);
    line-height: 1.17;
    font-weight: 750;
    letter-spacing: -0.032em;
}

.support-page-header p[b-2nf5w3xezv] {
    margin: 12px 0 0;
    max-width: 680px;
    font-size: 14.5px;
    line-height: 1.65;
    color: #586579;
}

.support-layout[b-2nf5w3xezv] {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(260px, 0.85fr);
    align-items: start;
    gap: 24px;
}

.support-panel[b-2nf5w3xezv],
.support-help-panel[b-2nf5w3xezv] {
    min-width: 0;
    border: 1px solid #dee5ed;
    border-radius: 11px;
    background: #ffffff;
    box-shadow: 0 3px 14px rgba(16, 24, 40, 0.03);
}

.support-panel[b-2nf5w3xezv] {
    padding: 32px;
}

.support-panel-heading[b-2nf5w3xezv] {
    padding-bottom: 25px;
    margin-bottom: 26px;
    border-bottom: 1px solid #e7ebf0;
}

.support-panel-heading h2[b-2nf5w3xezv],
.support-help-panel h2[b-2nf5w3xezv] {
    margin: 0;
    font-size: 20px;
    line-height: 1.3;
    font-weight: 730;
    letter-spacing: -0.02em;
}

.support-panel-heading p[b-2nf5w3xezv],
.support-help-panel > p[b-2nf5w3xezv] {
    margin: 8px 0 0;
    color: #667085;
    font-size: 13px;
    line-height: 1.62;
}

.support-panel[b-2nf5w3xezv]  form.support-form {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.support-field-row[b-2nf5w3xezv] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.support-field[b-2nf5w3xezv] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.support-field label[b-2nf5w3xezv] {
    display: block;
    color: #344054;
    font-size: 12.5px;
    font-weight: 680;
}

.support-field label span[b-2nf5w3xezv] {
    color: #a2424e;
}

/* ::deep is required for Blazor-generated InputText/InputSelect/validation markup. */
.support-panel[b-2nf5w3xezv]  .support-input {
    width: 100%;
    min-width: 0;
    height: 46px;
    padding: 11px 13px;
    border: 1px solid #ccd5e1;
    border-radius: 7px;
    outline: none;
    background: #ffffff;
    color: #172234;
    font: inherit;
    font-size: 13.5px;
    line-height: 1.45;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.support-panel[b-2nf5w3xezv]  .support-input:focus {
    border-color: #4b70e4;
    box-shadow: 0 0 0 3px rgba(59, 99, 223, 0.12);
}

.support-panel[b-2nf5w3xezv]  .support-input.invalid {
    border-color: #c45c69;
}

.support-panel[b-2nf5w3xezv]  .support-input::placeholder {
    color: #98a2b3;
}

.support-panel[b-2nf5w3xezv]  .support-select {
    appearance: auto;
    padding-right: 12px;
}

.support-panel[b-2nf5w3xezv]  .support-textarea {
    height: auto;
    min-height: 190px;
    resize: vertical;
    line-height: 1.65;
}

.support-panel[b-2nf5w3xezv]  .validation-message {
    color: #ad3748;
    font-size: 11.5px;
    line-height: 1.4;
}

.support-field-help[b-2nf5w3xezv] {
    margin: 0;
    font-size: 11.5px;
    line-height: 1.62;
    color: #778397;
}

.support-form-footer[b-2nf5w3xezv] {
    padding-top: 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 17px;
    border-top: 1px solid #e7ebf0;
}

.support-form-footer > p[b-2nf5w3xezv] {
    margin: 0;
    font-size: 11.5px;
    color: #778397;
}

.support-button[b-2nf5w3xezv] {
    min-height: 44px;
    padding: 0 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    border: 1px solid transparent;
    border-radius: 7px;
    cursor: pointer;
    font-family: inherit;
    font-size: 13px;
    font-weight: 680;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.support-button-primary[b-2nf5w3xezv] {
    color: #ffffff;
    background: #3159d4;
    border-color: #3159d4;
}

.support-button-primary:hover:not(:disabled)[b-2nf5w3xezv] {
    background: #274bbb;
    border-color: #274bbb;
}

.support-button:focus-visible[b-2nf5w3xezv] {
    outline: 3px solid rgba(59, 99, 223, 0.26);
    outline-offset: 2px;
}

.support-button:disabled[b-2nf5w3xezv] {
    cursor: wait;
    opacity: 0.68;
}

.support-button svg[b-2nf5w3xezv] {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.support-spinner[b-2nf5w3xezv] {
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: support-spin-b-2nf5w3xezv 0.8s linear infinite;
}

@keyframes support-spin-b-2nf5w3xezv {
    to { transform: rotate(360deg); }
}

.support-error[b-2nf5w3xezv] {
    padding: 13px 15px;
    margin-bottom: 23px;
    border: 1px solid #e7c4c9;
    border-radius: 7px;
    color: #982e3c;
    background: #fff5f5;
    font-size: 12.5px;
    line-height: 1.55;
}

.support-aside[b-2nf5w3xezv] {
    display: flex;
    flex-direction: column;
    gap: 17px;
}

.support-help-panel[b-2nf5w3xezv] {
    padding: 29px 25px;
}

.support-help-panel h2[b-2nf5w3xezv] {
    font-size: 18px;
}

.support-help-item[b-2nf5w3xezv] {
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    gap: 11px;
    padding-top: 21px;
    margin-top: 21px;
    border-top: 1px solid #e8ecf2;
}

.support-help-number[b-2nf5w3xezv] {
    padding-top: 2px;
    color: #3759bc;
    font-size: 11px;
    font-weight: 750;
}

.support-help-item h3[b-2nf5w3xezv] {
    margin: 0;
    color: #202c40;
    font-size: 13px;
    font-weight: 720;
}

.support-help-item p[b-2nf5w3xezv] {
    margin: 7px 0 0;
    color: #667085;
    font-size: 12px;
    line-height: 1.65;
}

.support-security-note[b-2nf5w3xezv] {
    display: grid;
    grid-template-columns: 21px minmax(0, 1fr);
    gap: 11px;
    padding: 19px;
    border: 1px solid #d7e1dc;
    border-radius: 8px;
    background: #f4f9f6;
}

.support-security-note > svg[b-2nf5w3xezv] {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: #247556;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.support-security-note strong[b-2nf5w3xezv] {
    display: block;
    color: #234d3e;
    font-size: 12.5px;
}

.support-security-note p[b-2nf5w3xezv] {
    margin: 6px 0 0;
    color: #537468;
    font-size: 11.5px;
    line-height: 1.6;
}

.support-success[b-2nf5w3xezv] {
    padding: 12px 0 7px;
}

.support-success-icon[b-2nf5w3xezv] {
    width: 45px;
    height: 45px;
    margin-bottom: 22px;
    display: grid;
    place-items: center;
    border: 1px solid #bcddcd;
    border-radius: 8px;
    background: #eff9f3;
}

.support-success-icon svg[b-2nf5w3xezv] {
    width: 25px;
    height: 25px;
    fill: none;
    stroke: #21835c;
    stroke-width: 1.85;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.support-success h2[b-2nf5w3xezv] {
    margin: 0;
    color: #172234;
    font-size: 24px;
    font-weight: 740;
}

.support-success > p[b-2nf5w3xezv] {
    max-width: 520px;
    margin: 12px 0 0;
    color: #596679;
    font-size: 13.5px;
    line-height: 1.72;
}

.support-reference[b-2nf5w3xezv] {
    max-width: 300px;
    padding: 19px;
    margin-top: 25px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    border: 1px solid #dfe5ec;
    border-radius: 8px;
    background: #f8fafc;
}

.support-reference span[b-2nf5w3xezv] {
    color: #637187;
    font-size: 11px;
}

.support-reference strong[b-2nf5w3xezv] {
    color: #1d2b43;
    font-size: 24px;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.support-success .support-follow-up[b-2nf5w3xezv] {
    margin: 19px 0 26px;
    font-size: 12.5px;
}

@media (max-width: 1050px) {
    .support-page[b-2nf5w3xezv] { padding: 38px 28px 65px; }
    .support-layout[b-2nf5w3xezv] { grid-template-columns: minmax(0, 1fr); }
    .support-aside[b-2nf5w3xezv] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.75fr); align-items: start; }
}

@media (max-width: 680px) {
    .support-page[b-2nf5w3xezv] { padding: 30px 17px 57px; }
    .support-page-header[b-2nf5w3xezv] { margin-bottom: 25px; }
    .support-panel[b-2nf5w3xezv] { padding: 23px 18px; }
    .support-field-row[b-2nf5w3xezv] { grid-template-columns: 1fr; gap: 22px; }
    .support-aside[b-2nf5w3xezv] { grid-template-columns: 1fr; }
    .support-form-footer[b-2nf5w3xezv] { align-items: stretch; flex-direction: column; }
    .support-form-footer .support-button[b-2nf5w3xezv],
    .support-success .support-button[b-2nf5w3xezv] { width: 100%; }
    .support-help-panel[b-2nf5w3xezv] { padding: 23px 20px; }
}

@media (prefers-reduced-motion: reduce) {
    .support-spinner[b-2nf5w3xezv] { animation: none; }
    .support-button[b-2nf5w3xezv],
    .support-panel[b-2nf5w3xezv]  .support-input { transition: none; }
}
/* /Pages/Team.razor.rz.scp.css */
/* =========================================================
   PAGE
========================================================= */

.team-page[b-1wvie33r13] {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    padding: 34px 34px 72px;
    box-sizing: border-box;
    color: #182033;
}


/* =========================================================
   LOADING / MESSAGES
========================================================= */

.page-loading[b-1wvie33r13] {
    min-height: 420px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: #667085;
}

.page-loading > div:last-child[b-1wvie33r13] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.page-loading strong[b-1wvie33r13] {
    color: #263044;
    font-size: 16px;
}

.page-loading span[b-1wvie33r13] {
    color: #8c95a5;
    font-size: 14px;
}

.loading-spinner[b-1wvie33r13],
.button-spinner[b-1wvie33r13] {
    border-radius: 50%;
    border-style: solid;
    border-right-color: transparent;
    animation: spin-b-1wvie33r13 .7s linear infinite;
}

.loading-spinner[b-1wvie33r13] {
    width: 30px;
    height: 30px;
    border-width: 3px;
    border-color: #e5e8f0;
    border-top-color: #6472d8;
}

.button-spinner[b-1wvie33r13] {
    width: 13px;
    height: 13px;
    border-width: 2px;
    border-color: currentColor;
    border-right-color: transparent;
}

@keyframes spin-b-1wvie33r13 {
    to {
        transform: rotate(360deg);
    }
}

.page-error[b-1wvie33r13],
.page-message[b-1wvie33r13] {
    margin-bottom: 20px;
    padding: 14px 16px;
    display: flex;
    align-items: flex-start;
    gap: 11px;
    border-radius: 12px;
}

.page-error[b-1wvie33r13] {
    background: #fff5f5;
    border: 1px solid #efcccc;
    color: #943c3c;
}

.page-message[b-1wvie33r13] {
    background: #f0faf4;
    border: 1px solid #c8ead3;
    color: #347251;
}

.page-error-icon[b-1wvie33r13],
.page-message-icon[b-1wvie33r13] {
    width: 27px;
    height: 27px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 14px;
    font-weight: 850;
}

.page-error-icon[b-1wvie33r13] {
    background: #f8dada;
    color: #b33838;
}

.page-message-icon[b-1wvie33r13] {
    background: #d8f3e1;
    color: #257946;
}

.page-error > div:last-child[b-1wvie33r13] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.page-error strong[b-1wvie33r13] {
    font-size: 15px;
}

.page-error span[b-1wvie33r13],
.page-message span[b-1wvie33r13] {
    font-size: 14px;
    line-height: 1.5;
}


/* =========================================================
   ACCESS DENIED
========================================================= */

.access-denied-card[b-1wvie33r13] {
    min-height: 480px;
    padding: 48px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 16px;
}

.access-denied-icon[b-1wvie33r13] {
    width: 52px;
    height: 52px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #fff2f2;
    color: #af4048;
    font-size: 21px;
    font-weight: 850;
}

.access-denied-card h1[b-1wvie33r13] {
    margin: 0;
    color: #283144;
    font-size: 22px;
}

.access-denied-card p[b-1wvie33r13] {
    max-width: 520px;
    margin: 9px 0 0;
    color: #8993a2;
    font-size: 14px;
    line-height: 1.65;
}


/* =========================================================
   HEADER
========================================================= */

.page-header[b-1wvie33r13] {
    margin-bottom: 25px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 28px;
}

.eyebrow[b-1wvie33r13] {
    margin-bottom: 7px;
    color: #6472d8;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .13em;
}

.page-header h1[b-1wvie33r13] {
    margin: 0;
    color: #172033;
    font-size: 34px;
    line-height: 1.15;
    font-weight: 760;
    letter-spacing: -.035em;
}

.page-header p[b-1wvie33r13] {
    max-width: 720px;
    margin: 10px 0 0;
    color: #768093;
    font-size: 16px;
    line-height: 1.65;
}


/* =========================================================
   BUTTONS
========================================================= */

.primary-button[b-1wvie33r13],
.secondary-button[b-1wvie33r13],
.manage-button[b-1wvie33r13],
.modal-close[b-1wvie33r13] {
    font: inherit;
    cursor: pointer;
}

.primary-button[b-1wvie33r13] {
    min-height: 43px;
    padding: 0 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #202941;
    border-radius: 9px;
    background: #202941;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    transition: .15s ease;
}

.primary-button:hover:not(:disabled)[b-1wvie33r13] {
    background: #161e30;
    transform: translateY(-1px);
    box-shadow: 0 5px 14px rgba(25, 33, 52, .12);
}

.secondary-button[b-1wvie33r13] {
    min-height: 41px;
    padding: 0 15px;
    border: 1px solid #d8dde6;
    border-radius: 9px;
    background: #fff;
    color: #364154;
    font-size: 14px;
    font-weight: 700;
    transition: .15s ease;
}

.secondary-button:hover:not(:disabled)[b-1wvie33r13] {
    background: #f7f8fa;
    border-color: #c9cfda;
}

.primary-button:disabled[b-1wvie33r13],
.secondary-button:disabled[b-1wvie33r13],
.modal-close:disabled[b-1wvie33r13] {
    cursor: not-allowed;
    opacity: .6;
}

.button-plus[b-1wvie33r13] {
    font-size: 20px;
    line-height: 1;
    font-weight: 500;
}


/* =========================================================
   SUMMARY
========================================================= */

.summary-grid[b-1wvie33r13] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.summary-card[b-1wvie33r13] {
    min-width: 0;
    padding: 19px;
    display: flex;
    align-items: center;
    gap: 14px;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 14px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, .025);
}

.summary-icon[b-1wvie33r13] {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    font-size: 13px;
    font-weight: 850;
}

.members-summary-icon[b-1wvie33r13] {
    background: #eef0ff;
    color: #5b68cf;
}

.active-summary-icon[b-1wvie33r13] {
    background: #edf8f2;
    color: #347c59;
}

.pending-summary-icon[b-1wvie33r13] {
    background: #fff4e8;
    color: #9c652c;
}

.scope-summary-icon[b-1wvie33r13] {
    background: #f4effd;
    color: #7550b2;
}

.summary-card > div:last-child[b-1wvie33r13] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.summary-label[b-1wvie33r13] {
    margin-bottom: 3px;
    color: #7a8494;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .055em;
}

.summary-card strong[b-1wvie33r13] {
    color: #1c2435;
    font-size: 25px;
    line-height: 1.05;
    letter-spacing: -.025em;
}

.summary-card small[b-1wvie33r13] {
    margin-top: 5px;
    color: #969eab;
    font-size: 13px;
}


/* =========================================================
   TEAM PANEL
========================================================= */

.team-panel[b-1wvie33r13] {
    overflow: hidden;
    background: #fff;
    border: 1px solid #e3e6ec;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(17, 24, 39, .025);
}

.panel-header[b-1wvie33r13] {
    min-height: 76px;
    padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 1px solid #edf0f4;
}

.panel-header h2[b-1wvie33r13] {
    margin: 0;
    color: #20283a;
    font-size: 17px;
    font-weight: 750;
}

.panel-header p[b-1wvie33r13] {
    margin: 4px 0 0;
    color: #8a93a2;
    font-size: 14px;
}

.toolbar[b-1wvie33r13] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.search-box[b-1wvie33r13] {
    width: 245px;
    height: 39px;
    padding: 0 11px;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #dce1e9;
    border-radius: 9px;
    background: #fff;
}

.search-box:focus-within[b-1wvie33r13] {
    border-color: #6a77d9;
    box-shadow: 0 0 0 3px rgba(105, 118, 217, .09);
}

.search-box svg[b-1wvie33r13] {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    fill: none;
    stroke: #8993a3;
    stroke-width: 1.8;
    stroke-linecap: round;
}

.search-box input[b-1wvie33r13] {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: #263044;
    font: inherit;
    font-size: 14px;
}

.search-box input[b-1wvie33r13]::placeholder {
    color: #a1a8b4;
}

.role-filter[b-1wvie33r13] {
    height: 39px;
    padding: 0 31px 0 11px;
    border: 1px solid #dce1e9;
    border-radius: 9px;
    outline: none;
    background: #fff;
    color: #4b5669;
    font: inherit;
    font-size: 14px;
}


/* =========================================================
   MEMBER ROW
========================================================= */

.member-list[b-1wvie33r13] {
    display: flex;
    flex-direction: column;
}

.member-row[b-1wvie33r13] {
    min-height: 82px;
    padding: 15px 20px;
    display: grid;
    grid-template-columns: 42px minmax(190px, 1.2fr) 90px minmax(220px, 1.2fr) 105px auto;
    align-items: center;
    gap: 14px;
    border-bottom: 1px solid #edf0f4;
    transition: background .14s ease;
}

.member-row:last-child[b-1wvie33r13] {
    border-bottom: 0;
}

.member-row:hover[b-1wvie33r13] {
    background: #fdfdfe;
}

.member-avatar[b-1wvie33r13] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    background: #eef0ff;
    color: #5d69cf;
    font-size: 14px;
    font-weight: 850;
    letter-spacing: .02em;
}

.member-avatar.large[b-1wvie33r13] {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    font-size: 14px;
}

.member-identity[b-1wvie33r13] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.member-name-row[b-1wvie33r13] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
}

.member-name-row > strong[b-1wvie33r13] {
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #313a4c;
    font-size: 14px;
    font-weight: 750;
}

.member-identity > span[b-1wvie33r13] {
    max-width: 280px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #939ba8;
    font-size: 12px;
}

.you-badge[b-1wvie33r13],
.pending-badge[b-1wvie33r13],
.active-badge[b-1wvie33r13],
.disabled-badge[b-1wvie33r13] {
    flex: 0 0 auto;
    padding: 3px 6px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.you-badge[b-1wvie33r13] {
    background: #eef0ff;
    color: #5967cf;
}

.pending-badge[b-1wvie33r13] {
    background: #fff3e3;
    color: #94612c;
}

.active-badge[b-1wvie33r13] {
    background: #e9f7ef;
    color: #2f7651;
}

.disabled-badge[b-1wvie33r13] {
    background: #f4e8e9;
    color: #99434b;
}

.member-role[b-1wvie33r13],
.member-auth[b-1wvie33r13] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.member-role span[b-1wvie33r13],
.member-auth span[b-1wvie33r13],
.member-column-label[b-1wvie33r13] {
    color: #989fac;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .045em;
}

.member-role strong[b-1wvie33r13],
.member-auth strong[b-1wvie33r13] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #4a5466;
    font-size: 12px;
    font-weight: 700;
}

.member-scopes[b-1wvie33r13] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.scope-chips[b-1wvie33r13] {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.scope-chip[b-1wvie33r13] {
    max-width: 110px;
    padding: 4px 7px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-radius: 999px;
    background: #f1f3ff;
    color: #5b67c5;
    font-size: 11px;
    font-weight: 700;
}

.scope-chip.more[b-1wvie33r13] {
    background: #f3f4f6;
    color: #778193;
}

.no-scopes[b-1wvie33r13] {
    color: #a0a7b2;
    font-size: 12px;
}

.member-actions[b-1wvie33r13] {
    display: flex;
    justify-content: flex-end;
}

.manage-button[b-1wvie33r13] {
    padding: 0;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 0;
    background: transparent;
    color: #5e6bd2;
    font-size: 12px;
    font-weight: 750;
}

.manage-button:hover[b-1wvie33r13] {
    text-decoration: underline;
}

.manage-button span[b-1wvie33r13] {
    font-size: 17px;
    line-height: 1;
}


/* =========================================================
   EMPTY STATE
========================================================= */

.empty-state[b-1wvie33r13] {
    padding: 68px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.empty-icon[b-1wvie33r13] {
    width: 49px;
    height: 49px;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    background: #f0f2f7;
    color: #596477;
    font-size: 14px;
    font-weight: 850;
}

.empty-state h3[b-1wvie33r13] {
    margin: 0;
    color: #283144;
    font-size: 16px;
}

.empty-state p[b-1wvie33r13] {
    max-width: 430px;
    margin: 7px 0 0;
    color: #8c95a4;
    font-size: 14px;
    line-height: 1.6;
}


/* =========================================================
   MODALS
========================================================= */

.modal-backdrop[b-1wvie33r13] {
    position: fixed;
    inset: 0;
    z-index: 1000;
    padding: 30px 18px;
    overflow-y: auto;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    background: rgba(15, 23, 42, .52);
}

.team-modal[b-1wvie33r13] {
    width: min(650px, 100%);
    margin: auto;
    overflow: hidden;
    background: #fff;
    border: 1px solid #e3e7ed;
    border-radius: 17px;
    box-shadow: 0 20px 55px rgba(15, 23, 42, .18);
}

.modal-header[b-1wvie33r13] {
    padding: 22px 23px 18px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid #edf0f4;
}

.modal-header h2[b-1wvie33r13] {
    margin: 0;
    color: #182033;
    font-size: 21px;
    letter-spacing: -.02em;
}

.modal-header p[b-1wvie33r13] {
    margin: 6px 0 0;
    color: #7d8797;
    font-size: 13px;
}

.modal-close[b-1wvie33r13] {
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e1e5eb;
    border-radius: 8px;
    background: #fff;
    color: #667085;
    font-size: 22px;
    line-height: 1;
}

.modal-close:hover:not(:disabled)[b-1wvie33r13] {
    background: #f6f7f9;
}

.modal-body[b-1wvie33r13] {
    padding: 22px 23px;
}

.modal-footer[b-1wvie33r13] {
    padding: 14px 23px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
    background: #fafbfc;
    border-top: 1px solid #e9edf2;
}


/* =========================================================
   FORMS
========================================================= */

.form-grid[b-1wvie33r13] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
}

.field[b-1wvie33r13] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.field.full[b-1wvie33r13] {
    grid-column: 1 / -1;
}

.field label[b-1wvie33r13] {
    color: #485265;
    font-size: 13px;
    font-weight: 700;
}

.form-control[b-1wvie33r13] {
    width: 100%;
    min-height: 42px;
    padding: 9px 11px;
    box-sizing: border-box;
    border: 1px solid #d8dde7;
    border-radius: 8px;
    outline: none;
    background: #fff;
    color: #182033;
    font: inherit;
    font-size: 14px;
    transition: .15s ease;
}

.form-control:focus[b-1wvie33r13] {
    border-color: #6976d9;
    box-shadow: 0 0 0 3px rgba(105, 118, 217, .09);
}

.validation-message[b-1wvie33r13] {
    color: #c64040;
    font-size: 12px;
}

.field-help[b-1wvie33r13] {
    color: #959daa;
    font-size: 12px;
    line-height: 1.45;
}

.read-only-field[b-1wvie33r13] {
    min-height: 42px;
    padding: 10px 11px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    box-sizing: border-box;
    border: 1px solid #e1e5eb;
    border-radius: 8px;
    background: #f8f9fb;
}

.read-only-field strong[b-1wvie33r13] {
    color: #3e485a;
    font-size: 13px;
}

.read-only-field span[b-1wvie33r13] {
    color: #939ba8;
    font-size: 11px;
}


/* =========================================================
   SCOPE ASSIGNMENTS
========================================================= */

.scope-assignment-section[b-1wvie33r13] {
    margin-top: 23px;
    padding-top: 20px;
    border-top: 1px solid #edf0f4;
}

.section-heading[b-1wvie33r13] {
    margin-bottom: 11px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.section-heading > div:first-child[b-1wvie33r13] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.section-heading strong[b-1wvie33r13] {
    color: #3c4658;
    font-size: 13px;
}

.section-heading span[b-1wvie33r13] {
    color: #8d96a5;
    font-size: 11px;
}

.selected-count[b-1wvie33r13] {
    flex: 0 0 auto;
    padding: 4px 7px;
    border-radius: 999px;
    background: #f1f3ff;
    color: #5d69cb !important;
    font-weight: 750;
}

.scope-option-list[b-1wvie33r13] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.scope-option[b-1wvie33r13] {
    min-width: 0;
    min-height: 56px;
    padding: 10px;
    display: grid;
    grid-template-columns: 17px minmax(0, 1fr);
    align-items: flex-start;
    gap: 9px;
    position: relative;
    border: 1px solid #e0e4ea;
    border-radius: 9px;
    background: #fff;
    cursor: pointer;
    transition: .13s ease;
}

.scope-option:hover[b-1wvie33r13] {
    border-color: #cfd5e0;
}

.scope-option.selected[b-1wvie33r13] {
    border-color: #d1d7fa;
    background: #fafaff;
}

.scope-option input[b-1wvie33r13] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.scope-checkbox[b-1wvie33r13] {
    width: 16px;
    height: 16px;
    box-sizing: border-box;
    display: block;
    border: 1.5px solid #c7ced9;
    border-radius: 5px;
    background: #fff;
    position: relative;
}

.scope-option input:checked + .scope-checkbox[b-1wvie33r13] {
    border-color: #6572d8;
    background: #6572d8;
}

.scope-option input:checked + .scope-checkbox[b-1wvie33r13]::after {
    content: "";
    position: absolute;
    left: 4px;
    top: 1px;
    width: 4px;
    height: 8px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.scope-option > div[b-1wvie33r13] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.scope-option strong[b-1wvie33r13] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #3c4658;
    font-size: 12px;
}

.scope-option span:last-child[b-1wvie33r13] {
    display: -webkit-box;
    overflow: hidden;
    color: #939ba8;
    font-size: 11px;
    line-height: 1.45;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.no-scopes-card[b-1wvie33r13] {
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    border: 1px dashed #d9dee7;
    border-radius: 9px;
    background: #fafbfc;
}

.no-scopes-card strong[b-1wvie33r13] {
    color: #555f71;
    font-size: 12px;
}

.no-scopes-card span[b-1wvie33r13] {
    color: #929aa8;
    font-size: 11px;
}


/* =========================================================
   INVITE INFO / MEMBER SUMMARY
========================================================= */

.invite-info[b-1wvie33r13] {
    margin-top: 18px;
    padding: 13px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    border: 1px solid #dce2f4;
    border-radius: 9px;
    background: #f7f8fd;
}

.invite-info-icon[b-1wvie33r13] {
    width: 23px;
    height: 23px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #e7eaff;
    color: #5d69c8;
    font-size: 12px;
    font-weight: 850;
}

.invite-info > div:last-child[b-1wvie33r13] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.invite-info strong[b-1wvie33r13] {
    color: #495469;
    font-size: 12px;
}

.invite-info span[b-1wvie33r13] {
    color: #7d8798;
    font-size: 11px;
    line-height: 1.55;
}

.member-summary-card[b-1wvie33r13] {
    margin-bottom: 19px;
    padding: 13px;
    display: flex;
    align-items: center;
    gap: 11px;
    border: 1px solid #e6e9ef;
    border-radius: 10px;
    background: #fafbfc;
}

.member-summary-card > div:last-child[b-1wvie33r13] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.member-summary-card > div:last-child > strong[b-1wvie33r13] {
    color: #3a4456;
    font-size: 14px;
}

.member-summary-card > div:last-child > span[b-1wvie33r13] {
    color: #929aa8;
    font-size: 12px;
}

.member-summary-status[b-1wvie33r13] {
    margin-top: 3px;
}


/* =========================================================
   ACCOUNT STATUS
========================================================= */

.account-status-section[b-1wvie33r13] {
    margin-top: 20px;
    padding-top: 19px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-top: 1px solid #edf0f4;
}

.account-status-section > div:first-child[b-1wvie33r13] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.account-status-section > div:first-child strong[b-1wvie33r13] {
    color: #3d4759;
    font-size: 13px;
}

.account-status-section > div:first-child span[b-1wvie33r13] {
    color: #8d96a5;
    font-size: 11px;
}

.status-toggle[b-1wvie33r13] {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.status-toggle input[b-1wvie33r13] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.toggle-track[b-1wvie33r13] {
    width: 34px;
    height: 19px;
    padding: 2px;
    box-sizing: border-box;
    border-radius: 999px;
    background: #ccd2dc;
    transition: .15s ease;
}

.toggle-knob[b-1wvie33r13] {
    width: 15px;
    height: 15px;
    display: block;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .13);
    transition: transform .15s ease;
}

.status-toggle input:checked + .toggle-track[b-1wvie33r13] {
    background: #6673d7;
}

.status-toggle input:checked + .toggle-track .toggle-knob[b-1wvie33r13] {
    transform: translateX(15px);
}

.status-toggle input:disabled + .toggle-track[b-1wvie33r13] {
    opacity: .5;
}

.status-toggle strong[b-1wvie33r13] {
    color: #4c5668;
    font-size: 12px;
}

.self-protection-note[b-1wvie33r13] {
    margin-top: 9px;
    color: #9a6c34;
    font-size: 11px;
    text-align: right;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1150px) {

    .summary-grid[b-1wvie33r13] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .member-row[b-1wvie33r13] {
        grid-template-columns: 42px minmax(190px, 1fr) 85px minmax(170px, 1fr) auto;
    }

    .member-auth[b-1wvie33r13] {
        display: none;
    }
}


@media (max-width: 850px) {

    .team-page[b-1wvie33r13] {
        padding: 26px 18px 60px;
    }

    .page-header[b-1wvie33r13] {
        flex-direction: column;
    }

    .page-header .primary-button[b-1wvie33r13] {
        width: 100%;
    }

    .panel-header[b-1wvie33r13] {
        align-items: stretch;
        flex-direction: column;
    }

    .toolbar[b-1wvie33r13] {
        width: 100%;
    }

    .search-box[b-1wvie33r13] {
        width: auto;
        flex: 1;
    }

    .member-row[b-1wvie33r13] {
        grid-template-columns: 42px minmax(0, 1fr) auto;
    }

    .member-role[b-1wvie33r13] {
        grid-column: 2;
    }

    .member-scopes[b-1wvie33r13] {
        grid-column: 2 / span 2;
    }

    .member-actions[b-1wvie33r13] {
        grid-column: 3;
        grid-row: 1;
    }

    .scope-option-list[b-1wvie33r13] {
        grid-template-columns: 1fr;
    }
}


@media (max-width: 580px) {

    .team-page[b-1wvie33r13] {
        padding: 22px 14px 50px;
    }

    .summary-grid[b-1wvie33r13] {
        grid-template-columns: 1fr;
    }

    .toolbar[b-1wvie33r13] {
        flex-direction: column;
    }

    .search-box[b-1wvie33r13],
    .role-filter[b-1wvie33r13] {
        width: 100%;
        box-sizing: border-box;
    }

    .member-row[b-1wvie33r13] {
        padding: 14px;
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .member-avatar[b-1wvie33r13] {
        width: 38px;
        height: 38px;
    }

    .member-actions[b-1wvie33r13],
    .member-role[b-1wvie33r13],
    .member-scopes[b-1wvie33r13] {
        grid-column: 2;
    }

    .member-actions[b-1wvie33r13] {
        grid-row: auto;
        justify-content: flex-start;
    }

    .modal-backdrop[b-1wvie33r13] {
        padding: 12px;
    }

    .modal-header[b-1wvie33r13],
    .modal-body[b-1wvie33r13],
    .modal-footer[b-1wvie33r13] {
        padding-left: 18px;
        padding-right: 18px;
    }

    .form-grid[b-1wvie33r13] {
        grid-template-columns: 1fr;
    }

    .field.full[b-1wvie33r13] {
        grid-column: auto;
    }

    .modal-footer[b-1wvie33r13] {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .modal-footer .primary-button[b-1wvie33r13],
    .modal-footer .secondary-button[b-1wvie33r13] {
        width: 100%;
    }

    .account-status-section[b-1wvie33r13] {
        align-items: flex-start;
        flex-direction: column;
    }

    .self-protection-note[b-1wvie33r13] {
        text-align: left;
    }
}
/* /Shared/EmptyLayout.razor.rz.scp.css */
.page[b-7kg6y44vge] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-7kg6y44vge] {
    flex: 1;
}

.sidebar[b-7kg6y44vge] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-7kg6y44vge] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-7kg6y44vge]  a, .top-row .btn-link[b-7kg6y44vge] {
        white-space: nowrap;
        margin-left: 1.5rem;
    }

    .top-row a:first-child[b-7kg6y44vge] {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row:not(.auth)[b-7kg6y44vge] {
        display: none;
    }

    .top-row.auth[b-7kg6y44vge] {
        justify-content: space-between;
    }

    .top-row a[b-7kg6y44vge], .top-row .btn-link[b-7kg6y44vge] {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-7kg6y44vge] {
        flex-direction: row;
    }

    .sidebar[b-7kg6y44vge] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-7kg6y44vge] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row[b-7kg6y44vge], article[b-7kg6y44vge] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}
/* /Shared/MainLayout.razor.rz.scp.css */
.page[b-d622g3mmxr] {
    position: relative;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: #f7f8fb;
}

main[b-d622g3mmxr] {
    min-width: 0;
    min-height: 100vh;
    flex: 1;
    background: #f7f8fb;
}

.sidebar[b-d622g3mmxr] {
    position: relative;
    z-index: 20;
    background: #151c2d;
    border-right: 1px solid #20283a;
}

.content[b-d622g3mmxr] {
    padding: 0 !important;
}

@media (min-width: 641px) {

    .page[b-d622g3mmxr] {
        flex-direction: row;
    }

    .sidebar[b-d622g3mmxr] {
        width: 268px;
        height: 100vh;
        flex: 0 0 268px;
        position: sticky;
        top: 0;
    }
}

@media (max-width: 640.98px) {

    .sidebar[b-d622g3mmxr] {
        width: 100%;
        position: sticky;
        top: 0;
    }

    main[b-d622g3mmxr] {
        min-height: calc(100vh - 66px);
    }
}
/* /Shared/NavMenu.razor.rz.scp.css */
.nav-shell[b-21rvsey0dl] {
    height: 100%;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    color: #dce2ee;
}


/* =========================================================
   BRAND
========================================================= */

.brand-row[b-21rvsey0dl] {
    height: 76px;
    padding: 0 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex: 0 0 auto;
}

.brand-link[b-21rvsey0dl] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 11px;
    color: #ffffff;
    text-decoration: none;
}

    .brand-link:hover[b-21rvsey0dl] {
        color: #ffffff;
        text-decoration: none;
    }

.brand-mark[b-21rvsey0dl] {
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    overflow: hidden;
    background: transparent;
    box-shadow: 0 8px 20px rgba(75, 88, 204, 0.20);
}

    .brand-mark img[b-21rvsey0dl] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: contain;
    }

.brand-copy[b-21rvsey0dl] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.brand-name[b-21rvsey0dl] {
    color: #ffffff;
    font-size: 15px;
    line-height: 1.2;
    font-weight: 760;
    letter-spacing: -0.015em;
}

.brand-subtitle[b-21rvsey0dl] {
    color: #7f8ba2;
    font-size: 9px;
    line-height: 1.2;
    font-weight: 650;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

.nav-toggle[b-21rvsey0dl] {
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.05);
    color: #d8deea;
    cursor: pointer;
}

    .nav-toggle svg[b-21rvsey0dl] {
        width: 20px;
        height: 20px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
    }


/* =========================================================
   NAV CONTENT
========================================================= */

.nav-content[b-21rvsey0dl] {
    min-height: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.nav-menu[b-21rvsey0dl] {
    flex: 1;
    padding: 12px 12px 20px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.12) transparent;
}

    .nav-menu[b-21rvsey0dl]::-webkit-scrollbar {
        width: 5px;
    }

    .nav-menu[b-21rvsey0dl]::-webkit-scrollbar-thumb {
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.12);
    }

.nav-section[b-21rvsey0dl] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.nav-section-label[b-21rvsey0dl] {
    padding: 9px 11px 8px;
    color: #66738b;
    font-size: 9px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.nav-divider[b-21rvsey0dl] {
    height: 1px;
    margin: 15px 10px;
    background: rgba(255, 255, 255, 0.065);
}


/* =========================================================
   NAV LINKS
========================================================= */

[b-21rvsey0dl] .nav-link {
    position: relative;
    min-height: 43px;
    padding: 0 11px;
    display: flex;
    align-items: center;
    gap: 11px;
    border: 1px solid transparent;
    border-radius: 9px;
    color: #99a5b9;
    text-decoration: none;
    font-size: 12px;
    font-weight: 620;
    transition: color 0.14s ease, background 0.14s ease, border-color 0.14s ease, transform 0.14s ease;
}

    [b-21rvsey0dl] .nav-link:hover {
        background: rgba(255, 255, 255, 0.055);
        color: #eef2f8;
        text-decoration: none;
    }

    [b-21rvsey0dl] .nav-link.active {
        background: rgba(103, 116, 221, 0.14);
        border-color: rgba(126, 138, 233, 0.16);
        color: #ffffff;
    }

        [b-21rvsey0dl] .nav-link.active::before {
            content: "";
            position: absolute;
            left: -1px;
            top: 10px;
            bottom: 10px;
            width: 2px;
            border-radius: 999px;
            background: #7d88ea;
        }

.nav-icon[b-21rvsey0dl] {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .nav-icon svg[b-21rvsey0dl] {
        width: 18px;
        height: 18px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.65;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

[b-21rvsey0dl] .nav-link:first-of-type .nav-icon svg {
    fill: none;
}


/* =========================================================
   FOOTER
========================================================= */

.sidebar-footer[b-21rvsey0dl] {
    padding: 14px 12px 16px;
    flex: 0 0 auto;
    border-top: 1px solid rgba(255, 255, 255, 0.065);
}

.security-note[b-21rvsey0dl] {
    margin-bottom: 10px;
    padding: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid rgba(124, 137, 234, 0.13);
    border-radius: 10px;
    background: rgba(102, 115, 216, 0.065);
}

.security-note-icon[b-21rvsey0dl] {
    width: 30px;
    height: 30px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: rgba(118, 131, 229, 0.12);
    color: #9ea8f0;
}

    .security-note-icon svg[b-21rvsey0dl] {
        width: 16px;
        height: 16px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.6;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

.security-note > div:last-child[b-21rvsey0dl] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.security-note strong[b-21rvsey0dl] {
    color: #cbd3e2;
    font-size: 10px;
    font-weight: 700;
}

.security-note span[b-21rvsey0dl] {
    color: #758199;
    font-size: 9px;
    line-height: 1.4;
}

.sign-out-link[b-21rvsey0dl] {
    min-height: 40px;
    padding: 0 11px;
    display: flex;
    align-items: center;
    gap: 11px;
    border-radius: 9px;
    color: #8995aa;
    text-decoration: none;
    font-size: 11px;
    font-weight: 620;
    transition: color 0.14s ease, background 0.14s ease;
}

    .sign-out-link:hover[b-21rvsey0dl] {
        background: rgba(255, 255, 255, 0.05);
        color: #e8edf5;
        text-decoration: none;
    }


/* =========================================================
   DESKTOP
========================================================= */

@media (min-width: 641px) {

    .nav-toggle[b-21rvsey0dl] {
        display: none;
    }

    .nav-content.collapsed[b-21rvsey0dl],
    .nav-content.open[b-21rvsey0dl] {
        display: flex;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 640.98px) {

    .nav-shell[b-21rvsey0dl] {
        min-height: auto;
        height: auto;
    }

    .brand-row[b-21rvsey0dl] {
        height: 66px;
        padding: 0 14px;
    }

    .brand-mark[b-21rvsey0dl] {
        width: 36px;
        height: 36px;
    }

    .nav-content.collapsed[b-21rvsey0dl] {
        display: none;
    }

    .nav-content.open[b-21rvsey0dl] {
        display: flex;
        max-height: calc(100vh - 66px);
        border-top: 1px solid rgba(255, 255, 255, 0.065);
    }

    .nav-menu[b-21rvsey0dl] {
        max-height: calc(100vh - 190px);
    }
}
