.inventory-container {
            background-color: #1b2a3a;
            color: white;
            padding: 20px;
            display: flex;
            flex-direction: column;
            gap: 20px;
        }

        .side-switcher-container {
            width: 100%;
            background: #1b2a3a;
            padding: 15px;
            border-radius: 10px;
            margin-bottom: 10px;
        }

        .inventory-content {
            display: flex;
            justify-content: space-between;
            gap: 20px;
        }
        .character {
            width: 20%;
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .items {
            width: 55%;
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 10px;
        }
        .items-modal {
            width: 100%;
            display: grid;
            grid-template-columns: repeat(5, 1fr);
            gap: 10px;
        }
        .side-items {
            display: flex;
            flex-direction: column;
            gap: 10px;
            margin-bottom: 10px;
        }
        .skins {
            margin-top: 20px;
            background: #2a3b4d;
            padding: 15px;
            border-radius: 10px;
        }
        .weapon-slot, .skin-slot {
            background: #2a3b4d;
            padding: 10px;
            border-radius: 10px;
            text-align: center;
            align-content: center;
        }
        .side-slot{
            background: #2a3b4d;
            padding: 10px;
            border-radius: 10px;
            text-align: center;
            width: 64px;
            height: 64px;
            align-content: center;
        }

        .weapon-slot img, .skin-slot img, .side-slot img {
            max-width: 100%;
        }

        .select-button {
            background-color: #3e6b91; /* Зеленый цвет кнопки */
            color: white;
            border: none;
            padding: 8px 16px;
            border-radius: 4px;
            cursor: pointer;
            font-size: 14px;
            transition: background-color 0.3s ease;
        }

        .select-button:hover {
            background-color: #2c4d69; /* Темнее при наведении */
        }
        
        .skin-name {
            font-size: 12px;
            margin-top: 5px;
            word-break: break-word;
        }
        
        .side-switcher {
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .side-header {
            margin-bottom: 15px;
            width: 100%;
            text-align: center;
        }

        .side-title {
            color: #fff;
            font-size: 18px;
            font-weight: bold;
            text-transform: uppercase;
            letter-spacing: 1px;
            position: relative;
            padding-bottom: 5px;
        }

        .side-title:after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 25%;
            width: 50%;
            height: 2px;
            background: linear-gradient(90deg, transparent, #3e6b91, transparent);
        }

        .side-buttons {
            display: flex;
            justify-content: center;
            gap: 30px;
        }

        .side-button {
            background: none;
            border: none;
            cursor: pointer;
            padding: 10px;
            margin: 0;
            opacity: 0.6;
            transition: all 0.3s;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .side-button.active {
            opacity: 1;
            transform: scale(1.1);
        }

        .side-button img {
            width: 64px;
            height: 64px;
            margin-bottom: 8px;
            transition: transform 0.3s;
        }

        .side-button:hover img {
            transform: scale(1.1);
        }

        .side-label {
            color: #fff;
            font-size: 14px;
            font-weight: 500;
            margin-top: 5px;
            text-transform: uppercase;
            letter-spacing: 0.5px;
        }

        /* Дополнительные стили только для блока текущего скина */
    .current-skin-row {
        grid-column: 1 / -1;
        display: flex;
        background: #2a3b4d;
        padding: 15px;
        border-radius: 10px;
        margin-bottom: 15px;
        gap: 15px;
    }
    
    .current-skin-left {
        display: flex;
        align-items: center;
        gap: 15px;
        flex: 0 0 20%;
        flex-direction: column;
    }
    
    .current-skin-image {
        width: 120px;
        height: 90px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .current-skin-image img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }
    
    .current-skin-info {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    
    .current-skin-right {
        display: flex;
        flex: 1;
        gap: 15px;
    }
    
    .current-skin-settings {
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    
    .setting-row {
        display: flex;
        align-items: center;
        gap: 10px;
    }
    
    .setting-row .form-control {
        flex: 1;
        background: #1b2a3a;
        border: 1px solid #1b2a3a;
        color: white;
        padding: 8px 12px;
        border-radius: 4px;
    }
    
    .checkbox-label {
        display: flex;
        align-items: center;
        gap: 5px;
        color: white;
        font-size: 14px;
    }
    
    .save-button {
        margin-left: auto;
    }
    
    .current-skin-slots {
        display: flex;
        flex-direction: column;
        gap: 5px;
        width: 80px;
    }
    
    .side-slot-preview {
        width: 100%;
        height: 30px;
        background: #1b2a3a;
        border-radius: 4px;
        border: 1px solid #3e6b91;
    }
    
    /* Адаптация для мобильных устройств */
    @media (max-width: 768px) {
        .current-skin-row {
            flex-direction: column;
        }
        
        .current-skin-left {
            flex: 1;
            width: 100%;
        }
        
        .current-skin-right {
            flex-direction: column;
        }
        
        .current-skin-slots {
            flex-direction: row;
            width: 100%;
            margin-top: 10px;
        }
        
        .side-slot-preview {
            height: 25px;
        }
    }

.current-skin-row {
    display: flex;
    gap: 20px;
    margin-bottom: 30px;
    padding: 20px;
    background: #2d3748;
    border-radius: 10px;
}

.current-skin-left {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 15px;
}

.current-skin-image img {
    width: 100px;
    height: 75px;
    object-fit: contain;
}

.current-skin-info {
    flex: 1;
}

.current-skin-right {
    flex: 2;
}

.current-skin-settings {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.setting-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.setting-row .form-control {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid #4a5568;
    border-radius: 4px;
    background: #1a202c;
    color: white;
}

.checkbox-label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.notification {
    position: fixed;
    top: 20px;
    right: 20px;
    padding: 15px;
    border-radius: 5px;
    z-index: 10000;
    color: white;
}

.notification.success {
    background: #48bb78;
}

.notification.error {
    background: #f56565;
}

.current-skin-settings {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.setting-row {
    display: flex;
    align-items: flex-start;
}

.setting-with-label {
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: 100%;
}

.setting-label {
    font-weight: 600;
    color: #e2e8f0;
    font-size: 14px;
    margin-bottom: 2px;
}

.setting-description {
    font-size: 12px;
    color: #a0aec0;
    margin-top: 3px;
}

.form-control {
    padding: 10px 12px;
    border: 2px solid #4a5568;
    border-radius: 6px;
    background: #2d3748;
    color: white;
    font-size: 14px;
    transition: border-color 0.2s ease;
}

.form-control:focus {
    outline: none;
    border-color: #4299e1;
    box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.1);
}

.checkbox-container {
    display: flex;
    align-items: center;
}

.checkbox-label {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    padding: 8px 0;
    color: #e2e8f0;
}

.checkbox-custom {
    width: 18px;
    height: 18px;
    border: 2px solid #4a5568;
    border-radius: 4px;
    background: #2d3748;
    position: relative;
    transition: all 0.2s ease;
}

.stattrak-checkbox:checked + .checkbox-custom {
    background: #48bb78;
    border-color: #48bb78;
}

.stattrak-checkbox:checked + .checkbox-custom::after {
    content: '✓';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 12px;
    font-weight: bold;
}

.stattrak-checkbox {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.save-settings-button {
    padding: 12px 24px;
    background: linear-gradient(45deg, #48bb78, #38a169);
    color: white;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 8px;
}

.save-settings-button:hover {
    background: linear-gradient(45deg, #38a169, #2f855a);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(72, 187, 120, 0.2);
}

.save-settings-button:active {
    transform: translateY(0);
}

/* Адаптивность для мобильных устройств */
@media (max-width: 768px) {
    .current-skin-row {
        flex-direction: column;
        gap: 15px;
    }
    
    .current-skin-right {
        width: 100%;
    }
    
    .setting-row {
        flex-direction: column;
    }
    
    .form-control {
        padding: 12px;
    }
}

/* Стили для полей ввода чисел */
input[type="number"] {
    -moz-appearance: textfield;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Иконки (если используете Bootstrap Icons) */
@import url('/static/vendor/bootstrap-icons/bootstrap-icons.css');

/* Слоты наклеек */
.sticker-slots {
    display: flex;
    gap: 4px;
    justify-content: center;
    margin-top: 6px;
    flex-wrap: wrap;
}

.sticker-slot {
    width: 36px;
    height: 36px;
    border: 1.5px dashed rgba(255,255,255,0.25);
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: rgba(255,255,255,0.04);
    transition: border-color 0.2s, background 0.2s;
    position: relative;
    overflow: hidden;
}

.sticker-slot:hover {
    border-color: rgba(255,255,255,0.55);
    background: rgba(255,255,255,0.1);
}

.sticker-slot.has-sticker {
    border-color: rgba(100,180,255,0.5);
}

.sticker-slot img {
    width: 30px;
    height: 30px;
    object-fit: contain;
}

.sticker-empty-icon {
    color: rgba(255,255,255,0.3);
    font-size: 18px;
    line-height: 1;
}

/* Карточки наклеек в модалке */
.sticker-card {
    background: #2a2a3e;
    border-radius: 8px;
    padding: 8px;
    text-align: center;
    cursor: pointer;
    transition: background 0.2s, transform 0.1s;
    border: 2px solid transparent;
}

.sticker-card:hover {
    background: #3a3a5e;
    transform: scale(1.03);
}

.sticker-card img {
    width: 70px;
    height: 70px;
    object-fit: contain;
}

.sticker-card .sticker-card-name {
    color: #ccc;
    font-size: 10px;
    margin-top: 5px;
    line-height: 1.3;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* Stage 5 redesign fit: keep existing skinchanger DOM/JS, refresh the visual shell. */
body.redesign .inventory-container {
    background: transparent;
    color: var(--rd-text);
    padding: 0;
    gap: 16px;
}

body.redesign .side-switcher-container {
    width: 100%;
    margin-bottom: 0;
    padding: 16px;
    border: 1px solid var(--rd-border);
    border-radius: var(--rd-radius);
    background: var(--rd-surface);
    box-shadow: 0 18px 60px rgba(0, 0, 0, .18);
}

body.redesign .inventory-content {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr) 220px;
    gap: 16px;
    align-items: start;
}

body.redesign .character {
    width: 100%;
    gap: 12px;
}

body.redesign .items {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(156px, 1fr));
    gap: 10px;
    padding: 14px;
    border: 1px solid var(--rd-border);
    border-radius: var(--rd-radius);
    background: var(--rd-surface);
}

body.redesign .side-items {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

body.redesign .weapon-slot,
body.redesign .skin-slot,
body.redesign .side-slot {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--rd-border);
    border-radius: 10px;
    background: var(--rd-bg-soft);
    color: var(--rd-text);
    cursor: pointer;
    transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}

body.redesign .weapon-slot {
    min-height: 172px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 10px;
}

body.redesign .weapon-slot::before,
body.redesign .side-slot::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 50% 18%, rgba(232, 118, 42, .12), transparent 56%);
    pointer-events: none;
}

body.redesign .weapon-slot:hover,
body.redesign .skin-slot:hover,
body.redesign .side-slot:hover {
    transform: translateY(-2px);
    border-color: var(--rd-accent);
    box-shadow: 0 14px 36px rgba(0, 0, 0, .24);
}

body.redesign .side-slot {
    width: 100%;
    height: 112px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
}

body.redesign .weapon-slot img,
body.redesign .skin-slot img,
body.redesign .side-slot img {
    position: relative;
    z-index: 1;
    max-width: 132%;
    max-height: 92px;
    object-fit: contain;
    filter: drop-shadow(0 15px 20px rgba(0, 0, 0, .35));
}

body.redesign .side-slot img {
    max-width: 100%;
    max-height: 82px;
}

body.redesign .skin-name {
    position: relative;
    z-index: 1;
    min-height: 31px;
    margin-top: 8px;
    color: var(--rd-text);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
}

body.redesign .sticker-slots {
    position: relative;
    z-index: 1;
}

body.redesign .side-title {
    color: var(--rd-text);
    font-family: var(--rd-font-head);
    font-size: 18px;
    letter-spacing: .06em;
}

body.redesign .side-title::after {
    background: linear-gradient(90deg, transparent, var(--rd-accent), transparent);
}

body.redesign .side-buttons {
    gap: 8px;
    flex-wrap: wrap;
}

body.redesign .side-button {
    min-width: 150px;
    padding: 9px 12px;
    border: 1px solid var(--rd-border);
    border-radius: var(--rd-radius-sm);
    background: var(--rd-bg-soft);
    opacity: 1;
}

body.redesign .side-button.active {
    border-color: var(--rd-accent);
    background: rgba(232, 118, 42, .12);
    color: var(--rd-accent);
    transform: none;
}

body.redesign .side-button img {
    width: 44px;
    height: 44px;
}

body.redesign .side-label {
    color: var(--rd-muted);
    font-family: var(--rd-font-head);
    font-size: 12px;
    letter-spacing: .04em;
}

body.redesign .side-button.active .side-label {
    color: var(--rd-accent);
}

body.redesign .select-button,
body.redesign .save-settings-button {
    border: 1px solid var(--rd-accent);
    border-radius: var(--rd-radius-sm);
    background: var(--rd-accent);
    color: #fff;
    font-family: var(--rd-font-head);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .04em;
}

body.redesign .select-button:hover,
body.redesign .save-settings-button:hover {
    background: var(--rd-accent-2);
    border-color: var(--rd-accent-2);
}

body.redesign .items-modal {
    grid-template-columns: repeat(auto-fill, minmax(136px, 1fr));
    gap: 10px;
}

body.redesign .current-skin-row,
body.redesign .skins {
    border: 1px solid var(--rd-border);
    border-radius: var(--rd-radius);
    background: var(--rd-surface);
}

body.redesign .setting-row .form-control,
body.redesign .form-control {
    border: 1px solid var(--rd-border);
    border-radius: var(--rd-radius-sm);
    background: var(--rd-bg-soft);
    color: var(--rd-text);
}

body.redesign .form-control:focus {
    border-color: var(--rd-accent);
    box-shadow: 0 0 0 3px rgba(232, 118, 42, .12);
}

body.redesign .sticker-slot,
body.redesign .sticker-card {
    border-color: var(--rd-border);
    background: var(--rd-bg-soft);
}

body.redesign .sticker-slot:hover,
body.redesign .sticker-card:hover {
    border-color: var(--rd-accent);
    background: var(--rd-surface-2);
}

body.redesign .notification {
    border: 1px solid var(--rd-border);
    border-radius: var(--rd-radius-sm);
    box-shadow: 0 16px 48px rgba(0, 0, 0, .4);
}

@media (max-width: 1160px) {
    body.redesign .inventory-content {
        grid-template-columns: 1fr;
    }

    body.redesign .side-items {
        grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    }
}

@media (max-width: 760px) {
    body.redesign .items {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 10px;
    }

    body.redesign .weapon-slot {
        min-height: 160px;
    }

    body.redesign .side-button {
        width: 100%;
    }
}

/* Skinchanger polish pass: warmer graphite palette and redesigned modals. */
body.redesign .rd-changer-page {
    padding-top: 26px;
    background:
        radial-gradient(circle at 18% 18%, rgba(232, 118, 42, .08), transparent 24%),
        radial-gradient(circle at 86% 42%, rgba(245, 200, 66, .04), transparent 26%);
}

body.redesign .inventory-container {
    gap: 18px;
}

body.redesign .side-switcher-container,
body.redesign .items {
    border-color: rgba(232, 118, 42, .18);
    background:
        linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012)),
        #10100f;
    box-shadow: 0 22px 70px rgba(0, 0, 0, .34);
}

body.redesign .side-switcher-container {
    padding: 22px;
}

body.redesign .side-title {
    font-size: 20px;
    color: #f4f0ea;
}

body.redesign .side-title::after {
    left: 35%;
    width: 30%;
    height: 3px;
    background: linear-gradient(90deg, transparent, rgba(232, 118, 42, .92), transparent);
}

body.redesign .side-buttons {
    gap: 12px;
}

body.redesign .side-button {
    min-width: 190px;
    min-height: 122px;
    justify-content: center;
    border-color: rgba(255,255,255,.08);
    background:
        radial-gradient(circle at 50% 12%, rgba(232,118,42,.08), transparent 52%),
        #0b0d12;
}

body.redesign .side-button.active {
    border-color: rgba(232, 118, 42, .9);
    background:
        radial-gradient(circle at 50% 20%, rgba(232,118,42,.26), transparent 58%),
        linear-gradient(180deg, rgba(232,118,42,.14), rgba(232,118,42,.04)),
        #11100f;
    box-shadow: inset 0 0 0 1px rgba(232,118,42,.16), 0 16px 38px rgba(0,0,0,.24);
}

body.redesign .items {
    gap: 12px;
    padding: 18px;
}

body.redesign .weapon-slot,
body.redesign .skin-slot,
body.redesign .side-slot {
    border-color: rgba(255,255,255,.08);
    background:
        radial-gradient(circle at 54% 28%, rgba(232,118,42,.12), transparent 44%),
        linear-gradient(180deg, #111217, #080a0e);
}

body.redesign .weapon-slot::before,
body.redesign .side-slot::before {
    background:
        linear-gradient(135deg, rgba(255,255,255,.06), transparent 34%),
        radial-gradient(circle at 50% 18%, rgba(232,118,42,.11), transparent 58%);
}

body.redesign .weapon-slot:hover,
body.redesign .skin-slot:hover,
body.redesign .side-slot:hover {
    border-color: rgba(232, 118, 42, .72);
    box-shadow: 0 18px 46px rgba(0,0,0,.36), 0 0 0 1px rgba(232,118,42,.08);
}

body.redesign .character > .weapon-slot {
    min-height: 184px;
}

body.redesign .skin-name {
    color: #f0eee9;
    text-shadow: 0 1px 12px rgba(0,0,0,.5);
}

body.redesign .sticker-slot {
    border-color: rgba(232,118,42,.22);
    background: rgba(0,0,0,.24);
}

body.redesign .current-skin-row,
body.redesign .skins {
    border-color: rgba(232, 118, 42, .2);
    background:
        linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01)),
        #10100f;
}

body.redesign .setting-label,
body.redesign .checkbox-label,
body.redesign .sticker-card .sticker-card-name {
    color: #d8d3ca;
}

body.redesign .modal.fade .modal-dialog {
    transform: translateY(8px) scale(.98);
    transition: transform .18s ease-out;
}

body.redesign .modal.show .modal-dialog {
    transform: none;
}

body.redesign #skinsModal .modal-dialog,
body.redesign #stickerModal .modal-dialog {
    max-width: min(1120px, calc(100vw - 28px));
}

body.redesign #skinsModal .modal-content,
body.redesign #stickerModal .modal-content {
    overflow: hidden;
    border: 1px solid rgba(232, 118, 42, .32);
    border-radius: 16px;
    background:
        radial-gradient(circle at 15% 0%, rgba(232, 118, 42, .16), transparent 30%),
        linear-gradient(145deg, #15120f, #090b10 72%);
    box-shadow: 0 30px 100px rgba(0,0,0,.68);
}

body.redesign #skinsModal .modal-header,
body.redesign #stickerModal .modal-header {
    padding: 16px 20px;
    border-bottom: 1px solid rgba(232, 118, 42, .18);
    background: rgba(0,0,0,.28);
}

body.redesign #skinsModal .modal-title,
body.redesign #stickerModal .modal-title {
    color: #f5f1ea;
    font-family: var(--rd-font-head);
    font-size: 20px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

body.redesign #skinsModal .modal-body,
body.redesign #stickerModal .modal-body {
    padding: 18px;
    color: #e9e3d9;
}

body.redesign #stickerModal .modal-footer {
    border-top: 1px solid rgba(232, 118, 42, .18);
    background: rgba(0,0,0,.2);
}

