.text-accent {
        color: var(--cso-accent);
    }

    .text-muted-cso {
        color: var(--cso-text-dim);
    }

    .btn-accent {
        background-color: var(--cso-accent);
        color: var(--cso-bg-base);
        border: none;
        font-weight: 700;
        padding: .5rem 1.2rem;
        border-radius: 6px;
        transition: all .3s ease;
    }

    .btn-accent:hover {
        box-shadow: 0 0 15px var(--cso-accent-glow);
        color: var(--cso-bg-base);
    }

    .status-dot {
        display: inline-block;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        vertical-align: middle;
    }

    .status-dot.online {
        background: #00ff88;
        box-shadow: 0 0 8px #00ff88;
    }

    .status-dot.offline {
        background: #ff0000;
        box-shadow: 0 0 8px #ff0000;
    }

    .badge-status {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        font-size: .8rem;
        padding: .35rem .75rem;
        border-radius: 8px;
    }

    .badge-status-online {
        background: rgba(0, 255, 136, .1);
        border: 1px solid rgba(0, 255, 136, .25);
        color: #00ff88;
    }

    .badge-status-offline {
        background: rgba(255, 0, 0, .1);
        border: 1px solid rgba(255, 0, 0, .25);
        color: #ff0000;
    }

    .family-dot {
        display: inline-block;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        vertical-align: middle;
    }

    .family-dot.online {
        background: #00ff88;
        box-shadow: 0 0 8px #00ff88;
    }

    .family-dot.offline {
        background: #292929;
        box-shadow: 0 0 8px #292929;
    }

    .stat-icon {
        width: 42px;
        height: 42px;
        border-radius: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.1rem;
    }

    .stat-icon-accent {
        background: var(--cso-accent-soft);
        color: var(--cso-accent);
    }

    .stat-icon-success {
        background: rgba(0, 255, 136, .1);
        color: #00ff88;
    }

    .stat-icon-danger {
        background: rgba(255, 68, 68, .1);
        color: var(--cso-color-error);
    }

    .stat-icon-warning {
        background: rgba(255, 193, 7, .1);
        color: #ffc107;
    }

    .badge-rank {
        font-size: 1.7rem;
        font-weight: 700;
        text-transform: uppercase;
        color: var(--cso-accent);
    }

    .cso-progress {
        height: 6px;
        background: var(--cso-border-dark);
        border-radius: 999px;
    }

    .cso-progress-bar {
        background: var(--cso-accent);
        border-radius: 999px;
    }

    .bg-success-cso {
        background: #00c46a !important;
    }

    .bg-secondary-cso {
        background: #6b6b6b !important;
    }

    .cso-chart {
        height: 190px;
        padding: 0 .25rem;
    }

    .cso-bar {
        width: 100%;
        max-width: 34px;
        background: linear-gradient(180deg, var(--cso-accent), #4a3fc7);
        border-radius: 6px 6px 0 0;
        transition: opacity .2s ease;
    }

    .cso-bar:hover {
        opacity: .8;
    }

    .cso-select {
        background-color: var(--cso-bg-base);
        border: 1px solid var(--cso-border-dark);
        color: var(--cso-text-white);
    }

    .cso-select:focus {
        border-color: var(--cso-accent);
        box-shadow: none;
    }

    .cso-list .list-group-item {
        background: transparent;
        border-color: var(--cso-border-darker);
        padding: .85rem 0;
    }

    .cso-list .list-group-item:first-child {
        padding-top: 0;
    }

    .cso-list .list-group-item:last-child {
        padding-bottom: 0;
        border-bottom: none;
    }

    .cso-server-list li {
        padding: .6rem 0;
        border-bottom: 1px solid var(--cso-border-darker);
        color: var(--cso-text-white);
        font-size: .9rem;
    }

    .cso-server-list li:last-child {
        border-bottom: none;
        padding-bottom: 0;
    }

    .quick-link-btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: .4rem;
        padding: .9rem .5rem;
        background: rgba(255, 255, 255, .03);
        border-radius: 8px;
        color: var(--cso-text-dim);
        text-decoration: none;
        font-size: .8rem;
        transition: all .2s ease;
    }

    .quick-link-btn i {
        font-size: 1.3rem;
        color: var(--cso-accent);
    }

    .quick-link-btn:hover {
        background: rgba(255, 255, 255, .06);
        color: var(--cso-text-white);
    }