:root {
    --rxjh-card-radius: 18px;
}

.card.rx-card {
    border-radius: var(--rxjh-card-radius);
    box-shadow: 0 10px 30px rgba(0,0,0,.06);
    border: 1px solid rgba(0,0,0,.06);
}

.hero {
    background: radial-gradient(1200px 600px at 20% 10%, rgba(255,193,7,.18), transparent 60%), radial-gradient(900px 500px at 90% 20%, rgba(13,110,253,.15), transparent 55%), linear-gradient(180deg, rgba(0,0,0,.06), transparent 40%);
    border-radius: 24px;
    padding: 28px;
}

.badge-soft {
    background: rgba(13,110,253,.10);
    color: #0d6efd;
    border: 1px solid rgba(13,110,253,.15);
}

.white-space-pre {
    white-space: pre-wrap;
    word-break: break-word;
}


/* ------------------------------
   首页大图轮播
------------------------------ */
.rxjh-carousel {
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 18px 45px rgba(0,0,0,.25);
}

    .rxjh-carousel .carousel-item img {
        height: 520px;
        object-fit: cover;
        filter: saturate(1.05) contrast(1.05);
    }

    .rxjh-carousel .carousel-caption {
        bottom: 2.5rem;
        text-shadow: 0 2px 12px rgba(0,0,0,.6);
    }

        .rxjh-carousel .carousel-caption .btn {
            border-radius: 999px;
            padding-left: 1.25rem;
            padding-right: 1.25rem;
        }

@media (max-width: 768px) {
    .rxjh-carousel .carousel-item img {
        height: 360px;
    }

    .rxjh-carousel .carousel-caption {
        bottom: 1.25rem;
    }
}

/* ------------------------------
   职业介绍（Swiper Tabs + View）
------------------------------ */
    /* 职业特点：官网卡片风（替换原来的圆角胶囊） */

            /* 职业特点：超过 3 行自动省略 + 展开 */

/* 手机端：能力说明更紧凑（2 行省略） */

/* 修正：表格单元格默认 nowrap 会导致 ability 不换行 */

/* 职业特点：属性彩色高亮 */



/* =========================
   RXJH Theme (Game-like)
   ========================= */
:root {
    --rx-bg0: #07090f;
    --rx-bg1: #0c1020;
    --rx-panel: rgba(16, 20, 40, .62);
    --rx-panel2: rgba(6, 8, 18, .72);
    --rx-border: rgba(255,255,255,.10);
    --rx-text: #e9edf7;
    --rx-muted: rgba(233,237,247,.72);
    --rx-accent: #ff3d2e; /* red */
    --rx-accent2: #ffb100; /* gold */
    --rx-accent3: #4dd0ff; /* cyan */
    --rx-shadow: 0 18px 60px rgba(0,0,0,.55);
}

/* full-bleed helper: breaks out of container */
.full-bleed {
    width: 100vw;
    margin-left: calc(50% - 50vw);
}

/* =========================
   Hero (Bootstrap carousel)
   ========================= */
.hero {
    position: relative;
    box-shadow: var(--rx-shadow);
}

/* =========================
   IE10/11 Fallback (no CSS variables)
   ========================= */

/* IE 下首页/全站如果没有 rx-body，也需要深色兜底（因为 var(--rx-bg) 会失效） */
html.is-ie body {
    background: #07090f;
    background-image: radial-gradient(1200px 700px at 20% -10%, rgba(255,177,0,.10), transparent 60%),
                      radial-gradient(1100px 700px at 95% 10%, rgba(77,208,255,.08), transparent 60%),
                      linear-gradient(180deg, #07090f, #0c1020 55%, #060812);
    color: rgba(255,255,255,.92);
}

html.is-ie a { color: rgba(255,255,255,.92); }
html.is-ie .card, html.is-ie .container .card, html.is-ie .bg-white, html.is-ie .bg-light {
    background: rgba(255,255,255,.06) !important;
    border-color: rgba(255,255,255,.10) !important;
}

html.is-ie .hero { box-shadow: 0 18px 60px rgba(0,0,0,.55); }


    .hero .carousel-item {
        height: min(92vh, 920px);
        min-height: 560px;
    }

        .hero .carousel-item img {
            height: 100%;
            width: 100%;
            object-fit: cover;
            filter: saturate(1.05) contrast(1.05);
        }

        .hero .carousel-item::after {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(800px 400px at 20% 20%, rgba(255,61,46,.22), transparent 60%), radial-gradient(800px 400px at 80% 30%, rgba(77,208,255,.18), transparent 60%), linear-gradient(90deg, rgba(0,0,0,.65), rgba(0,0,0,.20) 45%, rgba(0,0,0,.55));
        }

    .hero .carousel-caption {
        z-index: 2;
        text-align: left;
        left: 7%;
        right: 7%;
        bottom: 16%;
    }

        .hero .carousel-caption h1 {
            font-weight: 900;
            letter-spacing: .5px;
            text-shadow: 0 10px 30px rgba(0,0,0,.75);
        }

        .hero .carousel-caption p {
            max-width: 900px;
            color: rgba(255,255,255,.80);
            text-shadow: 0 10px 30px rgba(0,0,0,.75);
        }

@media (max-width: 576px) {
    .hero .carousel-item {
        min-height: 520px;
    }

    .hero .carousel-caption {
        bottom: 12%;
        left: 6%;
        right: 6%;
    }
}
/* ===== 全站暗色基底（推荐）===== */
:root {
    --rx-bg: #0b0f1a;
    --rx-panel2: rgba(255,255,255,.06);
    --rx-border: rgba(255,255,255,.10);
    --rx-muted: rgba(255,255,255,.68);
    --rx-accent: #ffb100;
    --rx-shadow: 0 18px 48px rgba(0,0,0,.38);
}

html, body {
    height: 100%;
}

body {
    background: radial-gradient(1200px 700px at 20% -10%, rgba(255,177,0,.10), transparent 60%), radial-gradient(1100px 700px at 95% 10%, rgba(77,208,255,.08), transparent 60%), var(--rx-bg);
    color: rgba(255,255,255,.92);
}

/* 常见容器白底卡片统一一下（避免刺眼） */
.card, .container .card, .bg-white, .bg-light {
    background: rgba(255,255,255,.06) !important;
    border-color: rgba(255,255,255,.10) !important;
}

a {
    color: rgba(255,255,255,.92);
}

/* Buttons / cards - more game vibe */
.card.glass {
    background: var(--rx-panel);
    border: 1px solid var(--rx-border);
    box-shadow: var(--rx-shadow);
}

.btn-outline-light {
    border-color: rgba(255,255,255,.22) !important;
    color: rgba(255,255,255,.84) !important;
}

    .btn-outline-light:hover {
        background: rgba(255,255,255,.10) !important;
        border-color: rgba(255,255,255,.32) !important;
    }

/* Page hero banner */
.rx-page-hero {
    position: relative;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 22px;
    overflow: hidden;
    box-shadow: var(--rx-shadow);
    background: rgba(0,0,0,.25);
}

    .rx-page-hero img {
        width: 100%;
        height: 260px;
        object-fit: cover;
        filter: saturate(1.05) contrast(1.05);
    }

    .rx-page-hero::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(90deg, rgba(0,0,0,.78), rgba(0,0,0,.25) 55%, rgba(0,0,0,.65));
    }

    .rx-page-hero .inner {
        position: absolute;
        inset: 0;
        padding: 28px 26px;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        z-index: 2;
    }

    .rx-page-hero h1 {
        font-weight: 900;
        letter-spacing: .5px;
        margin: 0;
    }

    .rx-page-hero p {
        color: rgba(255,255,255,.78);
        max-width: 900px;
        margin: 10px 0 0;
    }


/* ============================
   视觉升级：更“游戏官网”冲击感
   ============================ */

.rx-logo {
    width: 72px;
    height: 72px;
    object-fit: contain;
    filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
}

@media (max-width: 768px) {
    .rx-logo {
        width: 56px;
        height: 56px;
    }
}

.glass {
    border: 1px solid rgba(255,255,255,.10) !important;
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.20)) !important;
    box-shadow: 0 18px 60px rgba(0,0,0,.55);
}

.job {
    margin-top: 24px;
}

    .job .detail {
        padding: 0;
    }

    .job .tabs {
        padding: 16px 18px;
        border-radius: 18px;
        background: rgba(0,0,0,.28);
        border: 1px solid rgba(255,255,255,.10);
    }

        .job .tabs .swiper-slide {
            border-radius: 14px;
            overflow: hidden;
            cursor: pointer;
            opacity: .78;
            transition: .2s;
        }

        .job .tabs .swiper-slide-thumb-active {
            opacity: 1;
            box-shadow: 0 10px 30px rgba(0,0,0,.55);
        }

        .job .tabs img {
            width: 100%;
            height: 84px;
            object-fit: cover;
            display: block;
        }

        .job .tabs span {
            display: block;
            padding: 10px 10px 12px;
            font-weight: 800;
            font-size: .95rem;
        }

    .job .view {
        margin-top: 14px;
        border-radius: 22px;
        overflow: hidden;
        border: 1px solid rgba(255,255,255,.10);
    }

        .job .view .swiper-slide {
            min-height: 520px;
            padding: 60px 56px;
            position: relative;
        }

            .job .view .swiper-slide::before {
                content: "";
                position: absolute;
                inset: 0;
                background: linear-gradient(90deg, rgba(0,0,0,.78), rgba(0,0,0,.15) 55%, rgba(0,0,0,.70));
                z-index: 0;
            }

        .job .view h3, .job .view p, .job .view h4, .job .view .table, .job .view .button {
            position: relative;
            z-index: 1;
        }

        .job .view h3 {
            font-size: 2.2rem;
            font-weight: 900;
        }

        .job .view p {
            font-size: 1.05rem;
            max-width: 680px;
        }

    .job .swiper-button-next, .job .swiper-button-prev {
        color: #fff;
        filter: drop-shadow(0 12px 30px rgba(0,0,0,.75));
    }