body.redesign #skinsModalBody .items-modal,
body.redesign #stickerModalBody {
    border: 0;
    background: transparent;
}

body.redesign #skinsModal .current-skin-row {
    margin-bottom: 18px;
    padding: 18px;
}

body.redesign #skinsModal .weapon-slot,
body.redesign #skinsModal .skin-slot,
body.redesign #stickerModal .sticker-card {
    background:
        radial-gradient(circle at 50% 20%, rgba(232,118,42,.12), transparent 56%),
        #0c0d11;
}

body.redesign #skinsModal .btn-close,
body.redesign #stickerModal .btn-close {
    opacity: .95;
    filter: invert(1) grayscale(100%) brightness(180%);
}

body.redesign .select-button.active {
    border-color: rgba(232,118,42,.95);
    background: rgba(232,118,42,.22);
    color: var(--rd-accent);
}

body.redesign .select-button,
body.redesign .save-settings-button {
    box-shadow: 0 10px 28px rgba(232,118,42,.16);
}

body.redesign .select-button.btn-secondary,
body.redesign .btn-secondary {
    border-color: rgba(255,255,255,.1);
    background: #111217;
    color: #e6ded3;
}

@media (max-width: 760px) {
    body.redesign .rd-changer-page {
        padding-top: 16px;
    }

    body.redesign .side-switcher-container,
    body.redesign .items {
        padding: 14px;
    }

    body.redesign .side-button {
        min-width: 0;
        min-height: 104px;
    }
}

