.status-dashboard.byf20 {
    background: #f5f7fb;
    color: #0f172a;
    padding: 28px 28px 40px 28px;
    min-height: calc(100vh - 60px);
}

.status-dashboard.byf20 .status-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    position: sticky;
    top: 80px;
    z-index: 5;
    background: #f5f7fb;
    padding-top: 10px;
    padding-bottom: 10px;
}

.status-dashboard.byf20 .status-title {
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -0.3px;
}

.status-dashboard.byf20 .status-subtitle {
    color: #64748b;
    font-size: 14px;
    margin-top: 6px;
}

.status-dashboard.byf20 .status-header-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

.status-dashboard.byf20 .status-filters-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    position: sticky;
    top: 140px;
    z-index: 4;
    background: #f5f7fb;
    padding-bottom: 8px;
}

.status-dashboard.byf20 .status-filter-meta {
    display: flex;
    align-items: center;
    gap: 18px;
    color: #64748b;
    font-size: 13px;
    font-weight: 600;
}

.status-dashboard.byf20 .status-btn {
    border-radius: 10px;
    padding: 8px 14px;
    font-size: 13px;
    font-weight: 600;
}

.status-dashboard.byf20 .status-btn-outline {
    background: #ffffff;
    border: 1px solid #d7dde7;
    color: #0f172a;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

.status-dashboard.byf20 .status-select {
    border: 1px solid #d7dde7;
    background: #ffffff;
    border-radius: 10px;
    padding: 8px 10px;
    font-size: 13px;
    color: #0f172a;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.status-dashboard.byf20 .status-toolbar {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 10px;
}

.status-dashboard.byf20 .status-search {
    position: relative;
    display: flex;
    align-items: center;
    background: #ffffff;
    border: 1px solid #d7dde7;
    border-radius: 10px;
    padding: 8px 34px 8px 38px;
    min-width: 250px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.status-dashboard.byf20 .status-search-icon {
    position: absolute;
    left: 12px;
    width: 16px;
    height: 16px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") no-repeat center;
}

.status-dashboard.byf20 .status-search input {
    border: none;
    outline: none;
    background: transparent;
    width: 100%;
    font-size: 13px;
    color: #0f172a;
}

.status-dashboard.byf20 .status-search-clear {
    position: absolute;
    right: 8px;
    width: 18px;
    height: 18px;
    border: none;
    background: #e2e8f0;
    border-radius: 50%;
    cursor: pointer;
}

.status-dashboard.byf20 .status-search-clear::before,
.status-dashboard.byf20 .status-search-clear::after {
    content: "";
    position: absolute;
    top: 4px;
    left: 8px;
    width: 2px;
    height: 10px;
    background: #64748b;
}

.status-dashboard.byf20 .status-search-clear::before {
    transform: rotate(45deg);
}

.status-dashboard.byf20 .status-search-clear::after {
    transform: rotate(-45deg);
}

.status-dashboard.byf20 .status-toolbar-meta {
    display: flex;
    align-items: center;
    gap: 24px;
    color: #64748b;
    font-size: 13px;
    font-weight: 600;
}

.status-dashboard.byf20 .status-total {
    color: #0f172a;
}

.status-dashboard.byf20 .status-filters {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 6px;
    background: transparent;
    padding: 0;
    border-radius: 0;
    border: none;
    box-shadow: none;
    margin-bottom: 16px;
    margin-top: 4px;
}

.status-dashboard.byf20 .status-filter {
    border: 1px solid #d9dee8;
    background: #ffffff;
    padding: 8px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    color: #475569;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.status-dashboard.byf20 .status-filter.is-active {
    color: #ffffff;
    background: #0f172a;
    border-color: #0f172a;
}

.status-dashboard.byf20 .status-filter-count {
    background: #f1f5f9;
    border-radius: 999px;
    padding: 2px 8px;
    font-size: 11px;
    color: #64748b;
}

.status-dashboard.byf20 .status-dashboard-content {
    position: relative;
}

.status-dashboard.byf20 .status-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(360px, 360px));
    gap: 18px;
    justify-content: start;
}

.status-dashboard.byf20 .status-card {
    background: #ffffff;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    padding: 18px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
    display: grid;
    gap: 16px;
}

.status-dashboard.byf20 .status-card.status-card-lost {
    border-top: 3px solid #f2b3b3;
}

.status-dashboard.byf20 .status-card-header {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
}

