a {
    text-decoration: none !important;
}

html {
    max-width: 100%;
}

body {
    overflow-x: hidden;
}

img,
video,
canvas,
svg {
    max-width: 100%;
}

.admin-shell,
.admin-main,
.admin-content,
.card,
.modal-content,
.row,
.col,
[class^="col-"],
[class*=" col-"] {
    min-width: 0;
}

.admin-sidebar {
    width: 250px;
    height: 100vh;
    overflow-y: auto;
    z-index: 1020;
}

.admin-main {
    overflow-x: hidden;
}

.admin-content {
    max-width: 100%;
}

.table-responsive {
    max-width: 100%;
    -webkit-overflow-scrolling: touch;
}

.card-body:has(> .table),
.card-body:has(> table) {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.chart-wrap {
    max-width: 100%;
    overflow: hidden;
}

.btn-group {
    max-width: 100%;
}

.modal-dialog {
    max-width: calc(100% - 1rem);
}

.ql-toolbar {
    background-color: #2c2f33;
    border: 1px solid #444;
    color: #fff;
}

.ql-toolbar button,
.ql-toolbar .ql-picker-label,
.ql-toolbar .ql-picker-item {
    color: #fff !important;
    filter: invert(1);
}

.ql-toolbar .ql-picker-options {
    background-color: #2c2f33;
    border: 1px solid #444;
    color: #fff;
}

.ql-container {
    background-color: #1e1e1e;
    border: 1px solid #444;
    color: #fff;
}

.ql-editor {
    background-color: rgba(43, 48, 53);
}

.ql-editor a {
    color: #0d6efd;
}

.ql-editor img {
    border: 1px solid #555;
}

.image-container {
    position: relative;
    display: inline-block;
}

.image-container img {
    width: 64px;
    height: 64px;
    object-fit: cover;
    border-radius: 10px;
    border: 1px solid #555;
    background-color: #2c2f33;
    padding: 2px;
}

.image-container .delete-btn {
    position: absolute;
    top: -8px;
    right: -8px;
    background: #ff4d4d;
    color: white;
    border: none;
    border-radius: 50%;
    font-size: 12px;
    cursor: pointer;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.image-add {
    width: 64px;
    height: 64px;
    background-color: #2b3035;
    border: 2px dashed #666;
    border-radius: 10px;
    color: #999;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    cursor: pointer;
}

.image-add:hover {
    border-color: #0d6efd;
    color: #0d6efd;
}

.keyboard-row {
    position: relative;
    padding: 8px;
    background-color: #2b3035;
    border: 1px solid #444;
    border-radius: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.row-delete-btn {
    position: absolute;
    top: -6px;
    right: -6px;
    background: #ff4d4d;
    color: white;
    border: none;
    border-radius: 50%;
    font-size: 12px;
    width: 20px;
    height: 20px;
    cursor: pointer;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.keyboard-button {
    background-color: #23272a;
    border-radius: 8px;
    padding: 6px 12px;
    color: white;
    border: none;
    display: flex;
    align-items: center;
    gap: 4px;
}

.keyboard-button.kb-style-primary {
    background-color: #0d6efd;
}

.keyboard-button.kb-style-success {
    background-color: #198754;
}

.keyboard-button.kb-style-danger {
    background-color: #dc3545;
}

.color-picker {
    display: flex;
    gap: 8px;
    align-items: center;
    padding: 6px;
    background: #1f2326;
    border: 1px solid #3a3f44;
    border-radius: 10px;
}

.color-option {
    width: 26px;
    height: 26px;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: #2c2f33;
    box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.3);
    cursor: pointer;
    position: relative;
}

.color-option.is-primary {
    background: #0d6efd;
}

.color-option.is-success {
    background: #198754;
}

.color-option.is-danger {
    background: #dc3545;
}

.color-option.is-selected::after {
    content: "";
    position: absolute;
    inset: 3px;
    border-radius: 6px;
    border: 2px solid rgba(255, 255, 255, 0.85);
}

.color-option:focus-visible {
    outline: 2px solid #0d6efd;
    outline-offset: 2px;
}

.keyboard-button input {
    background: transparent;
    border: none;
    color: white;
    width: 100px;
}

.keyboard-button input:focus {
    outline: none;
}

.keyboard-button .delete-btn {
    background: #ff4d4d;
    border: none;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    color: white;
    font-size: 12px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.add-button {
    background-color: #2c2f33;
    border: 2px dashed #666;
    color: #999;
    width: 60px;
    height: 36px;
    border-radius: 8px;
    font-size: 18px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.add-button:hover {
    border-color: #0d6efd;
    color: #0d6efd;
}

.user-card .border {
    border-color: rgba(255, 255, 255, .15) !important;
}

.user-card .note-item textarea {
    min-height: 72px;
}

.utm-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: .75rem;
}

.utm-list-card {
    width: auto !important;
    min-width: 0;
    border-radius: .75rem !important;
}

.utm-list-card strong {
    overflow-wrap: anywhere;
}

.utm-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .25rem .75rem;
    line-height: 1.25;
}

.utm-created {
    grid-column: 1 / -1;
}

.utm-list-card {
    text-align: center;
}

.cursor-pointer {
    cursor: pointer !important;
}

.game-description-field {
    min-height: 120px !important;
    resize: vertical !important;
}

.signal-hidden {
    opacity: 0.35;
    user-select: none;
}

.signal-hidden .signal-secret {
    filter: blur(4px);
}

.hide-blacklisted .signal-hidden {
    display: none;
}

#editor-container .ql-editor blockquote {
    margin: 6px 0;
    padding: 10px 12px;
    border-left: 4px solid rgba(255, 255, 255, .35);
    background: rgba(255, 255, 255, .08);
    border-radius: 8px;
    display: block;
    width: 100%;
}

#editor-container .ql-editor blockquote + blockquote {
    margin-top: -6px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    padding-top: 6px;
}

#editor-container .ql-editor blockquote:has(+ blockquote) {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    padding-bottom: 6px;
}