/* Skinchanger final refinement: calm editor surface, no decorative glow noise. */
body.redesign .rd-changer-page {
    max-width: 1760px;
    padding: 28px 24px 84px;
    background: none;
}

body.redesign .inventory-container {
    gap: 16px;
}

body.redesign .side-switcher-container,
body.redesign .items,
body.redesign .current-skin-row,
body.redesign .skins {
    border: 1px solid #242b38;
    background: #10141c;
    box-shadow: none;
}

body.redesign .side-switcher-container {
    padding: 14px 16px;
    border-radius: 12px;
}

body.redesign .side-switcher {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 18px;
    align-items: center;
}

body.redesign .side-header {
    width: auto;
    margin: 0;
    text-align: left;
}

body.redesign .side-title {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #e9edf5;
    font-size: 15px;
    line-height: 1;
    letter-spacing: .08em;
}

body.redesign .side-title::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--rd-accent);
}

body.redesign .side-title::after {
    display: none;
}

body.redesign .side-buttons {
    justify-content: flex-end;
    gap: 8px;
}

body.redesign .side-button {
    min-width: 152px;
    min-height: 58px;
    flex-direction: row;
    gap: 10px;
    justify-content: flex-start;
    padding: 9px 12px;
    border-color: #283142;
    border-radius: 10px;
    background: #0b0f16;
    box-shadow: none;
}