@media (max-width: 992px) {

    .job .view .swiper-slide {
        padding: 44px 22px;
        min-height: 520px;
    }
}

/* ============================
   首页 · 玩家截图（官网暗黑卡片风）
   ============================ */


/* ============================
   Rank Page (Dark & Game-like)
   ============================ */
.rx-rank-head .text-muted {
    color: rgba(255,255,255,.68) !important;
}

.rx-rank-filter .form-select,
.rx-rank-filter .btn {
    border-radius: 14px;
}

.rx-rank-filter .form-select {
    background: rgba(0,0,0,.28);
    color: rgba(255,255,255,.92);
    border: 1px solid rgba(255,255,255,.12);
}

/* ============================
   首页 · 职业介绍（仿官网版）
   说明：仅在首页生效（.home），避免影响其他页面
   ============================ */

.home .job{position:relative;width:100%;min-width:1600px;margin:0;height:1034px;background:url(../img/bg_job.jpg) no-repeat center 0}
.home .job h2{position:absolute;left:50%;margin-left:-800px;padding:33px 0 0 0;width:1600px;font-weight:500;font-size:26px;text-align:center;color:#fff}
.home .job .detail{position:relative;margin:0 auto;width:1600px}
.home .job .detail:before{content:'';display:block;position:absolute;top:736px;left:0;width:1600px;height:200px;background:#252525}
.home .job .tabs{position:absolute;top:736px;box-sizing:border-box;margin:24px 87px;width:1426px;height:152px;z-index:10}
.home .job .tabs .swiper{overflow:hidden}
.home .job .tabs li{position:relative;width:152px;height:152px;cursor:pointer;overflow:hidden}
.home .job .tabs li img{display:block;width:152px;height:304px;margin-top:0}
.home .job .tabs li.swiper-slide-thumb-active img{margin-top:-152px}
.home .job .tabs li.swiper-slide-thumb-active span{font-weight:500;color:#252525}
.home .job .tabs li span{position:absolute;top:15px;left:19px;font-weight:400;font-size:16px;color:#fff}
.home .job .swiper-button-next,.home .job .swiper-button-prev{top:832px}
.home .job .swiper-button-next{right:25px;transform:rotate(-180deg)}
.home .job .swiper-button-prev{left:25px}
.home .job .swiper-button-next:after,.home .job .swiper-button-prev:after{content:'';width:37px;height:85px;background:url(../img/btn_job.png) no-repeat}
.home .job .swiper-button-next:hover:after,.home .job .swiper-button-prev:hover:after{background-position:0 -85px}
.home .job .view{height:936px;width:1600px;margin:0 auto;overflow:hidden;color:#fff}
.home .job .job-slide{background-color:transparent;background-repeat:no-repeat;background-position:center 0;background-size:1600px 936px}
.home .job .view h3{margin:198px 0 23px 115px;font-size:30px;color:#c7c4b3}
.home .job .view h3 strong{font-weight:700;font-size:70px;color:#fff}
.home .job .view h4{margin:0 0 9px 115px;font-weight:400;font-size:16px;color:#fff6c5}
.home .job .view p{margin:0 0 38px 115px;width:650px;font-weight:300;font-size:18px}
.home .job .table{margin:0 0 18px 115px;padding:3px 10px;width:415px;height:65px;border-radius:10px;background:#2a3d3b}
.home .job table{border-collapse:collapse;width:100%;font-size:13px;text-align:center}
.home .job th,.home .job td{padding:7px 0;font-weight:300}
.home .job th{border-bottom:1px solid #626e69}
.home .job th:nth-child(-n+4){width:10%}
.home .job td{color:#eee3bd}
.home .job .button{display:block;margin:0 0 0 115px;width:170px;height:45px;background:#f4dd90;font-size:13px;line-height:45px;color:#696969;text-align:center}
.home .job .button:hover{background:#e8c64f}

/* ============================
   Hotfix: 首页职业介绍去掉“玻璃灰层/圆角遮罩”并避免盖住下一段
   说明：文件前部存在通用 .job 的暗黑卡片风样式（圆角/边框/::before 遮罩），
         会与本段仿官网版（.home .job）冲突。
         这里强制首页按官网风格渲染。
   ============================ */

/* 1) 覆盖通用 job 卡片风的圆角/边框/遮罩 */
.home .job .tabs{padding:0 !important;border-radius:0 !important;background:transparent !important;border:0 !important;}
.home .job .tabs .swiper-slide{border-radius:0 !important;opacity:1 !important;box-shadow:none !important;}
.home .job .view{margin-top:0 !important;border-radius:0 !important;overflow:visible !important;border:0 !important;}
.home .job .view .swiper-slide{padding:0 !important;min-height:0 !important;}
.home .job .view .swiper-slide::before{content:none !important;display:none !important;}

/* 2) 修正“盖住底部”：去掉负 margin，改为正常占位 */
.home .job{margin:0 !important;}

/* 3) IE10/11/旧浏览器：swiper 容器溢出统一处理 */
.home .job .tabs .swiper, .home .job .view.swiper{overflow:hidden;}

    .rx-rank-filter .form-select:focus {
        box-shadow: 0 0 0 .2rem rgba(255,177,0,.18);
        border-color: rgba(255,177,0,.28);
    }

.rx-rank-card {
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.20)) !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    box-shadow: 0 18px 60px rgba(0,0,0,.55);
}

.rx-rank-table {
    color: rgba(255,255,255,.92);
    margin-bottom: 0;
    /* Bootstrap table vars (fix white hover/cell bg) */
    --bs-table-bg: transparent;
    --bs-table-color: rgba(255,255,255,.92);
    --bs-table-hover-bg: rgba(255,80,80,.18);
    --bs-table-hover-color: rgba(255,255,255,.95);
}
    /* ensure cells don't get forced white backgrounds */
    .rx-rank-table > :not(caption) > * > * {
        background-color: transparent !important;
    }
    /* Bootstrap applies hover bg on cells, not the <tr> */
    .rx-rank-table.table-hover > tbody > tr:hover > * {
        background-color: rgba(255,80,80,.18) !important;
        color: rgba(255,255,255,.95) !important;
    }

    .rx-rank-table thead th {
        color: rgba(255,255,255,.88);
        font-weight: 800;
        background: rgba(0,0,0,.22);
        border-bottom: 1px solid rgba(255,255,255,.10);
        white-space: nowrap;
    }

    .rx-rank-table tbody td {
        border-color: rgba(255,255,255,.08);
        vertical-align: middle;
    }

    .rx-rank-table tbody tr {
        transition: transform .12s ease, background .12s ease;
    }

        .rx-rank-table tbody tr:hover {
            background: rgba(255,80,80,.12);
            transform: translateY(-1px);
        }

.rank-num {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(0,0,0,.24);
    border: 1px solid rgba(255,255,255,.10);
    color: rgba(255,255,255,.80);
    font-weight: 800;
    letter-spacing: .02em;
}

.rank-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    border-radius: 999px;
    font-weight: 900;
    letter-spacing: .02em;
    border: 1px solid rgba(255,255,255,.16);
    background: rgba(0,0,0,.18);
    box-shadow: 0 10px 24px rgba(0,0,0,.35);
    white-space: nowrap;
}

/* ============================
   Dark Table (Items/Admin/Rank)
   统一单元格底色 + Hover（覆盖 Bootstrap 默认白底）
   ============================ */
.rx-table {
    color: rgba(255,255,255,.92);
    margin-bottom: 0;
    /* Bootstrap table vars */
    --bs-table-bg: transparent;
    --bs-table-color: rgba(255,255,255,.92);
    --bs-table-striped-bg: rgba(255,80,80,.12);
    --bs-table-striped-color: rgba(255,255,255,.92);
    --bs-table-hover-bg: rgba(255,80,80,.18);
    --bs-table-hover-color: rgba(255,255,255,.95);
    --bs-table-active-bg: rgba(255,80,80,.20);
    --bs-table-active-color: rgba(255,255,255,.95);
}
    /* 关键：Bootstrap 会把 hover/bg 直接刷到 td/th，上面必须强制统一 */
    .rx-table > :not(caption) > * > * {
        background-color: rgba(255,80,80,.12) !important;
        color: rgba(255,255,255,.92) !important;
        border-color: rgba(255,255,255,.08) !important;
    }
    /* 表头更深一点 */
    .rx-table thead th {
        background-color: rgba(0,0,0,.28) !important;
        color: rgba(255,255,255,.90) !important;
        font-weight: 900;
        border-bottom: 1px solid rgba(255,255,255,.12) !important;
        white-space: nowrap;
    }
    /* Hover（Bootstrap hover 作用在单元格） */
    .rx-table.table-hover > tbody > tr:hover > * {
        background-color: rgba(255,80,80,.18) !important;
        color: rgba(255,255,255,.95) !important;
        box-shadow: inset 0 0 0 1px rgba(255,120,120,.35);
    }

@media (max-width: 576px) {
    .rx-rank-filter {
        width: 100%;
    }

        .rx-rank-filter .form-select {
            width: 100% !important;
        }
}

/* ============================
   主页：指南 / 活动时间 / 披风展示（三栏）
   - 放在玩家截图上方
   - 独立框架，不影响截图块样式
   ============================ */
.home-triple {
    max-width: calc(100% - 24px);
    margin: 30px auto 18px;
}

    .home-triple .section {
        display: flex;
        justify-content: space-between;
        gap: 24px;
        box-sizing: border-box;
        margin: 0 auto;
        width: 1600px;
        max-width: 100%;
    }

    .home-triple .section {
        overflow: hidden;
    }

        .home-triple .section h2 {
            font-weight: 900;
            font-size: 22px;
            color: rgba(255,255,255,.92);
            margin: 0;
        }

    .home-triple .guide,
    .home-triple .schedule,
    .home-triple .costume {
        position: relative;
        height: 318px;
        border-bottom: 2px solid rgba(255,255,255,.12);
        border-radius: 18px;
        overflow: hidden;
        background: rgba(0,0,0,.35);
        border: 1px solid rgba(255,255,255,.10);
        box-shadow: 0 18px 70px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.06);
        backdrop-filter: blur(10px);
    }

        .home-triple .guide h2,
        .home-triple .schedule h2,
        .home-triple .costume h2 {
            padding: 18px 22px 14px;
            border-bottom: 1px solid rgba(255,255,255,.12);
        }

    /* Guide */
    .home-triple .guide {
        flex: 1 1 auto;
        min-width: 520px;
        background: radial-gradient(700px 260px at 18% 0%, rgba(255,61,46,.18), transparent 62%), rgba(0,0,0,.35);
    }

        .home-triple .guide label {
            display: block;
            padding: 16px 22px 0;
            font-size: 14px;
            color: rgba(255,214,0,.80);
        }

            .home-triple .guide label strong {
                display: inline-block;
                font-size: 18px;
                color: rgba(255,255,255,.95);
                margin-right: 8px;
            }

            .home-triple .guide label .text {
                color: rgba(255,255,255,.70);
                margin-right: 10px;
            }

        .home-triple .guide input {
            margin: 0 0 0 6px;
            padding: 0 44px 0 14px;
            width: 360px;
            height: 39px;
            border: 1px solid rgba(255,214,0,.35);
            border-radius: 12px;
            background: rgba(0,0,0,.35);
            color: rgba(255,255,255,.90);
            font-size: 14px;
            vertical-align: middle;
            outline: none;
        }

            .home-triple .guide input::placeholder {
                color: rgba(255,255,255,.45);
            }

        .home-triple .guide button {
            margin: -1px 0 0 -40px;
            background: none;
            border: 0;
            padding: 0;
            vertical-align: middle;
            cursor: pointer;
        }

            .home-triple .guide button img {
                width: 32px;
                height: 32px;
                opacity: .95;
            }

        .home-triple .guide ul {
            display: flex;
            flex-wrap: wrap;
            margin: 18px 22px 0;
            height: 164px;
            overflow: hidden;
            gap: 10px;
            padding: 0;
            list-style: none;
        }

        .home-triple .guide li {
            margin: 0;
        }

            .home-triple .guide li a {
                display: block;
                padding: 8px 14px;
                border: 1px solid rgba(255,255,255,.10);
                border-radius: 999px;
                font-weight: 800;
                color: rgba(255,255,255,.86);
                text-decoration: none;
                background: rgba(0,0,0,.20);
            }

                .home-triple .guide li a:hover {
                    background: rgba(255,214,0,.18);
                    border-color: rgba(255,214,0,.35);
                    color: rgba(255,255,255,.95);
                }

    /* Schedule */
    .home-triple .schedule {
        width: 500px;
        flex: 0 0 500px;
        background: radial-gradient(700px 260px at 30% 0%, rgba(61,138,225,.20), transparent 62%), rgba(0,0,0,.35);
    }

        .home-triple .schedule .more,
        .home-triple .costume .more {
            position: absolute;
            top: 18px;
            right: 14px;
        }

        .home-triple .schedule .tabs {
            position: absolute;
            top: 22px;
            left: 140px;
            display: flex;
            font-size: 14px;
            list-style: none;
            padding: 0;
            margin: 0;
        }

            .home-triple .schedule .tabs a {
                margin: 0 10px;
                color: rgba(255,255,255,.55);
                text-decoration: none;
            }

            .home-triple .schedule .tabs .on a {
                color: rgba(255,255,255,.92);
            }

            .home-triple .schedule .tabs li:before,
            .home-triple .schedule .tabs li:last-child:after {
                content: '';
                display: inline-block;
                margin: -2px 0 0;
                width: 1px;
                height: 14px;
                background: rgba(255,255,255,.18);
                vertical-align: middle;
            }

        .home-triple .schedule .list {
            margin: 18px 0 0 22px;
            width: 420px;
            list-style: none;
            padding: 0;
        }

            .home-triple .schedule .list li {
                margin: 0 0 8px;
                padding: 0 0 0 14px;
                height: 32px;
                border: 2px solid transparent;
                font-size: 14px;
                line-height: 30px;
                color: rgba(255,255,255,.60);
                border-radius: 12px;
            }

                .home-triple .schedule .list li.on {
                    border-color: rgba(61,138,225,.60);
                    font-size: 16px;
                    color: rgba(255,255,255,.92);
                    background: rgba(61,138,225,.10);
                }

    /* Costume */
    .home-triple .costume {
        width: 280px;
        flex: 0 0 280px;
    }

        .home-triple .costume ul {
            padding: 26px 0 0;
            list-style: none;
            margin: 0;
        }

        .home-triple .costume li {
            font-size: 14px;
            text-align: center;
        }

            .home-triple .costume li img {
                display: block;
                margin: 0 auto 10px;
                width: 240px;
                height: 160px;
                object-fit: cover;
                border-radius: 14px;
                border: 1px solid rgba(255,255,255,.10);
            }

            .home-triple .costume li font {
                display: block;
                color: rgba(255,255,255,.80);
                font-weight: 800;
            }

        .home-triple .costume .swiper-button-prev,
        .home-triple .costume .swiper-button-next {
            width: 40px;
            height: 40px;
        }

        .home-triple .costume .swiper-button-next {
            transform: rotate(-180deg);
        }

            .home-triple .costume .swiper-button-prev:after,
            .home-triple .costume .swiper-button-next:after {
                content: '';
                width: 40px;
                height: 40px;
                background: url(https://mgameimage.gscdn.com/mgamezzang/games/yulgang_v4/main/btn_costume.png) no-repeat;
            }

            .home-triple .costume .swiper-button-prev:hover:after,
            .home-triple .costume .swiper-button-next:hover:after {
                background-position: 0 -40px;
            }

@media (max-width: 1200px) {
    .home-triple .section {
        flex-wrap: wrap;
    }

    .home-triple .guide {
        flex: 1 1 100%;
        min-width: 0;
    }

    .home-triple .schedule {
        flex: 1 1 100%;
        width: auto;
    }

    .home-triple .costume {
        flex: 1 1 100%;
        width: auto;
    }

    .home-triple .schedule .tabs {
        left: auto;
        right: 70px;
    }

    .home-triple .schedule .list {
        width: auto;
    }
}

/* 整块：暗黑玻璃卡片，贴合整站红黑氛围 */
.home-screenshots {
    position: relative;
    /* 主页截图宽度对齐 Notice（1600px），同时保持响应式 */
    width: 1600px;
    max-width: calc(100% - 24px);
    border-radius: 18px;
    padding: 22px 22px 16px;
    margin: 30px auto 42px;
    color: rgba(255,255,255,.90);
    background: radial-gradient(900px 420px at 18% 0%, rgba(255,61,46,.18), transparent 60%), radial-gradient(900px 420px at 80% 100%, rgba(255, 214, 0, .10), transparent 60%), rgba(0,0,0,.45);
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 18px 70px rgba(0,0,0,.40), inset 0 1px 0 rgba(255,255,255,.06);
    backdrop-filter: blur(10px);
}

    /* 标题区 */
    .home-screenshots h2 {
        margin: 0 0 12px 0;
        font-size: 22px;
        font-weight: 800;
        color: #fff;
        text-shadow: 0 14px 50px rgba(0,0,0,.55);
    }

        .home-screenshots h2 a {
            color: inherit;
        }

            .home-screenshots h2 a:hover {
                color: #fff;
                opacity: .92;
            }

/* 列表：自适应网格（不再写死 279px） */
.mainscreenshot {
    list-style: none;
    padding: 0;
    margin: 14px 0 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

    /* 卡片 */
    .mainscreenshot li {
        width: auto;
    }

        .mainscreenshot li a {
            position: relative;
            display: block;
            text-decoration: none;
            color: inherit;
            border-radius: 16px;
            overflow: hidden;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(0,0,0,.35);
            box-shadow: 0 18px 55px rgba(0,0,0,.35);
            transform: translateZ(0);
        }

    /* 图片：覆盖掉 Index.cshtml 里的 inline 宽高 */
    .mainscreenshot img {
        display: block;
        width: 100% !important;
        height: 210px !important;
        object-fit: cover !important;
        background: #111;
        filter: saturate(1.05) contrast(1.05) brightness(.95);
    }

    /* 底部信息遮罩（标题放在图上） */
    .mainscreenshot li a::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 58%;
        background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.45) 32%, rgba(0,0,0,.82) 100%);
        pointer-events: none;
    }

    /* 标题 */
    .mainscreenshot li div {
        position: absolute;
        left: 12px;
        right: 12px;
        bottom: 12px;
        margin: 0;
        font-size: 14px;
        font-weight: 800;
        line-height: 1.35;
        color: #fff;
        text-shadow: 0 12px 40px rgba(0,0,0,.70);
        z-index: 2;
        /* 最多两行，超过省略 */
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    /* 作者/日期：做成右上角徽章 */
    .mainscreenshot .user,
    .mainscreenshot .date {
        position: absolute;
        top: 10px;
        z-index: 2;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 12px;
        line-height: 1;
        color: rgba(255,255,255,.92);
        padding: 8px 10px;
        border-radius: 999px;
        border: 1px solid rgba(255,255,255,.12);
        background: rgba(0,0,0,.45);
        backdrop-filter: blur(8px);
        box-shadow: 0 14px 40px rgba(0,0,0,.35);
    }

    .mainscreenshot .user {
        left: 10px;
    }

    .mainscreenshot .date {
        right: 10px;
    }

/* hover：轻微抬升 + 高光边框 + 图片微亮 */
@media (prefers-reduced-motion: no-preference) {
    .mainscreenshot li a {
        transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
    }

    .mainscreenshot img {
        transition: filter .28s ease, transform .28s ease;
    }

    .mainscreenshot li a:hover {
        transform: translateY(-3px);
        border-color: rgba(255,61,46,.40);
        box-shadow: 0 22px 70px rgba(0,0,0,.45);
    }

        .mainscreenshot li a:hover img {
            filter: saturate(1.10) contrast(1.10) brightness(1.02);
            transform: scale(1.03);
        }
}

/* 响应式：3列/2列/1列 */
@media (max-width: 1200px) {
    .mainscreenshot {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .home-screenshots {
        padding: 18px 14px 12px;
    }

    .mainscreenshot {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

        .mainscreenshot img {
            height: 160px !important;
        }
}

@media (max-width: 420px) {
    .mainscreenshot {
        grid-template-columns: 1fr;
    }

        .mainscreenshot img {
            height: 200px !important;
        }
}



/* =========================
   Home Notice (official-like)
   ========================= */
body.home .notice {
    position: relative;
    display: flex;
    margin: -139px auto 85px auto;
    width: 1600px;
    /* 你要：公告/登录/客服等保持 400 高度，注册图 440 允许“高出一点” */
    height: 262px;
    background: #23262a;
    color: #a6a6a6;
    z-index: 500; /* 置顶：避免被主视觉/其它块遮挡 */
    box-shadow: 0 18px 60px rgba(0,0,0,.45);
    border-radius: 10px;
    /* 允许注册图(440)溢出展示 */
    overflow: visible;
    align-items: stretch;
}

    body.home .notice a {
        color: #a6a6a6;
        text-decoration: none;
    }

        body.home .notice a:hover {
            color: #eee772;
        }

/* 让主视觉层级更低，避免盖住 notice */
body.home .visual {
    position: relative;
    z-index: 1;
}

body.home .notice .news {
    position: relative;
    box-sizing: border-box;
    padding: 33px 0 0 31px;
    width: 654px;
    font-size: 13px;
}

    body.home .notice .news h2 {
        margin: -10px 0 20px 0;
        font-weight: 600;
        font-size: 26px;
        color: #fff;
    }

    body.home .notice .news li {
        margin: 0 0 21px 0;
        list-style: none;
    }

body.home .notice .notice_area {
    padding: 0;
    margin: 0;
}

body.home .notice .news .icon {
    display: inline-block;
    margin: 0 13px 0 0;
    width: 93px;
    height: 23px;
    border-radius: 12px;
    background: #999;
    line-height: 22px;
    color: #fff;
    text-align: center;
    vertical-align: middle;
    font-size: 12px;
}

    body.home .notice .news .icon.i {
        background: #e13013;
    }

    body.home .notice .news .icon.e {
        background: #1387e1;
    }

    body.home .notice .news .icon.n {
        background: #d7bc08;
    }

    body.home .notice .news .icon.u {
        background: #dc7f07;
    }

    body.home .notice .news .icon.b {
        background: #8d4de8;
    }

body.home .notice .news .detail {
    display: inline-block;
    margin: 0 30px 0 0;
    width: 370px;
    font-size: 15px;
    color: #cfcfcf;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    vertical-align: middle;
}

body.home .notice .news .date {
    display: inline-block;
    color: #a5a5a5;
    vertical-align: middle;
}

body.home .notice .news .more {
    position: absolute;
    top: 32px;
    right: 42px;
    filter: brightness(140%);
}

body.home .notice .start {
    position: relative;
    /* notice 高度 400，但注册图保持 440，让它“高出一点” */
    top: 0;
    z-index: 2;
    margin: -143px 9px 0 0;
    width: 292px;
    height: 440px;
    overflow: hidden;
}
    /* btn_start_ko.png 是 2 帧竖向 sprite（292x880）：默认显示上半，hover 显示下半 */
    body.home .notice .start a {
        display: block;
        height: 440px;
        overflow: hidden;
    }

    body.home .notice .start img {
        display: block;
        width: 292px;
        height: 880px;
        max-width: none;
        object-fit: unset;
        transform: translateY(0);
        will-change: transform;
        transition: none;
    }

    body.home .notice .start a:hover img {
        transform: translateY(-440px);
    }

body.home .notice .login {
    box-sizing: border-box;
    padding: 28px 18px 0 18px;
    width: 292px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

    body.home .notice .login h2 {
        font-size: 18px;
        color: #fff;
        font-weight: 700;
        margin: 0 0 12px;
    }

    body.home .notice .login .find {
        margin: 14px 0 0;
        padding: 0;
        display: flex;
        gap: 12px;
        list-style: none;
        font-size: 12px;
    }

        body.home .notice .login .find a {
            color: #a6a6a6;
        }

    body.home .notice .login .button {
        display: flex;
        gap: 10px;
        padding: 0 0 10px;
    }

        body.home .notice .login .button a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            height: 34px;
            padding: 0 10px;
            border-radius: 8px;
            background: rgba(255,255,255,.08);
            border: 1px solid rgba(255,255,255,.12);
            color: #d9d9d9;
            font-size: 12px;
        }

            body.home .notice .login .button a:hover {
                background: rgba(238,231,114,.12);
                border-color: rgba(238,231,114,.35);
                color: #eee772;
            }

body.home .notice .event {
    position: relative;
    box-sizing: border-box;
    padding: 30px 30px 0 0;
    width: 355px;
}

    body.home .notice .event ul {
        display: flex;
        padding: 0;
        margin: 0;
        list-style: none;
    }

    body.home .notice .event li {
        position: relative;
        margin: 0 0 0 1px;
        height: 250px;
        overflow: hidden;
        width: 50%;
    }

        body.home .notice .event li:first-child {
            margin: 0;
        }

        body.home .notice .event li span {
            position: absolute;
            top: 4px;
            left: 8px;
            font-size: 13px;
            color: #fbf4e2;
            z-index: 2;
            text-shadow: 0 6px 14px rgba(0,0,0,.65);
        }

        body.home .notice .event li a {
            display: block;
            height: 250px;
            overflow: hidden;
        }

        body.home .notice .event li img {
            display: block;
            width: 162px;
            height: 500px;
            max-width: none;
            object-fit: unset;
            transform: translateY(0);
            will-change: transform;
            transition: none;
        }

        body.home .notice .event li a:hover img {
            transform: translateY(-250px);
        }

@media (max-width: 1680px) {
    body.home .notice {
        width: min(1600px, calc(100% - 24px));
    }
}

@media (max-width: 1200px) {
    body.home .notice {
        flex-wrap: wrap;
        height: auto;
        margin: 16px auto 40px;
    }

        body.home .notice .news {
            width: 100%;
        }

        body.home .notice .start {
            display: none;
        }

        body.home .notice .login {
            width: 50%;
        }

        body.home .notice .event {
            width: 50%;
            padding-right: 18px;
        }
}

@media (max-width: 768px) {
    body.home .notice .login, body.home .notice .event {
        width: 100%;
    }

    body.home .notice .news .detail {
        width: 52vw;
    }
}

/* === DARK THEME OVERRIDES v4 === */
:root {
    --rxjh-bg: #0b0f17;
    --rxjh-bg-2: #0f1522;
    --rxjh-surface: #121a2a;
    --rxjh-surface-2: #161f33;
    --rxjh-border: rgba(255,255,255,.10);
    --rxjh-text: #e7edf6;
    --rxjh-text-2: rgba(231,237,246,.78);
    --rxjh-muted: rgba(231,237,246,.55);
    --rxjh-link: #74b6ff;
    --rxjh-danger: #ff6b6b;
    --rxjh-success: #40d26c;
}

html, body {
    background: var(--rxjh-bg);
    color: var(--rxjh-text);
}

/* 通用文字 */
body, p, span, div, li, dt,
h1, h2, h3, h4, h5, h6,
label, small, strong, em {
    color: var(--rxjh-text);
}

.text-muted {
    color: var(--rxjh-muted) !important;
}

a {
    color: var(--rxjh-link);
}

    a:hover {
        color: #9fd0ff;
    }

/* 背景辅助类覆盖（Bootstrap 常见） */
.bg-body-tertiary, .bg-light {
    background: var(--rxjh-bg) !important;
}

.bg-white {
    background: var(--rxjh-surface) !important;
}

.border, .border-bottom, .border-top {
    border-color: var(--rxjh-border) !important;
}

/* 卡片/容器 */
.card, .dropdown-menu, .list-group-item {
    background: var(--rxjh-surface);
    color: var(--rxjh-text);
    border-color: var(--rxjh-border);
}

.card-header {
    background: var(--rxjh-surface-2);
    border-color: var(--rxjh-border);
}

 .shadow {
    box-shadow: 0 14px 40px rgba(0,0,0,.45) !important;
}

/* 表格 */
.table {
    color: var(--rxjh-text);
}

    .table thead th {
        color: var(--rxjh-text);
        background: var(--rxjh-surface-2);
        border-color: var(--rxjh-border);
    }

    .table td, .table th {
        border-color: var(--rxjh-border);
    }

.table-hover > tbody > tr:hover > * {
    color: var(--rxjh-text);
    background-color: rgba(116,182,255,.08);
}

/* 表单 */
.form-label, .form-check-label {
    color: var(--rxjh-text);
}

.form-control, .form-select {
    background: var(--rxjh-surface-2);
    color: #fff;
    border-color: var(--rxjh-border);
}

    .form-control::placeholder {
        color: var(--rxjh-muted);
    }

    .form-control:focus, .form-select:focus {
        background: var(--rxjh-surface-2);
        color: #fff;
        border-color: rgba(116,182,255,.75);
        box-shadow: 0 0 0 .15rem rgba(116,182,255,.25);
    }

.input-group-text {
    background: var(--rxjh-surface);
    color: var(--rxjh-text);
    border-color: var(--rxjh-border);
}

/* 校验提示 */

/* 导航栏/页脚常见文字 */
.navbar, .navbar * {
    color: var(--rxjh-text) !important;
}

    .navbar .nav-link {
        color: var(--rxjh-text-2) !important;
    }

        .navbar .nav-link:hover, .navbar .nav-link.active {
            color: var(--rxjh-text) !important;
        }

.footer, footer, .footer * {
    color: var(--rxjh-text-2) !important;
}

/* 下拉/提示/分页 */
.dropdown-item {
    color: var(--rxjh-text);
}

    .dropdown-item:hover, .dropdown-item:focus {
        background: rgba(116,182,255,.12);
        color: var(--rxjh-text);
    }

.alert {
    background: rgba(255,255,255,.04);
    color: var(--rxjh-text);
    border-color: var(--rxjh-border);
}

.pagination .page-link {
    background: var(--rxjh-surface);
    border-color: var(--rxjh-border);
    color: var(--rxjh-text);
}

    .pagination .page-link:hover {
        background: rgba(116,182,255,.12);
        color: var(--rxjh-text);
    }

.pagination .page-item.active .page-link {
    background: rgba(116,182,255,.22);
    border-color: rgba(116,182,255,.40);
    color: var(--rxjh-text);
}

/* 让默认按钮在深色下也不会黑字 */
.btn {
    color: #fff;
}

.btn-outline-light {
    color: var(--rxjh-text) !important;
    border-color: var(--rxjh-border) !important;
}

    .btn-outline-light:hover {
        background: rgba(255,255,255,.08) !important;
    }
/* 把默认 primary 做成更“游戏站”一点 */
.btn-primary {
    background: linear-gradient(135deg, rgba(255,61,46,.95), rgba(255,145,46,.92)) !important;
    border: none !important;
}

    .btn-primary:hover {
        filter: brightness(1.05);
    }
/* === END DARK THEME OVERRIDES v4 === */



/* === ITEMS PAGE ENHANCE v5 === */
/* 物品列表：让表格更像游戏UI */


/* === ITEMS PAGE FIX v7 === */
/* Items 页面：ID / 说明文字增强可读性 */

/* ID / PID 更亮 */

/* 说明文字 */

/* hover 时整体更亮 */


/* === ITEMS PAGE UPGRADE v8 === */
/* 高亮关键字 */

/* 图标框 */

/* 类型徽章 */

/* 说明：短文本，hover tooltip 全文本 */

.tooltip .tooltip-inner {
    max-width: 520px;
    text-align: left;
    white-space: pre-wrap;
    line-height: 1.45;
}


/* === ITEMS PAGE FIX v10 === */
/* 不显示灰到看不清：说明列强制更亮 */

/* 如果还有旧的 text-muted 叠加，直接压掉 */

/* rx-desc 本身更亮 */


/* === ITEMS PAGE DARK TABLE v11 === */
/* 你反馈：表格底是白色导致说明灰字看不清
   这里把 Items 页面表格/卡片强制做成深色底 + 亮字（不依赖全局主题是否生效） */

/* 表格整体 */

    /* Bootstrap 5 表格单元格背景会用变量，这里强制深色底 */

    /* 表头更深一点 */

/* 说明列强制更亮 */

/* 物品名、ID列也加强 */

/* hover 仍保留高亮，但不再“只有 hover 才看得清” */

/* 如果某些地方还套了 text-muted，压掉 */

/* =========================
   Home Jobs - Fullscreen Hero (官网风)
   说明：你的 Razor slide 用 --job-bg:url('...') + .job-slide-bg
   ========================= */

/* 全屏容器 */

    /* 外层 detail 不要卡圆角/边框，让它变成真正大屏 */

    /* tabs 做成悬浮在大图上的玻璃条 */

    /* 标题放在 tabs 里更大气 */

    /* Swiper view：真正全屏 */

        /* Slide：全屏 */

            /* 关闭旧版 job 叠加层（避免与新遮罩重复） */

    /* 背景图层：使用 CSS 变量 --job-bg，支持 PNG/JPG/WebP */

    /* 渐变遮罩 + 暗角，保证文字清晰 */

    /* 内容面板：左侧居中，像官网 */

    /* 职业特点：默认改为“左侧窄列 + 多行”，避免一行铺满 */

        /* 折叠：桌面默认只显示前 3 条（JS 会按屏幕自动切换 2/3） */

    /* 展开/收起按钮 */

    /* 属性染色（让 job-hero 也生效） */

/* 行动按钮：冲击一点 */

/* 轮播按钮与分页：更明显 */

/* 动效：轻微呼吸 + 内容淡入 */

@keyframes jobHeroBreath {
    0% {
        transform: scale(1.06);
    }

    50% {
        transform: scale(1.10);
    }

    100% {
        transform: scale(1.06);
    }
}



.forum-page .rx-card {
    background: rgba(255,255,255,0.04) !important;
    border: 1px solid rgba(255,255,255,0.06);
}

.forum-page .text-muted {
    color: rgba(230,232,236,.72) !important;
}

.forum-page .list-group {
    background: transparent;
}

.forum-page .list-group-item {
    background: rgba(255,255,255,0.04) !important;
    color: #e6e8ec !important;
    border: 1px solid rgba(255,255,255,0.06) !important;
    border-left: 0 !important;
    border-right: 0 !important;
}

    .forum-page .list-group-item + .list-group-item {
        margin-top: 10px;
        border-radius: 14px;
    }

.forum-page .list-group-item-action:hover,
.forum-page .list-group-item-action:focus {
    background: rgba(255,80,80,0.22) !important;
    box-shadow: inset 0 0 0 1px rgba(255,120,120,.35);
}

.forum-page .dot {
    opacity: .55;
}

.forum-page .rx-thumb {
    box-shadow: 0 10px 24px rgba(0,0,0,.45);
}

.forum-page .rx-badge-new {
    background: rgba(120,200,255,.18);
    color: #bfe7ff;
    border: 1px solid rgba(120,200,255,.28);
}

.forum-page .rx-badge-hot {
    background: rgba(255,80,80,.20);
    color: #ffb0b0;
    border: 1px solid rgba(255,120,120,.32);
}

.forum-page .rx-badge-mine {
    background: rgba(255,215,0,.12);
    color: #ffe07a;
    border: 1px solid rgba(255,215,0,.22);
}

.forum-page .rx-badge-unread {
    background: rgba(170,120,255,.16);
    color: #e3d3ff;
    border: 1px solid rgba(170,120,255,.28);
}

.forum-page .rx-postbox {
    background: rgba(0,0,0,.28) !important;
    border-color: rgba(255,255,255,.08) !important;
    color: #e6e8ec;
}

/* 热帖层级：根据 data-comments 添加轻微渐变 */
.forum-page .forum-item[data-comments]:not([data-comments="0"]) {
    position: relative;
    overflow: hidden;
}

    .forum-page .forum-item[data-comments]:not([data-comments="0"])::before {
        content: "";
        position: absolute;
        inset: -40px -60px auto auto;
        width: 240px;
        height: 240px;
        background: radial-gradient(circle at 30% 30%, rgba(255,80,80,.22), transparent 62%);
        transform: rotate(10deg);
        pointer-events: none;
    }

    .forum-page .forum-item[data-comments]:not([data-comments="0"])::after {
        content: "";
        position: absolute;
        inset: auto auto 0 0;
        width: 100%;
        height: 2px;
        background: linear-gradient(90deg, rgba(255,80,80,.45), transparent);
        opacity: .55;
        pointer-events: none;
    }

.forum-page .forum-item[data-comments="10"]::before {
    opacity: .75;
}

.forum-page .forum-item[data-comments="20"]::before {
    opacity: 1;
}


.forum-page .rx-badge-mine {
    transform: translateY(-1px);
}


.forum-page .page-link {
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.08);
    color: #e6e8ec;
}

    .forum-page .page-link:hover {
        background: rgba(255,80,80,0.22);
        border-color: rgba(255,120,120,.35);
    }


.gm-page {
    background: radial-gradient(1100px 520px at 20% 0%, rgba(220,53,69,.18), transparent 60%), radial-gradient(900px 520px at 80% 10%, rgba(13,110,253,.16), transparent 60%), linear-gradient(180deg, #0b0f14, #070a0f 60%, #070a0f);
    min-height: 100vh;
}

    .gm-page .rx-card {
        background: rgba(255,255,255,0.05) !important;
        border: 1px solid rgba(255,255,255,0.10) !important;
        box-shadow: 0 14px 45px rgba(0,0,0,.45);
    }

    .gm-page .text-muted {
        color: rgba(255,255,255,.65) !important;
    }

    .gm-page .form-label {
        color: rgba(255,255,255,.85);
    }

    .gm-page .form-control,
    .gm-page .form-select {
        background: rgba(0,0,0,.25);
        color: rgba(255,255,255,.92);
        border-color: rgba(255,255,255,.18);
    }

        .gm-page .form-control::placeholder {
            color: rgba(255,255,255,.45);
        }

        .gm-page .form-control:focus,
        .gm-page .form-select:focus {
            background: rgba(0,0,0,.28);
            color: rgba(255,255,255,.96);
            border-color: rgba(255,193,7,.55);
            box-shadow: 0 0 0 .25rem rgba(255,193,7,.12);
        }

    .gm-page .rx-table {
        --bs-table-bg: transparent;
        --bs-table-striped-bg: rgba(255,255,255,0.04);
        --bs-table-hover-bg: rgba(255,193,7,0.10);
        color: rgba(255,255,255,.92);
    }

        .gm-page .rx-table > :not(caption) > * > * {
            background-color: transparent;
            border-color: rgba(255,255,255,0.10);
        }

        .gm-page .rx-table thead th {
            color: rgba(255,255,255,.75);
        }

    .gm-page .form-check-label {
        color: rgba(255,255,255,.70) !important;
    }



.gm-bag-layout {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 16px;
}

@media (max-width: 991.98px) {
    .gm-bag-layout {
        grid-template-columns: 1fr;
    }
}

.gm-bag-grid {
    display: grid;
    /* 物品图标 32x32：格子也固定为 32px（更像游戏背包） */
    grid-template-columns: repeat(12, 32px);
    grid-auto-rows: 32px;
    gap: 6px;
    padding: 10px;
    border-radius: 16px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.10);
}

.gm-bag-send {
    margin-top: 12px;
    padding: 12px;
    border-radius: 16px;
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(255,255,255,0.10);
}

    .gm-bag-send .card {
        margin: 0;
    }

.gm-sendname {
    white-space: nowrap;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gm-send-adv {
    max-width: 560px;
}

.gm-send-adv-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 8px;
    padding: 10px;
    border-radius: 14px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.10);
}

    .gm-send-adv-grid .input-group-text {
        background: rgba(0,0,0,0.35);
        border-color: rgba(255,255,255,0.12);
        color: rgba(255,255,255,0.80);
    }

    .gm-send-adv-grid .form-control {
        background: rgba(0,0,0,0.35);
        border-color: rgba(255,255,255,0.12);
        color: rgba(255,255,255,0.92);
    }

    .gm-send-adv-grid .form-check {
        display: flex;
        align-items: center;
        gap: 8px;
        padding-left: 6px;
    }

.gm-bag-slot {
    position: relative;
    width: 100%;
    aspect-ratio: 1/1;
    border: 1px solid rgba(255,255,255,0.14);
    border-radius: 10px;
    background: rgba(0,0,0,0.25);
    padding: 0;
    overflow: hidden;
    transition: transform .08s ease, border-color .12s ease, background .12s ease;
}

    .gm-bag-slot:hover {
        transform: translateY(-1px);
        border-color: rgba(255,255,255,0.30);
        background: rgba(255,255,255,0.06);
    }

    .gm-bag-slot.active {
        outline: 2px solid rgba(13,110,253,.85);
        outline-offset: 2px;
        border-color: rgba(13,110,253,.65);
    }

.gm-bag-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    image-rendering: pixelated;
    filter: drop-shadow(0 8px 14px rgba(0,0,0,.55));
}

.gm-bag-index {
    position: absolute;
    top: 4px;
    left: 6px;
    font-size: 10px;
    line-height: 1;
    padding: 2px 5px;
    border-radius: 999px;
    background: rgba(0,0,0,0.55);
    color: rgba(255,255,255,0.85);
    border: 1px solid rgba(255,255,255,0.10);
}

.gm-bag-count {
    position: absolute;
    right: 6px;
    bottom: 6px;
    font-size: 12px;
    line-height: 1;
    padding: 3px 7px;
    border-radius: 999px;
    background: rgba(220,53,69,0.80);
    color: #fff;
    border: 1px solid rgba(255,255,255,0.10);
    text-shadow: 0 1px 0 rgba(0,0,0,0.35);
}

.gm-bag-editor .rx-card {
    border-radius: 16px !important;
}

.gm-bag-preview {
    width: 64px;
    height: 64px;
    border-radius: 14px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

    .gm-bag-preview img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        image-rendering: pixelated;
    }


/* GM dark inputs (Bag send/eidt panels) */
.gm-page .gm-dark {
    background: rgba(0,0,0,0.35) !important;
    border-color: rgba(255,255,255,0.12) !important;
    color: rgba(255,255,255,0.92) !important;
}

    .gm-page .gm-dark::placeholder {
        color: rgba(255,255,255,0.55) !important;
    }

    .gm-page .gm-dark:focus {
        box-shadow: 0 0 0 .2rem rgba(255,255,255,0.08);
    }

.gm-page select.gm-dark option {
    color: #111;
}

/* GM editor inputs: 默认 bootstrap 输入在深色背景会变成“看起来没值”（因为文字是黑色）。
   这里把编辑区的所有输入统一改成深色底 + 白字。 */
.gm-page .gm-bag-editor .form-control,
.gm-page .gm-bag-editor .form-select {
    background: rgba(0,0,0,0.35) !important;
    border-color: rgba(255,255,255,0.12) !important;
    color: rgba(255,255,255,0.92) !important;
}

    .gm-page .gm-bag-editor .form-control::placeholder {
        color: rgba(255,255,255,0.55) !important;
    }

    .gm-page .gm-bag-editor .form-control:focus,
    .gm-page .gm-bag-editor .form-select:focus {
        box-shadow: 0 0 0 .2rem rgba(255,255,255,0.08);
    }

.gm-page .gm-bag-editor .input-group-text {
    background: rgba(0,0,0,0.45) !important;
    border-color: rgba(255,255,255,0.12) !important;
    color: rgba(255,255,255,0.78) !important;
}

.gm-page .gm-bag-editor .form-check-input {
    background-color: rgba(0,0,0,0.35);
    border-color: rgba(255,255,255,0.25);
}


/* =========================
   GM Bag Item List (custom)
   ========================= */

/* GM 背包：编辑区动作栏（让“保存背包”更显眼） */

.gm-itemlist {
    margin-top: 2px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 10px;
    background: rgba(0,0,0,.25);
    max-height: 280px;
    overflow: auto;
    color: #f1f1f1;
}

.gm-itemlist-empty {
    padding: 10px 12px;
}

.gm-itemrow {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 8px 10px;
    cursor: pointer;
    user-select: none;
    color: #f1f1f1;
}

    /* 防止站点默认样式把行内文字覆盖成黑色 */
    .gm-itemrow * {
        color: inherit !important;
    }

    .gm-itemrow + .gm-itemrow {
        border-top: 1px solid rgba(255,255,255,.06);
    }

    .gm-itemrow:hover {
        background: rgba(255,255,255,.06);
    }

.gm-itemicon {
    width: 32px;
    height: 32px;
    image-rendering: pixelated;
    border-radius: 6px;
    background: rgba(0,0,0,.25);
    border: 1px solid rgba(255,255,255,.10);
    flex: 0 0 32px;
}

.gm-itemtext {
    min-width: 0;
    flex: 1 1 auto;
}

.gm-itemtitle {
    font-size: 13px;
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gm-itemtitle, .gm-itemmeta {
    color: #f1f1f1 !important;
}

.gm-send-hint {
    padding-top: 6px;
    border-top: 1px dashed rgba(255,255,255,.10);
}

.gm-save-current {
    box-shadow: 0 0 0 1px rgba(255,255,255,.08) inset;
}

.gm-itemmeta {
    font-size: 12px;
    opacity: .75;
}

/* Hover preview tooltip */
.gm-itempreview {
    position: fixed;
    z-index: 3000;
    pointer-events: none;
}

.gm-itempreview-inner {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(0,0,0,.85);
    box-shadow: 0 10px 30px rgba(0,0,0,.45);
    color: #f1f1f1;
}

    .gm-itempreview-inner img {
        width: 32px;
        height: 32px;
        image-rendering: pixelated;
        border-radius: 6px;
        background: rgba(255,255,255,.06);
        border: 1px solid rgba(255,255,255,.12);
    }

.gm-itempreview-text {
    min-width: 160px;
}
/* ==========================
   首页间距：终极压紧（放 CSS 最底部）
   ========================== */

/* ① 取消全局 section 90px 内边距的影响（如果你没删那条，就用这条压掉） */
body.home .section {
    padding: 0 !important;
}

/* ② 三栏模块整体更贴 */
body.home .home-triple {
    margin: 10px auto 10px !important;
}

/* ③ 玩家相册（screenshot）模块更贴 */
body.home .home-screenshots {
    margin: 10px auto 12px !important;
    padding-top: 16px;
}

/* ④ 公告 notice（如果你觉得它和上下距离太大） */
body.home .notice {
    margin: -135px auto 50px auto !important;
}

/* ⑤ 三栏内部（标题、内容）再收紧一点 */
body.home .home-triple .guide h2,
body.home .home-triple .schedule h2,
body.home .home-triple .costume h2 {
    padding: 14px 18px 10px !important;
}

body.home .home-triple .guide label {
    padding-top: 12px !important;
}
/* navbar 高度大概 68px，按你的实际高度调 */
body .hero {
    padding-top: 0px;
}
/* ==========================
   修复：轮播外层与导航栏间隔大（只处理轮播外层）
   ========================== */

/* 1) 轮播外层本身清零 */
.hero,
.rxjh-carousel {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* 2) 如果轮播外层包在 container/row 里，清掉它们的上边距/上内边距 */

.visual {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* 3) 轮播外层如果被 main 顶下去（最常见），只在首页把 main 顶部压掉 */
body.home main {
    padding-top: 0 !important;
}

/* 4) 轮播上方如果还有一个空白块（可能是上一段 section padding），压掉它 */
body.home .section {
    padding-top: 0 !important;
    margin-top: 0 !important;
}


/* Admin Audit Logs dark readability */
.audit-logs-page .table {
    --bs-table-bg: transparent;
    --bs-table-color: #e5e7eb;
    --bs-table-border-color: rgba(255,255,255,.08);
}

.audit-logs-page thead th {
    color: #9ca3af;
}

.audit-logs-page .card.rx-card {
    background: #111827;
    border: 1px solid rgba(255,255,255,.08);
}



/* =========================================================
   yulgang.mgame.com visual 风格（套在 Bootstrap Carousel 上）
   ========================================================= */
#homeCarousel.visual {
    position: relative;
    height: 670px;
    background: #e9e9e9;
    overflow: hidden;
    border-radius: 0 !important;
}

    /* item / img 高度继承并铺满 */
    #homeCarousel.visual .carousel-inner,
    #homeCarousel.visual .carousel-item {
        height: 100%;
    }

        #homeCarousel.visual .carousel-item img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center top;
            display: block;
            filter: none !important;
        }


    /* caption 变成 1600 宽左对齐容器（官网 text 区域） */
    #homeCarousel.visual .carousel-caption {
        left: 50%;
        right: auto;
        width: 1600px;
        margin-left: -800px;
        text-align: left;
        bottom: auto;
        top: 50%;
        transform: translateY(-50%);
        z-index: 5;
    }

        /* 让按钮可见（你之前有时候被层级盖住） */
        #homeCarousel.visual .carousel-caption a,
        #homeCarousel.visual .carousel-caption button {
            position: relative;
            z-index: 6;
        }

    /* 指示器变成官网左侧圆点位置 */
    #homeCarousel.visual .carousel-indicators {
        box-sizing: border-box;
        bottom: 155px;
        left: 50%;
        margin-left: -800px;
        width: 1600px;
        justify-content: flex-start;
        padding-left: 6px;
        margin-right: 0;
        margin-bottom: 0;
        z-index: 10;
    }

        #homeCarousel.visual .carousel-indicators .active {
            background: #fff;
        }

    /* 右下角 more */
    #homeCarousel.visual + .more {
        position: absolute;
        left: 50%;
        bottom: 0;
        margin-left: -800px;
        width: 1600px;
        z-index: 100;
        pointer-events: none;
    }

        #homeCarousel.visual + .more a {
            pointer-events: auto;
            position: absolute;
            bottom: 149px;
            right: 0;
            padding: 0 23px 0 0;
            min-width: 100px;
            height: 20px;
            background: url(/img/bu_event.png) no-repeat right 0;
            font-size: 12px;
            color: #141414;
            text-align: right;
            letter-spacing: -1px;
            text-decoration: none;
        }