.status-dashboard.byf20 .status-card-name {
    font-size: 15px;
    font-weight: 700;
    color: #0f172a;
    display: flex;
    align-items: center;
    gap: 6px;
}

.status-dashboard.byf20 .status-card-id {
    color: #94a3b8;
    font-weight: 600;
    margin-left: 6px;
}

.status-dashboard.byf20 .status-card-badge {
    display: inline-flex;
    margin-top: 8px;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    text-transform: capitalize;
}

.status-dashboard.byf20 .status-card-link {
    display: inline-flex;
    margin-top: 8px;
    font-size: 11px;
    font-weight: 600;
    color: #2563eb;
    text-decoration: none;
}

.status-dashboard.byf20 .status-card-lost-indicator {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    margin-left: 6px;
    border-radius: 50%;
    background: #fee2e2;
    color: #b91c1c;
    font-size: 12px;
    font-weight: 700;
}

.status-dashboard.byf20 .status-tooltip-content {
    color: #0f172a !important;
    text-decoration: none;
    display: none;
}

.status-tooltip-header {
    font-size: 15px;
    font-weight: 700;
    color: #0f172a;
    padding: 6px 10px 2px 10px;
}

.status-tooltip-subtitle {
    font-size: 12px;
    color: #64748b;
    padding: 0 10px 8px 10px;
    border-bottom: 1px solid #e2e8f0;
}

.status-tooltip-list {
    display: grid;
}

.status-tooltip-row {
    display: grid;
    grid-template-columns: 20px 80px 1fr;
    gap: 8px;
    align-items: center;
    padding: 8px 10px;
    border-bottom: 1px solid #eef2f7;
}

.status-tooltip-row:last-child {
    border-bottom: none;
}

.status-tooltip-icon {
    width: 16px;
    height: 16px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolyline points='12 6 12 12 16 14'/%3E%3C/svg%3E") no-repeat center;
}

.status-tooltip-date {
    font-size: 12px;
    color: #64748b;
    font-weight: 600;
}

.status-tooltip-name {
    font-size: 13px;
    font-weight: 700;
    color: #0f172a;
}

.status-tooltip-more {
    font-size: 12px;
    color: #64748b;
    padding: 8px 10px 10px 10px;
}

.status-dashboard.byf20 .status-badge-basic {
    background: #d1fae5;
    color: #047857;
}

.status-dashboard.byf20 .status-badge-enterprise {
    background: #ffe7cc;
    color: #c05621;
}

.status-dashboard.byf20 .status-badge-free {
    background: #e2e8f0;
    color: #475569;
}

.status-dashboard.byf20 .status-card-amount {
    text-align: right;
}

.status-dashboard.byf20 .status-card-price {
    font-size: 16px;
    font-weight: 700;
}

.status-dashboard.byf20 .status-card-peryear {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #94a3b8;
    margin-top: 4px;
}

.status-dashboard.byf20 .status-card-section-title {
    font-size: 12px;
    font-weight: 600;
    color: #64748b;
    margin-bottom: 6px;
}

.status-dashboard.byf20 .status-card-section-title-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}

.status-dashboard.byf20 .status-card-section-title-row .status-card-section-title {
    margin-bottom: 0;
}

.status-dashboard.byf20 .status-card-section-row {
    font-size: 13px;
    font-weight: 600;
    color: #0f172a;
}

.status-dashboard.byf20 .status-card-section-row.is-alert {
    color: #b91c1c;
}

.status-dashboard.byf20 .status-progress {
    width: 100%;
    height: 6px;
    background: #eef2f7;
    border-radius: 999px;
    overflow: hidden;
}

.status-dashboard.byf20 .status-progress-bar {
    height: 100%;
    background: #0f172a;
    border-radius: 999px;
}

.status-dashboard.byf20 .status-progress-bar.is-alert {
    background: #f2a8a8;
}

.status-dashboard.byf20 .status-card-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
}

.status-dashboard.byf20 .status-metric {
    background: #f8fafc;
    border-radius: 8px;
    padding: 8px 10px;
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    column-gap: 8px;
    row-gap: 2px;
    align-items: center;
}

.status-dashboard.byf20 .status-metric.is-empty {
    background: #fee2e2;
}

.status-dashboard.byf20 .status-metric.is-alert {
    background: #fee2e2;
}