body.redesign .side-button img {
    width: 34px;
    height: 34px;
    margin: 0;
    filter: none;
}

body.redesign .side-button:hover {
    border-color: #3a4558;
    background: #0f141d;
}

body.redesign .side-button.active {
    border-color: rgba(232, 118, 42, .72);
    background: rgba(232, 118, 42, .08);
    box-shadow: inset 0 0 0 1px rgba(232, 118, 42, .08);
}

body.redesign .side-label {
    margin: 0;
    color: #98a1b3;
    font-size: 12px;
}

body.redesign .side-button.active .side-label {
    color: #f0a060;
}

body.redesign .inventory-content {
    grid-template-columns: 250px minmax(0, 1fr) 250px;
    gap: 16px;
}

body.redesign .items {
    gap: 10px;
    padding: 14px;
    border-radius: 12px;
}

body.redesign .weapon-slot,
body.redesign .skin-slot,
body.redesign .side-slot {
    border: 1px solid #252d3b;
    border-radius: 10px;
    background: #0b0f15;
    box-shadow: none;
}

body.redesign .weapon-slot::before,
body.redesign .side-slot::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,0));
    pointer-events: none;
}

body.redesign .weapon-slot:hover,
body.redesign .skin-slot:hover,
body.redesign .side-slot:hover {
    transform: translateY(-1px);
    border-color: #4b566c;
    background: #0e131b;
    box-shadow: none;
}