/* 响应式 */
@media (max-width: 1024px) {
    #homeCarousel.visual {
        height: 520px;
    }

        #homeCarousel.visual .carousel-caption,
        #homeCarousel.visual .carousel-indicators,
        #homeCarousel.visual + .more {
            width: min(100%, 1000px);
            left: 0;
            margin-left: 0;
            padding-left: 16px;
        }
}

@media (max-width: 768px) {
    #homeCarousel.visual {
        height: 360px;
    }

        #homeCarousel.visual .carousel-caption {
            width: 100%;
            left: 0;
            margin-left: 0;
            padding: 0 16px;
        }

        #homeCarousel.visual .carousel-indicators {
            width: 100%;
            left: 0;
            margin-left: 0;
            bottom: 18px;
        }

        #homeCarousel.visual + .more {
            width: 100%;
            left: 0;
            margin-left: 0;
        }

            #homeCarousel.visual + .more a {
                bottom: 18px;
                right: 16px;
            }
}
/* ===== 修复：homeCarousel 白底露出 / 图片没铺满 ===== */
#homeCarousel.visual {
    height: 670px; /* 你要官网 1:1 就用 670 */
    background: #000; /* 不想看到灰/白就设黑 */
    overflow: hidden;
}

    /* 关键：层层 100% 高度 */
    #homeCarousel.visual .carousel-inner,
    #homeCarousel.visual .carousel-item {
        height: 100% !important;
    }

        /* 关键：img 必须吃满高度并 cover */
        #homeCarousel.visual .carousel-item img {
            width: 100% !important;
            height: 100% !important;
            object-fit: cover !important;
            object-position: center top !important;
            display: block;
        }

    /* 你的 hero 类如果有 padding/背景，会导致看起来“有白边”，这里直接清掉 */
    #homeCarousel.visual.hero {
        padding: 0 !important;
        background: transparent !important;
    }
        /* ===== 彻底去灰：关掉 hero 的遮罩层和滤镜（只针对首页 homeCarousel） ===== */
        #homeCarousel.visual.hero .carousel-item::after {
            content: none !important;
            display: none !important;
        }

        #homeCarousel.visual.hero .carousel-item img {
            filter: none !important;
        }

    #homeCarousel.visual.hero {
        background: transparent !important;
        padding: 0 !important;
    }