.status-dashboard.byf20 .status-metric-icon {
    width: 26px;
    height: 26px;
    border-radius: 8px;
    background: #eef2f7;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    grid-row: 1 / span 2;
}

.status-dashboard.byf20 .status-metric-label {
    font-size: 11px;
    text-transform: uppercase;
    color: #64748b;
    letter-spacing: 0.5px;
}

.status-dashboard.byf20 .status-metric-value {
    font-size: 13px;
    font-weight: 700;
    color: #0f172a;
    margin-top: 4px;
}

.status-dashboard.byf20 .status-icon-login {
    background: #eef2f7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235e6b80' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 12 6 12 9 6 15 18 18 12 21 12'/%3E%3C/svg%3E") no-repeat center;
}

.status-dashboard.byf20 .status-icon-docs {
    background: #eef2f7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235e6b80' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3Cline x1='16' y1='13' x2='8' y2='13'/%3E%3Cline x1='16' y1='17' x2='8' y2='17'/%3E%3C/svg%3E") no-repeat center;
}

.status-dashboard.byf20 .status-icon-dossiers {
    background: #eef2f7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235e6b80' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2' ry='2'/%3E%3Cpath d='M3 9h18'/%3E%3Cpath d='M3 14h18'/%3E%3C/svg%3E") no-repeat center;
}

.status-dashboard.byf20 .status-icon-lite {
    background: #eef2f7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235e6b80' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3Cpath d='M6 21v-2a6 6 0 0 1 12 0v2'/%3E%3C/svg%3E") no-repeat center;
}

.status-dashboard.byf20 .status-icon-external {
    background: #eef2f7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235e6b80' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M17 11a4 4 0 0 0-4 4v3'/%3E%3Cpath d='M4 21v-2a4 4 0 0 1 4-4h2'/%3E%3C/svg%3E") no-repeat center;
}

.status-dashboard.byf20 .status-icon-share {
    background: #eef2f7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235e6b80' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='18' cy='5' r='3'/%3E%3Ccircle cx='6' cy='12' r='3'/%3E%3Ccircle cx='18' cy='19' r='3'/%3E%3Cline x1='8.59' y1='13.51' x2='15.42' y2='17.49'/%3E%3Cline x1='15.41' y1='6.51' x2='8.59' y2='10.49'/%3E%3C/svg%3E") no-repeat center;
}

.status-dashboard.byf20 .status-card-conversions {
    background: #f8fafc;
    border-radius: 10px;
    padding: 12px;
}

.status-dashboard.byf20 .status-conversion-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.status-dashboard.byf20 .status-conversion-label {
    font-size: 11px;
    color: #64748b;
}

.status-dashboard.byf20 .status-conversion-value {
    font-size: 12px;
    font-weight: 700;
    color: #0f172a;
}