body.redesign .side-slot {
    height: 112px;
}

body.redesign .weapon-slot img,
body.redesign .skin-slot img,
body.redesign .side-slot img {
    filter: drop-shadow(0 10px 18px rgba(0,0,0,.28));
}

body.redesign .skin-name {
    color: #e8ebf1;
    text-shadow: none;
}

body.redesign .side-items {
    gap: 10px;
}

body.redesign .character > .weapon-slot {
    min-height: 170px;
}

body.redesign .select-button,
body.redesign .save-settings-button,
body.redesign .btn-buy,
body.redesign .btn-auth {
    box-shadow: none;
}

body.redesign .select-button,
body.redesign .save-settings-button {
    border-color: rgba(232,118,42,.64);
    background: rgba(232,118,42,.12);
    color: #f2a469;
}

body.redesign .select-button:hover,
body.redesign .save-settings-button:hover {
    border-color: rgba(232,118,42,.9);
    background: rgba(232,118,42,.18);
}

body.redesign .select-button.active {
    border-color: rgba(232,118,42,.86);
    background: rgba(232,118,42,.16);
    color: #ffb071;
}

body.redesign #skinsModal .modal-content,
body.redesign #stickerModal .modal-content {
    border-color: #303849;
    background: #10141c;
    box-shadow: 0 24px 80px rgba(0,0,0,.58);
}