/* =========================
   BGM 音乐按钮（深色站点高可见）
   ========================= */
#rx-bgm-toggle {
    background: linear-gradient(135deg, #ffb100, #ff6a00) !important;
    color: #111 !important;
    border: none !important;
    border-radius: 999px !important;
    width: 44px;
    height: 44px;
    padding: 0;
    font-size: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,.55), 0 0 0 2px rgba(255,177,0,.35);
}

    /* hover：更亮一点 */
    #rx-bgm-toggle:hover {
        filter: brightness(1.08);
    }

    /* 暂停状态（你 JS 里 opacity 会变低） */
/* =========================================================
   HOME CAROUSEL FINAL (NO-CONFLICT)
   - 适配 #homeCarousel.visual（Bootstrap Carousel）
   - 1:1 还原官网布局：1600 文案区 / 左对齐圆点 / bottom 155
   - aspect-ratio 自适应缩放（Ctrl+滚轮也稳定）
   - 去掉所有灰层（hero::after / filter）导致的发灰
   ========================================================= */

/* 0) 只在首页生效（可选，想全站都一样就删掉 body.home 前缀） */
body.home #homeCarousel.visual {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw); /* full-bleed */
    overflow: hidden;
    border-radius: 0 !important;
    /* ✅ 关键：自适应比例（解决缩放不适应） */
    height: auto !important;
    aspect-ratio: 1920 / 530; /* 官网比例 */
    max-height: 92vh; /* 防止超高屏过高 */

    background: #000; /* 防止加载瞬间露白 */
}

    /* 1) 内部层层吃满高度 */
    body.home #homeCarousel.visual .carousel-inner,
    body.home #homeCarousel.visual .carousel-item {
        height: 100% !important;
    }

        /* 2) 图片铺满，不发灰 */
        body.home #homeCarousel.visual .carousel-item img {
            width: 100% !important;
            height: 100% !important;
            display: block;
            object-fit: cover !important;
            object-position: center top !important;
            filter: none !important; /* 干掉你之前所有 filter 叠加 */
        }

        /* 3) 干掉 hero 的暗层遮罩（发灰主要元凶） */
        body.home #homeCarousel.visual.hero .carousel-item::after,
        body.home #homeCarousel.visual .carousel-item::after {
            content: none !important;
            display: none !important;
        }

        /* 4) 如果你之前加过 ::before 遮罩，也一并清掉（想要轻遮罩可用下方可选段） */
        body.home #homeCarousel.visual .carousel-item::before {
            content: none !important;
            display: none !important;
        }

    /* 5) caption：1600 宽居中，左对齐，垂直居中（更像官网） */
    body.home #homeCarousel.visual .carousel-caption {
        left: 50% !important;
        right: auto !important;
        width: 1600px !important;
        margin-left: -800px !important;
        text-align: left !important;
        top: 50% !important;
        bottom: auto !important;
        transform: translateY(-50%) !important;
        z-index: 5;
        text-shadow: 0 12px 40px rgba(0,0,0,.55);
    }

    /* 6) 圆点：官网位置（1600 宽左对齐，bottom 155） */
    body.home #homeCarousel.visual .carousel-indicators {
        box-sizing: border-box;
        left: 50% !important;
        margin-left: -800px !important;
        width: 1600px !important;
        bottom: 155px !important;
        justify-content: flex-start !important;
        padding-left: 6px !important;
        margin-right: 0 !important;
        margin-bottom: 0 !important;
        z-index: 10;
    }

        body.home #homeCarousel.visual .carousel-indicators .active {
            background: #fff;
        }

    /* 7) 左右箭头：确保在最上层，不被其它块盖住 */
    body.home #homeCarousel.visual .carousel-control-prev,
    body.home #homeCarousel.visual .carousel-control-next {
        z-index: 12;
    }

    /* 8) 把 hero 自己的背景/padding 清掉（避免边缘发灰、间距异常） */
    body.home #homeCarousel.visual.hero {
        background: transparent !important;
        padding: 0 !important;
    }