@media (max-width: 1199.98px) {
    .admin-content.w-75 {
        width: 100% !important;
    }
}

@media (max-width: 991.98px) {
    .admin-shell {
        display: block !important;
    }

    .admin-sidebar {
        position: sticky !important;
        top: 0;
        width: 100%;
        height: auto;
        max-height: 42vh;
        overflow-y: auto;
        border-bottom: 1px solid rgba(255, 255, 255, .12);
    }

    .admin-sidebar .admin-nav {
        flex-direction: row !important;
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: .25rem;
        scrollbar-width: thin;
        scroll-behavior: auto;
    }

    .admin-sidebar .admin-nav > li {
        flex: 0 0 auto;
    }

    .admin-sidebar .nav-link {
        min-height: 40px;
        white-space: nowrap;
    }

    .admin-sidebar .collapse.show {
        position: absolute;
        left: .75rem;
        right: .75rem;
        z-index: 1030;
        margin-top: .25rem;
        padding: .5rem;
        border: 1px solid rgba(255, 255, 255, .12);
        border-radius: .5rem;
        background: var(--bs-tertiary-bg);
        box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .25);
    }

    .admin-main {
        display: block !important;
        padding: 1rem !important;
    }

    .admin-content,
    .admin-content.w-75,
    .admin-content.w-100 {
        width: 100% !important;
    }

    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl,
    .container-xxl {
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
    }

    .card {
        border-radius: .75rem !important;
    }

    .card-body,
    .card-header,
    .card-footer {
        padding: .875rem !important;
    }

    .row {
        --bs-gutter-x: .75rem;
    }

    .d-flex.flex-wrap,
    .card-header.d-flex,
    form.row,
    .slots-toolbar {
        gap: .5rem !important;
    }

    .btn-group {
        display: flex;
        width: 100%;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    .btn-group > .btn {
        flex: 0 0 auto;
    }

    .form-control,
    .form-select,
    .input-group,
    .ql-toolbar,
    .ql-container {
        max-width: 100%;
    }

    input[style*="width"],
    select[style*="width"],
    textarea[style*="width"],
    .form-control[style*="width"],
    .form-select[style*="width"],
    .input-group[style*="width"] {
        width: 100% !important;
    }

    div[style*="width"] > .form-control,
    div[style*="width"] > .form-select {
        min-width: 0;
    }

    [style*="max-width"] {
        max-width: 100% !important;
    }

    [style*="flex:0 0"],
    [style*="flex: 0 0"] {
        flex-basis: 100% !important;
    }

    .d-grid[style*="grid-template-columns"],
    [style*="grid-template-columns"] {
        grid-template-columns: 1fr !important;
    }

    .flex-nowrap:not(.btn-group) {
        flex-wrap: wrap !important;
    }

    .w-25,
    .w-50,
    .w-75 {
        width: 100% !important;
    }

    .table-responsive,
    .card-body:has(> .table),
    .card-body:has(> table) {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .table {
        min-width: 680px;
    }

    .fixed-table {
        min-width: 780px;
    }

    .users-table,
    .top-players-table {
        min-width: 0 !important;
        border-collapse: separate;
        border-spacing: 0 .65rem;
    }

    .users-table thead,
    .top-players-table thead {
        display: none;
    }

    .users-table tbody,
    .top-players-table tbody {
        display: block;
    }

    .users-table tbody tr {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: .65rem .75rem;
        margin-bottom: .75rem;
        padding: .75rem;
        border: 1px solid rgba(255, 255, 255, .12);
        border-radius: .75rem;
        background: rgba(255, 255, 255, .045) !important;
    }

    .users-table tbody td,
    .top-players-table tbody td {
        display: block;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        min-width: 0;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }

    .users-table tbody td::before,
    .top-players-table tbody td::before {
        content: attr(data-label);
        display: block;
        margin-bottom: .15rem;
        color: rgba(255, 255, 255, .55);
        font-size: .72rem;
        line-height: 1.15;
    }

    .users-table .td-ellipsis {
        display: block;
        max-width: none;
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
        overflow-wrap: anywhere;
        line-height: 1.25;
    }

    .users-table .user-cell-id {
        order: 1;
    }

    .users-table .user-cell-username {
        order: 2;
    }

    .users-table .user-cell-full_name {
        order: 3;
    }

    .users-table .user-cell-balance {
        order: 4;
    }

    .users-table .user-cell-wagers_sum {
        order: 5;
    }

    .users-table .user-cell-created_at {
        order: 6;
    }

    .top-players-table tbody tr {
        display: block;
        margin-bottom: .75rem;
        padding: .75rem;
        border: 1px solid rgba(255, 255, 255, .12);
        border-radius: .75rem;
        background: rgba(255, 255, 255, .045) !important;
    }

    .top-players-table tbody td {
        display: flex;
        justify-content: space-between;
        gap: .75rem;
        padding: .25rem 0 !important;
        line-height: 1.25;
    }

    .top-players-table tbody td::before {
        flex: 0 0 auto;
        margin: 0;
    }

    .top-players-table .top-player-user {
        display: block;
        padding-bottom: .45rem !important;
        margin-bottom: .35rem;
        border-bottom: 1px solid rgba(255, 255, 255, .1) !important;
    }

    .top-players-table .top-player-user::before {
        margin-bottom: .15rem;
    }

    .chart-wrap {
        height: 320px !important;
        padding: .75rem !important;
    }

    .stat-card {
        height: auto !important;
        min-height: 84px;
        padding: 12px !important;
    }

    .stat-card .name {
        font-size: 1.25rem !important;
        line-height: 1.15 !important;
        overflow-wrap: anywhere;
    }

    .stat-card .description {
        font-size: .9rem !important;
    }

    .game-card,
    .slot-card {
        min-width: 0;
    }

    .slot-card {
        align-items: stretch !important;
    }

    .slot-card .d-flex {
        min-width: 0;
    }

    .slot-title,
    .slot-meta,
    .td-ellipsis,
    .wallet-address,
    .wallet-meta,
    .chat-title {
        overflow-wrap: anywhere;
    }

    .wallet-row {
        display: flex;
        gap: .5rem;
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .modal-dialog {
        margin: .5rem auto;
    }

    .toast {
        left: .75rem;
        right: .75rem;
        width: auto;
    }

    .user-profile-card {
        overflow: hidden;
    }

    .user-profile-card .user-action-row {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: .5rem;
        padding-right: 0 !important;
    }

    .user-profile-card .user-action-row > .btn,
    .user-profile-card .user-action-row > a.btn {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 100% !important;
        min-height: 34px;
        white-space: normal;
        line-height: 1.15;
    }

    .user-profile-card > .d-flex.align-items-center.mb-1 {
        align-items: stretch !important;
        flex-wrap: wrap;
        gap: .35rem .5rem;
    }

    .user-profile-card > .d-flex.align-items-center.mb-1 > label,
    .user-profile-card > .d-flex.align-items-center.mb-1 > span:first-child {
        width: 100%;
        margin-right: 0 !important;
    }

    .user-profile-card > .d-flex.align-items-center.mb-1 > .input-group {
        flex: 1 1 100%;
        width: 100% !important;
    }

    .user-profile-card .input-group .btn {
        flex: 0 0 auto;
    }

    .user-profile-card #win-rate-mode {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: 100%;
    }

    .user-profile-card #win-rate-mode.d-none {
        display: none !important;
    }

    .user-profile-card #notes-panel {
        position: static !important;
        width: 100% !important;
        min-height: 0;
        margin-top: 1rem;
        border-left: 0 !important;
        border-top: 1px solid rgba(255, 255, 255, .1);
    }

    .user-profile-card #notes-list {
        max-height: 240px;
    }

    .utm-toolbar {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch !important;
        gap: .5rem !important;
    }

    .utm-toolbar #utm-search,
    .utm-toolbar .btn-group {
        grid-column: 1 / -1;
    }

    .utm-toolbar #utmDatePicker,
    .utm-toolbar #utm-sort {
        width: 100% !important;
        max-width: none !important;
    }

    .utm-toolbar .btn-group {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .utm-toolbar .btn {
        padding-left: .35rem;
        padding-right: .35rem;
    }

    .utm-detail-page.container,
    .key-detail-page.container {
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
    }

    .utm-detail-page .card,
    .key-detail-page .card {
        overflow: hidden;
    }

    .utm-detail-page code,
    .key-detail-page code,
    .chat-detail-card a,
    .chat-card a {
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .utm-detail-stats .d-grid[style*="grid-template-columns"] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: .55rem !important;
        text-align: center;
    }

    .utm-detail-stats .d-grid[style*="grid-template-columns"] > div {
        min-width: 0;
        padding: .55rem;
        border: 1px solid rgba(255, 255, 255, .1);
        border-radius: .55rem;
        background: rgba(255, 255, 255, .035);
        overflow-wrap: anywhere;
    }

    .utm-detail-stats .fw-semibold {
        margin-top: .85rem;
        text-align: center;
    }

    .utm-expenses-card {
        max-width: 100% !important;
    }

    .utm-user-row {
        text-align: center;
    }

    .utm-user-row-body {
        justify-content: center !important;
    }

    .utm-user-row-body > div {
        flex: 1 1 100%;
        min-width: 0;
    }

    .utm-user-money {
        text-align: center !important;
    }

    .chats-filter-card #filter-form {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .75rem !important;
    }

    .chats-filter-card #filter-form > .col-auto {
        width: 100%;
    }

    .chats-filter-card #filter-form .form-label {
        margin-bottom: .25rem;
    }

    .chats-filter-card #filter-form input:not([type="checkbox"]):not([type="radio"]),
    .chats-filter-card #filter-form select {
        width: 100% !important;
        max-width: none !important;
    }

    .chat-quick-group {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        width: 100%;
    }

    .chat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: .75rem !important;
    }

    .chat-card {
        min-width: 0;
        padding: .75rem !important;
    }

    .chat-card .chat-content,
    .chat-card .chat-flags {
        min-width: 0;
    }

    .chat-card .chat-flags {
        flex-wrap: wrap;
        justify-content: center;
    }

    .chat-detail-card .chat-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .chat-detail-card .chat-kv {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .chat-detail-card .chat-kv-item,
    .chat-detail-card .chat-kv-value,
    .chat-detail-card .lang-select {
        min-width: 0;
    }

    .chat-detail-card .chat-flags {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .5rem;
    }

    .chat-detail-card .flag {
        justify-content: center;
        text-align: center;
        min-width: 0;
        white-space: normal;
    }

    .chat-stats-card > .d-flex,
    .chat-stats-card > .d-flex > .d-flex,
    .chat-games-card > .d-flex,
    .chat-games-card > .d-flex > .d-flex {
        align-items: stretch !important;
        width: 100%;
    }

    .chat-stats-card .btn-group,
    .referrals-page .btn-group,
    .referrals-chart-card .btn-group,
    .referrals-table-card .btn-group {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }

    .chat-stats-card .btn-group .btn,
    .referrals-page .btn-group .btn,
    .referrals-chart-card .btn-group .btn,
    .referrals-table-card .btn-group .btn {
        white-space: normal;
        line-height: 1.15;
    }

    .chat-games-card .form-check,
    .chat-stats-card .form-check,
    .key-detail-page .form-check,
    .referrals-table-card .form-check {
        display: flex;
        align-items: center;
        gap: .45rem;
        min-width: 0;
        padding-left: 0;
    }

    .chat-games-card .form-switch .form-check-input,
    .chat-stats-card .form-switch .form-check-input,
    .key-detail-page .form-switch .form-check-input,
    .referrals-table-card .form-switch .form-check-input {
        flex: 0 0 auto;
        margin-left: 0;
        margin-top: 0;
    }

    .chat-games-card .form-check-label,
    .chat-stats-card .form-check-label,
    .key-detail-page .form-check-label,
    .referrals-table-card .form-check-label {
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .key-detail-page .d-flex.flex-nowrap.justify-content-between {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .5rem .75rem;
    }

    .key-detail-page .table {
        min-width: 0 !important;
    }

    .key-detail-page .table tbody tr {
        display: grid;
        grid-template-columns: minmax(100px, .42fr) minmax(0, 1fr);
    }

    .key-detail-page .table th,
    .key-detail-page .table td {
        display: block;
        min-width: 0;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .referrals-page > .d-flex,
    .referrals-chart-card > .d-flex,
    .referrals-table-card > .d-flex {
        align-items: stretch !important;
    }

    .referrals-page input,
    .referrals-page select,
    .referrals-table-card input,
    .referrals-table-card select {
        width: 100% !important;
        max-width: none !important;
    }

    .referrals-page + .row.row-cols-1.row-cols-md-2.row-cols-xl-5 > * {
        width: 50%;
    }

    #ai-layout {
        flex-direction: column;
        height: calc(100vh - 1.5rem);
        gap: .75rem;
    }

    #ai-sidebar {
        width: 100% !important;
        max-height: 220px;
        min-height: 140px;
    }

    #ai-main {
        min-height: 0;
        flex: 1 1 auto;
    }

    #messages-container {
        min-height: 0;
    }

    .msg-user,
    .msg-ai {
        max-width: 100% !important;
    }

    #input-area {
        padding: .65rem !important;
    }
}