body.redesign #skinsModal .modal-header,
body.redesign #stickerModal .modal-header {
    border-bottom-color: #252d3b;
    background: #0b0f16;
}

body.redesign #stickerModal .modal-footer {
    border-top-color: #252d3b;
    background: #0b0f16;
}

body.redesign #skinsModal .weapon-slot,
body.redesign #skinsModal .skin-slot,
body.redesign #stickerModal .sticker-card {
    background: #0b0f15;
}

body.redesign .sticker-slot,
body.redesign .sticker-card {
    border-color: #2a3242;
    background: #0b0f15;
}

body.redesign .sticker-slot:hover,
body.redesign .sticker-card:hover {
    border-color: #4b566c;
    background: #0e131b;
}

@media (max-width: 1160px) {
    body.redesign .inventory-content {
        grid-template-columns: 1fr;
    }

    body.redesign .side-switcher {
        grid-template-columns: 1fr;
    }

    body.redesign .side-buttons {
        justify-content: flex-start;
    }
}

@media (max-width: 760px) {
    body.redesign .rd-changer-page {
        padding: 18px 12px 64px;
    }

    body.redesign .side-buttons {
        display: grid;
        grid-template-columns: 1fr;
    }

    body.redesign .side-button {
        width: 100%;
        min-height: 56px;
    }
}

/* Skinchanger classic visual: closer to the original clean inventory scene. */
body.redesign .rd-changer-page {
    max-width: 1500px;
    margin: 28px auto 0;
    padding: 46px 24px 72px;
    border-radius: 0;
    background: #1b2a3a;
}

body.redesign .inventory-container {
    gap: 34px;
    background: transparent;
}

body.redesign .side-switcher-container {
    padding: 0;
    border: 0;
    background: transparent;
}

body.redesign .side-switcher {
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: center;
}

body.redesign .side-header {
    width: 100%;
    text-align: center;
}

body.redesign .side-title {
    display: inline-block;
    color: #f4f6fb;
    font-size: 22px;
    letter-spacing: .06em;
}

body.redesign .side-title::before {
    display: none;
}