/* 9) 响应式：小屏不要死守 1600 */
@media (max-width: 1024px) {
    body.home #homeCarousel.visual {
        max-height: none;
        aspect-ratio: 16 / 9;
    }

        body.home #homeCarousel.visual .carousel-caption {
            width: calc(100% - 32px) !important;
            left: 0 !important;
            margin-left: 0 !important;
            padding: 0 16px !important;
        }

        body.home #homeCarousel.visual .carousel-indicators {
            width: 100% !important;
            left: 0 !important;
            margin-left: 0 !important;
            padding-left: 16px !important;
            bottom: 18px !important;
        }
}

/* =========================================================
   HOME 轮播缩放修正
   - 统一“整体缩放 + 鼠标悬停缩放”到同一 transform 计算，避免互相覆盖
   ========================================================= */
body.home #homeCarousel.visual .carousel-item img {
    --rx-base-scale: 1;
    --rx-hover-scale: 1;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center top !important;
    transform: scale(calc(var(--rx-base-scale) * var(--rx-hover-scale))) !important;
    transform-origin: center center;
    transition: transform .45s ease, filter .45s ease;
    will-change: transform;
}

/* 整体轻微放大（当前激活项） */
body.home #homeCarousel.visual .carousel-item.active img {
    --rx-base-scale: 1.04;
}