@media (max-width: 575.98px) {
    .admin-sidebar {
        padding: .75rem !important;
    }

    .admin-main {
        padding: .75rem !important;
    }

    .btn,
    .form-control,
    .form-select,
    .input-group-text {
        font-size: .875rem;
    }

    .card-body,
    .card-header,
    .card-footer {
        padding: .75rem !important;
    }

    .modal-body,
    .modal-header,
    .modal-footer {
        padding: .75rem;
    }

    .keyboard-row,
    .color-picker {
        overflow-x: auto;
    }

    .row-cols-2 > * {
        width: 100%;
    }

    .users-table tbody tr {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: .6rem;
    }

    .users-table tbody td::before,
    .top-players-table tbody td::before {
        font-size: .68rem;
    }

    .d-flex:not(.admin-shell):not(.admin-nav):not(.nav):not(.btn-group):not(.toast .d-flex) {
        min-width: 0;
    }

    .cashier-card > .d-flex,
    .settings-card .col,
    .balance-reminder-card .d-flex,
    .top-player-reward-card .d-flex,
    .chat-autoaccept-card .d-flex {
        align-items: stretch !important;
        flex-direction: column;
    }

    .cashier-card label,
    .settings-card label,
    .balance-reminder-card label,
    .top-player-reward-card label,
    .chat-autoaccept-card label {
        width: 100%;
    }

    .user-profile-card {
        padding: .85rem !important;
    }

    .user-profile-card p {
        overflow-wrap: anywhere;
    }

    .user-profile-card .user-action-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .user-profile-card .input-group {
        flex-wrap: nowrap;
    }

    .user-profile-card .input-group > .form-control {
        min-width: 0;
    }

    .user-profile-card .form-check-label,
    .user-profile-card .btn {
        font-size: .8rem;
    }

    .user-profile-card #notes-panel .p-3,
    .user-profile-card #notes-list {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .utm-create-card {
        padding: .85rem !important;
    }

    .utm-toolbar .btn-group {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .utm-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .55rem;
    }

    .utm-list-card {
        padding: .65rem !important;
    }

    .utm-list-card strong {
        font-size: .86rem;
        line-height: 1.15;
    }

    .utm-metrics {
        grid-template-columns: 1fr;
        gap: .12rem;
        font-size: .72rem;
    }

    .utm-detail-stats .d-grid[style*="grid-template-columns"] {
        grid-template-columns: 1fr !important;
        text-align: center;
    }

    .utm-detail-stats .fw-semibold {
        text-align: center;
    }

    .chats-filter-card #filter-form,
    .chat-detail-card .chat-kv,
    .chat-detail-card .chat-flags,
    .chat-grid {
        grid-template-columns: 1fr !important;
    }

    .chat-quick-group {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .chat-stats-card .btn-group,
    .referrals-page .btn-group,
    .referrals-chart-card .btn-group,
    .referrals-table-card .btn-group {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .key-detail-page .d-flex.flex-nowrap.justify-content-between {
        grid-template-columns: 1fr;
    }

    .referrals-page + .row.row-cols-1.row-cols-md-2.row-cols-xl-5 > * {
        width: 50%;
    }

    #ai-sidebar {
        max-height: 190px;
    }

    #chat-header,
    #messages-container {
        padding: .75rem !important;
    }
}

@media (min-width: 430px) and (max-width: 575.98px) {
    .user-profile-card .user-action-row {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

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

    .utm-detail-stats .d-grid[style*="grid-template-columns"] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        text-align: center;
    }
}