body.redesign .side-title::after {
    display: block;
    left: 25%;
    width: 50%;
    height: 2px;
    background: linear-gradient(90deg, transparent, #3e6b91, transparent);
}

body.redesign .side-buttons {
    justify-content: center;
    gap: 54px;
}

body.redesign .side-button {
    min-width: 0;
    min-height: 0;
    flex-direction: column;
    gap: 8px;
    padding: 8px 12px;
    border: 0;
    border-radius: 0;
    background: transparent;
    opacity: .58;
    box-shadow: none;
}

body.redesign .side-button:hover {
    background: transparent;
    opacity: .88;
}

body.redesign .side-button.active {
    border: 0;
    background: transparent;
    opacity: 1;
    box-shadow: none;
    transform: scale(1.05);
}

body.redesign .side-button img {
    width: 72px;
    height: 72px;
    filter: drop-shadow(0 10px 16px rgba(0,0,0,.22));
}

body.redesign .side-label {
    color: #f3f5f8;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .04em;
}

body.redesign .side-button.active .side-label {
    color: #f3f5f8;
}

body.redesign .inventory-content {
    display: grid;
    grid-template-columns: 240px minmax(640px, 1fr) 240px;
    gap: 36px;
    align-items: start;
}

body.redesign .items,
body.redesign .side-items,
body.redesign .current-skin-row,
body.redesign .skins {
    border: 0;
    background: transparent;
    box-shadow: none;
}

body.redesign .items {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    padding: 0;
}

body.redesign .side-items {
    gap: 12px;
}

body.redesign .weapon-slot,
body.redesign .skin-slot,
body.redesign .side-slot {
    border: 0;
    border-radius: 10px;
    background: #2a3b4d;
    box-shadow: none;
}

body.redesign .weapon-slot::before,
body.redesign .side-slot::before {
    display: none;
}

body.redesign .weapon-slot:hover,
body.redesign .skin-slot:hover,
body.redesign .side-slot:hover {
    transform: translateY(-2px);
    border: 0;
    background: #31465b;
    box-shadow: none;
}

body.redesign .weapon-slot {
    min-height: 172px;
    padding: 12px;
}

body.redesign .side-slot {
    height: 74px;
    padding: 10px;
}

body.redesign .character > .weapon-slot {
    min-height: 180px;
}

body.redesign .weapon-slot img,
body.redesign .skin-slot img,
body.redesign .side-slot img {
    filter: drop-shadow(0 12px 16px rgba(0,0,0,.22));
}

body.redesign .weapon-slot img {
    max-height: 94px;
}

body.redesign .side-slot img {
    max-height: 58px;
}

body.redesign .character > .weapon-slot img {
    max-height: 168px;
}

body.redesign .skin-name {
    min-height: 36px;
    color: #f4f6fb;
    font-size: 13px;
    font-weight: 700;
    text-shadow: none;
}

body.redesign .sticker-slot {
    border-color: rgba(255,255,255,.26);
    background: rgba(255,255,255,.04);
}

body.redesign .select-button,
body.redesign .save-settings-button {
    border-color: transparent;
    background: #3e6b91;
    color: #fff;
    box-shadow: none;
}

body.redesign .select-button:hover,
body.redesign .save-settings-button:hover {
    border-color: transparent;
    background: #4d7fa8;
}

body.redesign .save-settings-button {
    background: linear-gradient(45deg, #48bb78, #38a169);
}

body.redesign #skinsModal .modal-content,
body.redesign #stickerModal .modal-content {
    border: 1px solid rgba(255,255,255,.08);
    background: #2d3748;
    box-shadow: 0 30px 100px rgba(0,0,0,.6);
}

body.redesign #skinsModal .modal-header,
body.redesign #stickerModal .modal-header,
body.redesign #stickerModal .modal-footer {
    border-color: rgba(255,255,255,.08);
    background: #222b38;
}

body.redesign #skinsModal .modal-title,
body.redesign #stickerModal .modal-title {
    color: #f4f6fb;
}

body.redesign #skinsModal .modal-body,
body.redesign #stickerModal .modal-body {
    color: #f4f6fb;
}

body.redesign #skinsModal .current-skin-row,
body.redesign #skinsModal .weapon-slot,
body.redesign #skinsModal .skin-slot,
body.redesign #stickerModal .sticker-card {
    background: #2a3b4d;
}

body.redesign #skinsModal .form-control,
body.redesign #stickerModal .form-control {
    border-color: #4a5568;
    background: #1a202c;
    color: #fff;
}

body.redesign #skinsModal .form-control:focus,
body.redesign #stickerModal .form-control:focus {
    border-color: #4299e1;
    box-shadow: 0 0 0 3px rgba(66, 153, 225, .1);
}

body.redesign .checkbox-custom {
    border-color: #4a5568;
    background: #2d3748;
}

@media (max-width: 1320px) {
    body.redesign .inventory-content {
        grid-template-columns: 200px minmax(0, 1fr) 200px;
        gap: 20px;
    }

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

@media (max-width: 980px) {
    body.redesign .inventory-content {
        grid-template-columns: 1fr;
    }

    body.redesign .side-items {
        grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
    }

    body.redesign .items {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    body.redesign .rd-changer-page {
        margin-top: 16px;
        padding: 28px 14px 52px;
    }

    body.redesign .side-buttons {
        gap: 24px;
    }

    body.redesign .side-button img {
        width: 58px;
        height: 58px;
    }
}

/* Skinchanger spacing and modal contrast pass. */
body.redesign.rd-skins-body {
    background: #07090e;
}

body.redesign.rd-skins-body::before {
    display: none;
}

body.redesign.rd-skins-body .rd-content-host {
    background: #07090e;
}

body.redesign.rd-skins-body .rd-changer-page {
    width: min(1508px, calc(100% - 192px));
    max-width: none;
    margin: 40px auto 84px;
    padding: 48px 24px 72px;
    box-sizing: border-box;
    background: #1b2a3a;
}

body.redesign.rd-skins-body .inventory-content {
    grid-template-columns: 76px minmax(0, 1fr) 76px;
    gap: 44px;
}

body.redesign.rd-skins-body .items {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.redesign.rd-skins-body #skinsModal .modal-dialog,
body.redesign.rd-skins-body #stickerModal .modal-dialog {
    max-width: min(1240px, calc(100vw - 112px));
}

body.redesign.rd-skins-body #skinsModal .modal-content,
body.redesign.rd-skins-body #stickerModal .modal-content {
    border-color: rgba(255,255,255,.1);
    background: #202936;
}

body.redesign.rd-skins-body #skinsModal .modal-body,
body.redesign.rd-skins-body #stickerModal .modal-body {
    background: #202936;
}