/* 鼠标悬停额外放大（在整体缩放基础上叠加） */
body.home #homeCarousel.visual:hover .carousel-item.active img {
    --rx-hover-scale: 1.03;
}

@media (prefers-reduced-motion: reduce) {
    body.home #homeCarousel.visual .carousel-item img {
        transition: none;
    }
}

/* =========================================================
   HOME 轮播固定位置（对齐 yulgang.mgame.com 风格）
   ========================================================= */
body.home #homeCarousel.visual {
    position: relative;
}

/* 文案区固定在画面左中上，不跟随图片缩放漂移 */
body.home #homeCarousel.visual .carousel-caption {
    top: 150px !important;
    bottom: auto !important;
    transform: none !important;
}

/* 指示器固定在左下（官网风格） */
body.home #homeCarousel.visual .carousel-indicators {
    bottom: 155px !important;
}

/* 小屏保持可用，避免被遮挡 */
@media (max-width: 1024px) {
    body.home #homeCarousel.visual .carousel-caption {
        top: 72px !important;
    }

    body.home #homeCarousel.visual .carousel-indicators {
        bottom: 18px !important;
    }
}


/* ------------------------------
   IE10/11 兼容补丁（职业介绍 + 基础排版）
------------------------------ */
.job .tabs{display:block;}
.job .tabs .swiper-wrapper{white-space:nowrap;}
.job .tabs li{position:relative;display:inline-block;vertical-align:top;}
/* IE 下 transform 可能导致字体发虚，给表格一点对比 */
.job .table{background:#2a3d3b;}


/* ============================
   Patch: Job section (no peeking / sprite thumbs / no overlap)
   ============================ */

/* 1) Full-width background, but keep 1600 content centered */
.home .job{width:100%;min-width:1600px;margin:0 !important;}

/* 2) Prevent next slide from showing (no "peek") */
.home .job .view{width:1600px;max-width:1600px;margin:0 auto;overflow:hidden;}
.home .job .view .swiper-slide{width:1600px !important;}

/* 3) Thumbs use one sprite image (top=gray, bottom=yellow) */
.home .job .tabs{display:block;}
.home .job .tabs .swiper{overflow:hidden;}
.home .job .tabs li{overflow:hidden;}
.home .job .tabs li img{display:block;width:152px;height:304px;margin-top:0;}
.home .job .tabs li.swiper-slide-thumb-active img{margin-top:-152px;}

/* 4) Ensure arrows stay inside and do not overlap */
.home .job .swiper-button-next,.home .job .swiper-button-prev{z-index:20;}


/* ============================
   Hotfix: Job section match official behavior
   - No peeking adjacent slides
   - Tabs use 2-state sprite (gray top, yellow bottom)
   - No negative margins that overlap next section
   (IE10/11 OK)
   ============================ */

.home .job{margin:0 !important; width:100% !important; min-width:1600px !important;}

/* View area must be 1600 centered so Swiper never shows the next slide */
.home .job .view{width:1600px !important; max-width:1600px !important; margin:0 auto !important; overflow:hidden !important;}
.home .job .view .swiper-wrapper{align-items:stretch;}
.home .job .view .swiper-slide{width:1600px !important;}

/* Tabs: hide overflow so edges don't show partial thumbs */
.home .job .tabs{display:block !important;}
.home .job .tabs .swiper{overflow:hidden !important;}

/* Tabs sprite: one image contains gray+yellow stacked vertically */
.home .job .tabs li{position:relative; overflow:hidden;}
.home .job .tabs li img{display:block; width:152px; height:304px; margin-top:0;}
.home .job .tabs li.swiper-slide-thumb-active img{margin-top:-152px;}

/* Active/inactive text color matches sprite state */
.home .job .tabs li span{color:#fff;}
.home .job .tabs li.swiper-slide-thumb-active span{color:#252525; font-weight:500;}


/* =========================================================
   IE10/11 Fixes: Screenshot grid + dark form controls
   ========================================================= */
html.is-ie .mainscreenshot{
  display:block !important; /* IE 不支持 CSS Grid */
  margin-right:-14px; /* 抵消右边距，保证整齐 */
}
html.is-ie .mainscreenshot:after{content:"";display:block;clear:both;}
html.is-ie .mainscreenshot li{
  float:left;
  width:20%;            /* 默认 5 列 */
  padding-right:14px;
  box-sizing:border-box;
  margin:0 0 14px 0;
}
html.is-ie .mainscreenshot li a{
  border-radius:16px;
  overflow:hidden;
}

/* 视口较窄时降级为 4/2/1 列 */
@media (max-width: 1399px){
  html.is-ie .mainscreenshot li{ width:25%; }
}
@media (max-width: 991px){
  html.is-ie .mainscreenshot li{ width:50%; }
}
@media (max-width: 575px){
  html.is-ie .mainscreenshot li{ width:100%; padding-right:0; }
  html.is-ie .mainscreenshot{ margin-right:0; }
}

/* IE 深色输入框兜底（CSS 变量 var(...) 在 IE 会失效导致白底） */
html.is-ie input[type="text"],
html.is-ie input[type="password"],
html.is-ie input[type="email"],
html.is-ie input[type="number"],
html.is-ie input[type="search"],
html.is-ie input[type="url"],
html.is-ie textarea,
html.is-ie select,
html.is-ie .form-control{
  background-color:#0b2a43 !important;
  color:#eaf2ff !important;
  border:1px solid rgba(255,255,255,.18) !important;
}
html.is-ie input:-ms-input-placeholder,
html.is-ie textarea:-ms-input-placeholder{
  color:rgba(234,242,255,.55) !important;
}


@media (min-width: 1400px){
  .mainscreenshot{ grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
/* =========================
   IE Notices 深色修复
   ========================= */

html.is-ie .list-group,
html.is-ie .list-group-item {
    background: #0b1624 !important;
    color: #e8f0ff !important;
    border-color: rgba(255,255,255,.08) !important;
}

    html.is-ie .list-group-item:hover {
        background: #13263d !important;
    }

/* Notices 列表：修复 hover 白底导致标题难读 */
.notices-page .list-group-item.list-group-item-action {
    background: var(--rxjh-surface) !important;
    color: var(--rxjh-text) !important;
    border-color: var(--rxjh-border) !important;
}

.notices-page .list-group-item.list-group-item-action:hover,
.notices-page .list-group-item.list-group-item-action:focus {
    background: linear-gradient(180deg, #f6d66a 0%, #d7a92a 100%) !important;
    color: #2f2200 !important;
    border-color: #e2bc4b !important;
    text-decoration: none !important;
}

.notices-page .list-group-item.list-group-item-action:hover .fw-semibold,
.notices-page .list-group-item.list-group-item-action:focus .fw-semibold {
    color: #2f2200 !important;
}

.notices-page .list-group-item.list-group-item-action:hover .text-muted,
.notices-page .list-group-item.list-group-item-action:focus .text-muted {
    color: #5f4708 !important;
}

.rx-logo {
    height: 68px;
    width: auto;
}

@media (max-width: 768px) {
    .rx-logo {
        height: 56px;
    }
}
.navbar .navbar-brand {
    margin-left: -180px;
}