@media (max-width: 900px) {
    .status-dashboard.byf20 .status-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .status-dashboard.byf20 .status-toolbar {
        flex-direction: column;
        align-items: flex-start;
    }

    .status-dashboard.byf20 .status-search {
        width: 100%;
        min-width: 0;
    }

    .status-dashboard.byf20 .status-grid {
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    }

    .status-dashboard.byf20 .status-conversion-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.usage-dashboard.byf20 {
    width: 100%;
    color: #0f172a;
}

.usage-dashboard.byf20 .usage-switch {
    display: inline-flex;
    gap: 8px;
    margin-bottom: 12px;
}

.usage-dashboard.byf20 .usage-switch-item {
    display: inline-block;
    padding: 8px 14px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    color: #0f172a;
    background: #ffffff;
    border: 1px solid #d7dde7;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
    text-decoration: none;
}

.usage-dashboard.byf20 .usage-years {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-left: 6px;
}

.usage-dashboard.byf20 .usage-meta-line {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
    margin-left: auto;
}

.usage-dashboard.byf20 .usage-meta-sep {
    color: #cbd5f5;
}

.usage-dashboard.byf20 .usage-kpis {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.usage-dashboard.byf20 .usage-kpi-card {
    background: #ffffff;
    border: 1px solid #dbe2ec;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.usage-dashboard.byf20 .usage-kpi-label {
    font-size: 12px;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 8px;
}

.usage-dashboard.byf20 .usage-kpi-value {
    font-size: 20px;
    line-height: 1;
    font-weight: 700;
}

.usage-dashboard.byf20 .usage-panels {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
    margin-bottom: 16px;
}

.usage-dashboard.byf20 .usage-panel,
.usage-dashboard.byf20 .usage-table-panel {
    background: #ffffff;
    border: 1px solid #dbe2ec;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.usage-dashboard.byf20 .usage-table-panel {
    overflow-x: auto;
}

.usage-dashboard.byf20 .usage-panel {
    padding: 14px;
}

.usage-dashboard.byf20 .usage-panel-title {
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 10px;
}

.usage-dashboard.byf20 .usage-row-stat {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 0;
    border-bottom: 1px solid #edf1f6;
    font-size: 13px;
}

.usage-dashboard.byf20 .usage-row-stat:last-child {
    border-bottom: 0;
}

.usage-dashboard.byf20 .usage-table {
    width: 100%;
    border-collapse: collapse;
}

.usage-dashboard.byf20 .usage-table thead th {
    background: #f8fafc;
    color: #334155;
    font-size: 12px;
    font-weight: 700;
    text-align: left;
    padding: 10px;
    border-bottom: 1px solid #dbe2ec;
}

.usage-dashboard.byf20 .usage-table tbody td {
    font-size: 12px;
    color: #0f172a;
    padding: 10px;
    border-bottom: 1px solid #edf1f6;
}

.usage-dashboard.byf20 .usage-empty-row {
    text-align: center;
    color: #64748b;
    padding: 16px;
}

.usage-dashboard.byf20 .usage-last-updated {
    margin-top: 10px;
    color: #64748b;
    font-size: 12px;
    text-align: right;
}

    .usage-dashboard.byf20.is-loading {
    opacity: 0.75;
}

.usage-dashboard.byf20 .usage-header {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.usage-dashboard.byf20 .usage-title {
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -0.3px;
}

.usage-dashboard.byf20 .usage-subtitle {
    color: #64748b;
    font-size: 14px;
}

.usage-dashboard.byf20 .usage-header-actions {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.usage-dashboard.byf20 .usage-search {
    width: 220px;
    min-width: 220px;
    max-width: 240px;
}

.usage-dashboard.byf20 .usage-source-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.usage-dashboard.byf20 .usage-source-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 12px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
    display: grid;
    gap: 6px;
}

.usage-dashboard.byf20 .usage-source-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.usage-dashboard.byf20 .usage-source-left {
    display: flex;
    align-items: center;
    gap: 10px;
}

.usage-dashboard.byf20 .usage-source-right {
    text-align: right;
}

.usage-dashboard.byf20 .usage-source-icon {
    width: 30px;
    height: 30px;
    border-radius: 10px;
    background: #e2e8f0;
}

.usage-dashboard.byf20 .usage-source-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: #64748b;
}

.usage-dashboard.byf20 .usage-source-value {
    font-size: 18px;
    font-weight: 700;
    color: #0f172a;
}

.usage-dashboard.byf20 .usage-source-pct {
    font-size: 11px;
    color: #64748b;
}

.usage-dashboard.byf20 .usage-activity-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 14px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
    margin-bottom: 16px;
}

.usage-dashboard.byf20 .usage-activity-chart {
    display: grid;
    grid-template-columns: repeat(14, minmax(0, 1fr));
    gap: 6px;
    align-items: end;
    height: 140px;
    margin-top: 12px;
}

.usage-dashboard.byf20 .usage-activity-item {
    display: grid;
    gap: 6px;
    justify-items: center;
}

.usage-dashboard.byf20 .usage-activity-bar {
    width: 100%;
    border-radius: 8px;
    background: #0f172a;
}

.usage-dashboard.byf20 .usage-activity-label {
    font-size: 10px;
    color: #94a3b8;
}

.usage-dashboard.byf20 .usage-split {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 12px;
    margin-bottom: 16px;
}

.usage-dashboard.byf20 .usage-feature-list {
    display: grid;
    gap: 12px;
}

.usage-dashboard.byf20 .usage-feature-row {
    display: grid;
    gap: 6px;
}

.usage-dashboard.byf20 .usage-feature-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.usage-dashboard.byf20 .usage-feature-left {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    font-weight: 600;
    color: #0f172a;
}

.usage-dashboard.byf20 .usage-feature-right {
    font-size: 12px;
    color: #0f172a;
    font-weight: 600;
    text-align: right;
    min-width: 60px;
}

.usage-dashboard.byf20 .usage-feature-rank {
    color: #94a3b8;
    font-weight: 700;
}

.usage-dashboard.byf20 .usage-feature-bar {
    height: 6px;
    background: #eef2f7;
    border-radius: 999px;
    overflow: hidden;
}

.usage-dashboard.byf20 .usage-feature-bar span {
    display: block;
    height: 100%;
    background: #0f172a;
}

.usage-dashboard.byf20 .usage-category-chart {
    display: flex;
    height: 8px;
    border-radius: 999px;
    overflow: hidden;
    background: #eef2f7;
    margin-bottom: 12px;
}

.usage-dashboard.byf20 .usage-category-segment {
    display: block;
    height: 100%;
    background: #3b82f6;
}

.usage-dashboard.byf20 .usage-category-list {
    display: grid;
    gap: 6px;
    align-content: start;
}

.usage-dashboard.byf20 .usage-category-row {
    display: grid;
    grid-template-columns: 12px 1fr auto;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #64748b;
}

.usage-dashboard.byf20 .usage-category-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #3b82f6;
}