body.redesign.rd-skins-body #skinsModal .current-skin-row {
    background: #253346;
}

body.redesign.rd-skins-body #skinsModal .items-modal {
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 14px;
}

body.redesign.rd-skins-body #skinsModal .weapon-slot,
body.redesign.rd-skins-body #skinsModal .skin-slot,
body.redesign.rd-skins-body #stickerModal .sticker-card {
    background: #2f4054;
}

body.redesign.rd-skins-body #skinsModal .weapon-slot:hover,
body.redesign.rd-skins-body #skinsModal .skin-slot:hover,
body.redesign.rd-skins-body #stickerModal .sticker-card:hover {
    background: #374a60;
}

body.redesign.rd-skins-body #skinsModal .weapon-slot {
    min-height: 250px;
}

body.redesign.rd-skins-body #skinsModal .weapon-slot img,
body.redesign.rd-skins-body #skinsModal .skin-slot img {
    max-height: 124px;
}

body.redesign.rd-skins-body #skinsModal .skin-name {
    color: #f5f7fb;
    font-size: 14px;
}

body.redesign.rd-skins-body .weapon-slot[data-type="agent_ct"],
body.redesign.rd-skins-body .weapon-slot[data-type="agent_t"] {
    display: none;
}

body.redesign.rd-skins-body .agents-row {
    display: grid;
    grid-template-columns: minmax(260px, 292px) minmax(260px, 292px);
    justify-content: space-between;
    gap: 24px;
    margin-top: -8px;
}

body.redesign.rd-skins-body .agents-row .weapon-slot[data-type="agent_ct"],
body.redesign.rd-skins-body .agents-row .weapon-slot[data-type="agent_t"] {
    display: flex;
    width: 100%;
    min-height: 225px;
    align-self: center;
}

body.redesign.rd-skins-body .agents-row .weapon-slot[data-type="agent_ct"] img,
body.redesign.rd-skins-body .agents-row .weapon-slot[data-type="agent_t"] img {
    max-height: 214px;
    max-width: 100%;
}

@media (max-width: 1320px) {
    body.redesign.rd-skins-body .rd-changer-page {
        width: min(1180px, calc(100% - 48px));
    }

    body.redesign.rd-skins-body .inventory-content {
        grid-template-columns: 72px minmax(0, 1fr) 72px;
        gap: 24px;
    }

    body.redesign.rd-skins-body .items {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    body.redesign.rd-skins-body .agents-row {
        grid-template-columns: minmax(220px, 240px) minmax(220px, 240px);
    }
}

@media (max-width: 980px) {
    body.redesign.rd-skins-body .rd-changer-page {
        width: calc(100% - 28px);
    }

    body.redesign.rd-skins-body .inventory-content {
        grid-template-columns: 1fr;
    }

    body.redesign.rd-skins-body .items {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.redesign.rd-skins-body .agents-row {
        grid-template-columns: 1fr 1fr;
    }

    body.redesign.rd-skins-body #skinsModal .modal-dialog,
    body.redesign.rd-skins-body #stickerModal .modal-dialog {
        max-width: calc(100vw - 24px);
    }
}

/* Restore the classic skinchanger proportions: side columns hold utility items and agents. */
body.redesign.rd-skins-body .inventory-content {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
}

body.redesign.rd-skins-body .character {
    width: 20%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

body.redesign.rd-skins-body .items {
    width: 55%;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

body.redesign.rd-skins-body .side-items {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

body.redesign.rd-skins-body .side-slot {
    width: 64px;
    height: 64px;
    padding: 10px;
    flex: 0 0 64px;
}

body.redesign.rd-skins-body .inventory-content > .character > .weapon-slot[data-type="agent_ct"],
body.redesign.rd-skins-body .inventory-content > .character > .weapon-slot[data-type="agent_t"] {
    display: flex;
    width: 100%;
    min-height: 180px;
}

body.redesign.rd-skins-body .inventory-content > .character > .weapon-slot[data-type="agent_ct"] img,
body.redesign.rd-skins-body .inventory-content > .character > .weapon-slot[data-type="agent_t"] img {
    max-width: 100%;
    max-height: 168px;
}

body.redesign.rd-skins-body .agents-row {
    display: none;
}

@media (max-width: 1320px) {
    body.redesign.rd-skins-body .inventory-content {
        gap: 18px;
    }

    body.redesign.rd-skins-body .items {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 980px) {
    body.redesign.rd-skins-body .inventory-content {
        flex-direction: column;
    }

    body.redesign.rd-skins-body .character,
    body.redesign.rd-skins-body .items {
        width: 100%;
    }

    body.redesign.rd-skins-body .side-items {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }

    body.redesign.rd-skins-body .items {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