.usage-dashboard.byf20 .usage-tenant-panel {
    margin-bottom: 16px;
}

.usage-dashboard.byf20 .usage-panel-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.usage-dashboard.byf20 .usage-panel-meta {
    font-size: 12px;
    color: #64748b;
    font-weight: 600;
}

.usage-dashboard.byf20 .usage-tenant-list {
    display: grid;
}

.usage-dashboard.byf20 .usage-tenant-row {
    padding: 6px 0;
    border-radius: 10px;
    transition: background 0.15s ease;
}

.usage-dashboard.byf20 .usage-tenant-row:hover {
    background: #f8fafc;
}

.usage-dashboard.byf20 .usage-tenant-line {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.usage-dashboard.byf20 .usage-tenant-left {
    display: flex;
    align-items: baseline;
    gap: 10px;
}

.usage-dashboard.byf20 .usage-tenant-name {
    font-size: 14px;
    font-weight: 700;
    color: #0f172a;
}

.usage-dashboard.byf20 .usage-tenant-users {
    color: #64748b;
    font-size: 12px;
    font-weight: 600;
}

.usage-dashboard.byf20 .usage-tenant-count {
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
}

.usage-dashboard.byf20 .usage-tenant-bar {
    height: 8px;
    background: #eef2f7;
    border-radius: 999px;
    overflow: hidden;
    margin: 8px 0 6px;
}

.usage-dashboard.byf20 .usage-tenant-bar span {
    display: block;
    height: 100%;
    background: #0f172a;
}

.usage-dashboard.byf20 .usage-tenant-sources {
    display: flex;
    gap: 14px;
    font-size: 12px;
    color: #64748b;
    align-items: center;
}

.usage-dashboard.byf20 .usage-tenant-source {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.usage-dashboard.byf20 .usage-tenant-source .usage-source-icon {
    width: 16px;
    height: 16px;
    border-radius: 6px;
    background-size: 14px 14px;
}

.usage-dashboard.byf20 .usage-tenant-source-pct {
    color: #94a3b8;
    font-weight: 600;
    font-size: 11px;
}

.usage-dashboard.byf20 .usage-tenant-tooltip-list {
    display: grid;
}

.usage-dashboard.byf20 .usage-tenant-tooltip-row {
    display: grid;
    grid-template-columns: 24px 1fr auto;
    gap: 10px;
    align-items: center;
    padding: 9px 12px;
    border-bottom: 1px solid #edf2f7;
    font-size: 13px;
}

.usage-dashboard.byf20 .usage-tenant-tooltip-row:last-child {
    border-bottom: none;
}

.usage-dashboard.byf20 .usage-tenant-tooltip-rank {
    color: #94a3b8;
    font-weight: 700;
}

.usage-dashboard.byf20 .usage-tenant-tooltip-name {
    font-weight: 700;
    color: #0f172a;
}

.usage-dashboard.byf20 .usage-tenant-tooltip-count {
    font-weight: 700;
    color: #0f172a;
}

.usage-tenant-tooltip .status-tooltip-header,
.usage-tenant-tooltip .status-tooltip-subtitle,
.usage-tenant-tooltip .usage-tenant-tooltip-row,
.usage-tenant-tooltip .usage-tenant-tooltip-name,
.usage-tenant-tooltip .usage-tenant-tooltip-count,
.usage-tenant-tooltip .usage-tenant-tooltip-source-value {
    color: #0f172a;
}

.usage-tenant-tooltip .status-tooltip-header {
    font-size: 18px;
    font-weight: 700;
    padding: 12px 12px 2px 12px;
}

.usage-tenant-tooltip .status-tooltip-subtitle {
    font-size: 13px;
    color: #64748b;
    padding: 0 12px 10px 12px;
    border-bottom: 1px solid #edf2f7;
}

.usage-tenant-tooltip .usage-tenant-tooltip-list {
    display: grid;
}

.usage-tenant-tooltip .usage-tenant-tooltip-row {
    display: grid;
    grid-template-columns: 24px 1fr auto;
    gap: 10px;
    align-items: center;
    padding: 9px 12px;
    border-bottom: 1px solid #edf2f7;
    font-size: 13px;
}

.usage-tenant-tooltip .usage-tenant-tooltip-count {
    text-align: right;
    min-width: 40px;
}

.usage-tenant-tooltip .usage-tenant-tooltip-name {
    font-weight: 700;
}

.usage-tenant-tooltip .usage-tenant-tooltip-sources {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    padding: 10px 12px 12px;
    border-top: 1px solid #edf2f7;
    font-size: 12px;
    color: #64748b;
}

.usage-tenant-tooltip .usage-tenant-tooltip-source {
    display: grid;
    gap: 2px;
}

.usage-tenant-tooltip .usage-tenant-tooltip-source-label {
    font-size: 12px;
    color: #64748b;
}

.usage-tenant-tooltip .usage-tenant-tooltip-source-value {
    font-size: 14px;
    font-weight: 700;
}

.usage-category-tooltip .status-tooltip-header {
    font-size: 18px;
    font-weight: 700;
    padding: 12px 12px 6px 12px;
}

.usage-category-tooltip .status-tooltip-list {
    display: grid;
}

.usage-category-tooltip .status-tooltip-row {
    display: grid;
    grid-template-columns: 1fr;
    padding: 8px 12px;
    border-bottom: 1px solid #edf2f7;
    font-size: 13px;
}

.usage-category-tooltip .status-tooltip-row:last-child {
    border-bottom: none;
}

.usage-dashboard.byf20 .usage-tenant-tooltip-empty {
    padding: 10px;
    font-size: 11px;
    color: #94a3b8;
}

.usage-dashboard.byf20 .usage-tenant-tooltip-sources {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    padding: 10px 12px 12px;
    border-top: 1px solid #edf2f7;
    font-size: 12px;
    color: #64748b;
}

.usage-dashboard.byf20 .usage-tenant-tooltip-source {
    display: grid;
    gap: 2px;
}

.usage-dashboard.byf20 .usage-tenant-tooltip-source-value {
    color: #0f172a;
    font-weight: 700;
}

.usage-dashboard.byf20 .status-tooltip-content {
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(15, 23, 42, 0.12);
    background: #ffffff;
}

.usage-dashboard.byf20 .status-tooltip-header {
    font-size: 18px;
    font-weight: 700;
    color: #0f172a;
    padding: 12px 12px 2px 12px;
}

.usage-dashboard.byf20 .status-tooltip-subtitle {
    font-size: 13px;
    color: #64748b;
    padding: 0 12px 10px 12px;
    border-bottom: 1px solid #edf2f7;
}

.usage-dashboard.byf20 .usage-tenant-tooltip-rank {
    color: #94a3b8;
    font-weight: 700;
}

.usage-dashboard.byf20 .usage-panel-title {
    display: flex;
    align-items: center;
    gap: 8px;
}

.usage-dashboard.byf20 .usage-panel-icon {
    width: 18px;
    height: 18px;
    border-radius: 6px;
    background: #eef2f7;
}

.usage-dashboard.byf20 .usage-panel-icon-trophy {
    background: #fde68a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b45309' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 21h8'/%3E%3Cpath d='M12 17v4'/%3E%3Cpath d='M7 4h10v4a5 5 0 0 1-10 0V4z'/%3E%3Cpath d='M17 4h3a2 2 0 0 1 2 2c0 3.3-2.7 6-6 6'/%3E%3Cpath d='M7 4H4a2 2 0 0 0-2 2c0 3.3 2.7 6 6 6'/%3E%3C/svg%3E") no-repeat center;
}

.usage-dashboard.byf20 .usage-panel-icon-categories {
    background: #e0e7ff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='2'/%3E%3Crect x='14' y='3' width='7' height='7' rx='2'/%3E%3Crect x='3' y='14' width='7' height='7' rx='2'/%3E%3Crect x='14' y='14' width='7' height='7' rx='2'/%3E%3C/svg%3E") no-repeat center;
}

.usage-dashboard.byf20 .usage-panel-icon-clipboard {
    background: #e2e8f0 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23334155' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='2' width='6' height='4' rx='1'/%3E%3Cpath d='M9 4H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2h-2'/%3E%3Cpath d='M9 11l2 2 4-4'/%3E%3C/svg%3E") no-repeat center;
}

.usage-dashboard.byf20 .usage-category-tooltip-row {
    grid-template-columns: 1fr;
    padding: 6px 10px;
    font-size: 12px;
}

.usage-dashboard.byf20 .usage-category-tooltip-row .status-tooltip-name {
    font-weight: 700;
    color: #0f172a;
}

.usage-dashboard.byf20 .usage-tenant-tooltip-list,
.usage-dashboard.byf20 .usage-tenant-tooltip-list * {
    color: #0f172a;
}

.usage-dashboard.byf20 .usage-empty-card {
    padding: 16px;
    color: #94a3b8;
    font-size: 12px;
}

@media (max-width: 1024px) {
    .usage-dashboard.byf20 .usage-header {
        flex-direction: column;
        align-items: stretch;
    }

    .usage-dashboard.byf20 .usage-header-actions {
        margin-left: 0;
        justify-content: flex-start;
    }

    .usage-dashboard.byf20 .usage-source-grid,
    .usage-dashboard.byf20 .usage-split {
        grid-template-columns: 1fr;
    }
}

.usage-dashboard.byf20 .usage-source-web .usage-source-icon {
    background: #e0edff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%233b82f6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M2 12h20'/%3E%3Cpath d='M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z'/%3E%3C/svg%3E") no-repeat center;
}

.usage-dashboard.byf20 .usage-source-mobile .usage-source-icon,
.usage-dashboard.byf20 .usage-source-app .usage-source-icon {
    background: #dcfce7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2316a34a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='7' y='2' width='10' height='20' rx='2' ry='2'/%3E%3Cline x1='11' y1='18' x2='13' y2='18'/%3E%3C/svg%3E") no-repeat center;
}

.usage-dashboard.byf20 .usage-source-api .usage-source-icon {
    background: #ede9fe url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%238b5cf6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='8' rx='2'/%3E%3Crect x='3' y='13' width='18' height='8' rx='2'/%3E%3Cline x1='7' y1='7' x2='7' y2='7'/%3E%3Cline x1='7' y1='17' x2='7' y2='17'/%3E%3C/svg%3E") no-repeat center;
}

.usage-dashboard.byf20 .usage-source-old_api .usage-source-icon,
.usage-dashboard.byf20 .usage-source-oldapi .usage-source-icon,
.usage-dashboard.byf20 .usage-source-legacy_api .usage-source-icon {
    background: #ffedd5 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23ea580c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='5' rx='9' ry='3'/%3E%3Cpath d='M3 5v14c0 1.7 4 3 9 3s9-1.3 9-3V5'/%3E%3Cpath d='M3 12c0 1.7 4 3 9 3s9-1.3 9-3'/%3E%3C/svg%3E") no-repeat center;
}

.usage-dashboard.byf20 .usage-source-other .usage-source-icon {
    background: #f1f5f9;
}

.usage-dashboard.byf20 .usage-category-documents { background: #3b82f6; }
.usage-dashboard.byf20 .usage-category-dossiers { background: #10b981; }
.usage-dashboard.byf20 .usage-category-metadata { background: #f59e0b; }
.usage-dashboard.byf20 .usage-category-mail { background: #ef4444; }
.usage-dashboard.byf20 .usage-category-tasks { background: #fb923c; }
.usage-dashboard.byf20 .usage-category-content { background: #06b6d4; }
.usage-dashboard.byf20 .usage-category-sharing { background: #8b5cf6; }
.usage-dashboard.byf20 .usage-category-versions { background: #6366f1; }
.usage-dashboard.byf20 .usage-category-versioning { background: #6366f1; }
.usage-dashboard.byf20 .usage-category-backup { background: #0ea5e9; }
.usage-dashboard.byf20 .usage-category-users { background: #ec4899; }
.usage-dashboard.byf20 .usage-category-other { background: #94a3b8; }