/* =====================================================================
   移动端专业适配样式  guofeng_mobile.css  ——  「红焰·曜黑」游戏平台版
   目标：≤768px 视口下把 Media 模块默认模板重排为专业游戏平台单列布局。
   设计语言：品牌红渐变头部（光斑质感）+ 深色毛玻璃吸顶导航 +
             浅灰底白色卡片 + 渐变强调按钮；微软雅黑，严谨 4px 栅格。
   交互：active 按压反馈 / 毛玻璃吸顶 / 截图横滑 / 安全区适配 / 懒加载。
   修复：推荐游戏 .img_hover 悬浮层错位（改为卡底静态按钮条）、
         footer 微信图标签破损、1200px 固定宽错位。
   说明：仅作用于 ≤768px，桌面端保持原样。
   ===================================================================== */

@media screen and (max-width: 768px) {

    /* ---------- 设计变量 ---------- */
    :root {
        --brand: #2563eb;
        --brand-2: #60a5fa;
        --grad: linear-gradient(135deg, #3b82f6 0%, #2563eb 50%, #1d4ed8 100%);
        --grad-deep: linear-gradient(135deg, #0b1526 0%, #0f1e38 48%, #16294a 100%);
        --ink: #1b1f27;
        --ink-2: #3d4450;
        --mut: #6b7280;
        --mut-2: #9aa1ab;
        --line: #eef0f4;
        --bg: #f3f5f9;
        --card: #ffffff;
        --gold: #b45309;
        --gold-bd: #f0b23e;
        --radius: 12px;
        --radius-s: 8px;
        --shadow: 0 1px 2px rgba(17, 24, 39, .04), 0 6px 18px rgba(17, 24, 39, .06);
        --shadow-up: 0 2px 6px rgba(17, 24, 39, .08), 0 12px 28px rgba(17, 24, 39, .10);
    }

    /* ---------- 基础重置 ---------- */
    html { -webkit-text-size-adjust: 100%; }
    html, body { overflow-x: clip; }
    body {
        font-family: 'Microsoft YaHei', '微软雅黑', 'PingFang SC', 'Helvetica Neue', Arial, sans-serif;
        font-size: 14px;
        line-height: 1.55;
        color: var(--ink);
        background: var(--bg);
        -webkit-tap-highlight-color: transparent;
        -webkit-font-smoothing: antialiased;
    }
    a { color: var(--ink); text-decoration: none; }
    a:hover { color: var(--brand); }
    img { max-width: 100%; }
    * , *::before, *::after { box-sizing: border-box; }
    ::-webkit-scrollbar { width: 0; height: 0; }

    /* 容器：1200px 固定宽 → 自适应 */
    .wrap_w { width: 100%; padding-left: 12px; padding-right: 12px; }

    /* 冗余栏 / 漂浮宣传图：移动端隐藏 */
    .topbar { display: none; }
    .responsive-gif { display: none !important; }

    /* ---------- 头部：品牌红渐变 + 光斑质感 ---------- */
    .header {
        height: auto;
        padding: 12px 0 14px;
        overflow: visible;
        background:
            radial-gradient(130% 120% at 88% -20%, rgba(96, 165, 250, .42) 0%, rgba(96, 165, 250, 0) 58%),
            radial-gradient(150% 130% at -12% 118%, rgba(2, 6, 23, .65) 0%, rgba(2, 6, 23, 0) 62%),
            var(--grad-deep);
    }
    .header .wrap_w { display: flex; align-items: center; position: relative; }
    .header .logo {
        float: none; width: auto; height: auto; margin: 0; padding: 0;
        flex: 0 0 auto; text-align: left; background: none !important;
    }
    .header .logo a { display: block; line-height: 0; }
    .header .logo img {
        width: auto; height: 42px; max-width: 42vw; display: block;
        border-radius: 10px; object-fit: cover;
        filter: drop-shadow(0 2px 8px rgba(0, 0, 0, .28));
    }
    .header-search { float: none; flex: 1; min-width: 0; margin: 0 0 0 14px; padding: 0; }
    .searchbar { width: 100%; display: flex; align-items: center; }
    .searchbar form {
        position: relative; display: flex; align-items: center; width: 100%;
        height: 40px; padding: 3px 3px 3px 16px;
        background: rgba(255, 255, 255, .96);
        border-radius: 20px;
        box-shadow: 0 2px 10px rgba(2, 8, 40, .25), inset 0 0 0 1px rgba(255, 255, 255, .6);
    }
    .searchstyle {
        flex: 1; width: 100%; min-width: 0; height: 100%; margin: 0; padding: 0;
        border: none; border-radius: 0; background: transparent;
        font-size: 14px; color: var(--ink);
    }
    .searchstyle::-webkit-input-placeholder { color: var(--mut-2); font-size: 13px; }
    .searchstyle:focus { outline: none; }
    .searchebtn {
        flex: 0 0 auto; width: 34px; height: 34px; margin: 0; padding: 0;
        border: none; border-radius: 50%;
        background: var(--grad) center / 18px 18px no-repeat;
        background-image:
            linear-gradient(135deg, #3b82f6, #2563eb 55%, #1d4ed8),
            url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20.5 20.5l-4.6-4.6'/%3E%3C/svg%3E");
        background-blend-mode: normal;
        background-size: cover, 17px 17px;
        background-repeat: no-repeat, no-repeat;
        background-position: center, center;
        text-indent: -9999px; overflow: hidden; cursor: pointer;
        box-shadow: 0 2px 8px rgba(37, 99, 235, .4);
        transition: transform .18s ease, box-shadow .18s ease;
    }
    .searchebtn:active { transform: scale(.92); box-shadow: 0 1px 4px rgba(37, 99, 235, .32); }
    .searchebtn:focus { outline: none; }
    .searchhot { display: none; }

    /* ---------- 导航：电竞霓虹 · 流动顶线 · 发光胶囊 · 电流扫光 ---------- */
    .menu {
        position: sticky; top: 0; z-index: 90;
        background:
            radial-gradient(120% 300% at 10% 50%, rgba(59,130,246,.10), transparent 60%),
            radial-gradient(120% 300% at 90% 50%, rgba(34,211,238,.08), transparent 60%),
            linear-gradient(180deg, #0a1428 0%, #0a1120 100%);
        -webkit-backdrop-filter: blur(16px) saturate(1.6);
        backdrop-filter: blur(16px) saturate(1.6);
        box-shadow: 0 8px 24px rgba(2, 8, 23, .5), inset 0 -1px 0 rgba(255, 255, 255, .05);
        padding: 9px 0 17px;
        overflow: hidden;
    }
    /* 顶部流动霓虹线 */
    .menu::before {
        content: ''; position: absolute; left: 0; right: 0; top: 0; height: 2px;
        background: linear-gradient(90deg, #2563eb, #22d3ee, #60a5fa, #2563eb);
        background-size: 300% 100%;
        animation: menu-neon 4s linear infinite;
        opacity: .9;
    }
    .menu ul {
        position: relative; height: auto; line-height: normal;
        display: flex; gap: 7px; padding-left: 12px; padding-right: 12px;
    }
    .menu ul li { float: none; flex: 1; height: auto; min-width: 0; }
    .menu ul li a {
        position: relative; display: flex; align-items: center; justify-content: center;
        height: 31px; padding: 0 2px; border-radius: 16px; overflow: hidden;
        font-size: 12.5px; font-weight: 500; letter-spacing: .3px;
        color: rgba(226, 235, 255, .72); white-space: nowrap;
        border: 1px solid rgba(148, 180, 255, .10);
        background: rgba(255, 255, 255, .02);
        transition: color .25s ease, background .25s ease, border-color .25s ease, box-shadow .25s ease, transform .15s ease;
    }
    /* 未选中 hover：青蓝辉光 */
    .menu ul li a:hover {
        color: #eaf6ff; border-color: rgba(96, 165, 250, .45);
        background: rgba(37, 99, 235, .14);
        box-shadow: 0 0 14px rgba(59, 130, 246, .25), inset 0 0 10px rgba(59, 130, 246, .12);
    }
    .menu ul li a:active { transform: scale(.94); }
    .menu ul li.cur { background: none; }
    /* 选中项：品牌蓝渐变发光胶囊 */
    .menu ul li.cur a {
        color: #fff; font-weight: 700; letter-spacing: .4px;
        border-color: transparent;
        background: linear-gradient(135deg, #3b82f6 0%, #2563eb 50%, #1d4ed8 100%);
        box-shadow: 0 4px 16px rgba(37, 99, 235, .55), inset 0 1px 0 rgba(255, 255, 255, .28);
        text-shadow: 0 1px 3px rgba(0, 30, 90, .5);
    }
    /* 选中项底部霓虹下划线 */
    .menu ul li.cur a::before {
        content: ''; position: absolute; left: 28%; right: 28%; bottom: 2.5px; height: 1.5px;
        border-radius: 2px; background: #7dd3fc;
        box-shadow: 0 0 8px #38bdf8, 0 0 14px #38bdf8;
    }
    /* 电流扫光层 */
    .menu ul li.cur a::after {
        content: ''; position: absolute; top: 0; left: -60%; width: 45%; height: 100%;
        background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .55), transparent);
        transform: skewX(-18deg);
        animation: menu-sheen 2.6s ease-in-out infinite;
    }
    @keyframes menu-neon {
        0%   { background-position: 0% 50%; }
        100% { background-position: 300% 50%; }
    }
    @keyframes menu-sheen {
        0%   { left: -60%; }
        55%  { left: 130%; }
        100% { left: 130%; }
    }
    /* 降低动态偏好时静止 */
    @media (prefers-reduced-motion: reduce) {
        .menu::before { animation: none; }
        .menu ul li.cur a::after { animation: none; opacity: 0; }
    }

    /* ---------- 区块标题：渐变竖条 + 严谨基线 ---------- */
    .title {
        position: relative; display: flex; align-items: center;
        padding: 0 0 12px 14px; margin-bottom: 14px;
        border-bottom: 1px solid var(--line);
    }
    .title::before {
        content: ''; position: absolute; left: 0; top: 3px;
        width: 4px; height: 16px; border-radius: 2px;
        background: var(--grad);
        box-shadow: 0 2px 6px rgba(37, 99, 235, .35);
    }
    .title span { font-size: 17px; font-weight: 700; color: var(--ink); letter-spacing: .3px; }
    .title em { margin-left: auto; }
    .title em a {
        font-size: 12.5px; color: var(--mut); font-weight: 400;
        padding: 2px 0 2px 8px;
    }
    .title em a:hover { color: var(--brand); }

    /* ---------- 首页 · 轮播 ---------- */
    .main { margin-top: 12px; }
    .col_1 .l { float: none; width: 100%; height: auto; padding: 0; background: none; }
    .slide { border-radius: var(--radius); }
    .slide-cont {
        width: 100% !important; height: auto; aspect-ratio: 824 / 352;
        border-radius: var(--radius); overflow: hidden;
        box-shadow: var(--shadow);
    }
    .slide-item { top: 0; left: 0; width: 100%; height: 100%; }
    .slide-item img { width: 100% !important; height: 100% !important; object-fit: cover; }
    .slide-txt {
        width: 100% !important; height: auto; padding: 34px 12px 10px; line-height: 1.4;
        background: linear-gradient(to top, rgba(0, 0, 0, .78), rgba(0, 0, 0, 0));
    }
    .slide-mask { display: none; }
    .slide-tit {
        font-size: 13.5px; font-weight: 600; color: #fff; padding: 0;
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
        text-shadow: 0 1px 4px rgba(0, 0, 0, .5);
    }
    .slide-nav { bottom: 10px; right: 10px; height: auto; }
    .slide-nav a {
        width: 6px; height: 6px; margin: 0 3px; background: rgba(255, 255, 255, .45);
        border-radius: 3px; transition: width .25s ease, background .25s ease;
    }
    .slide-nav .nownav { width: 16px; background: #fff; }
    .nav-mask, #prev, #next { display: none; }

    /* ---------- 首页 · 头条 ---------- */
    .col_1 .headlines {
        float: none; width: 100%; margin-top: 12px;
        padding: 2px 14px 12px; background: var(--card);
        border: none; border-radius: var(--radius); box-shadow: var(--shadow);
    }
    .headlines h3 { padding-top: 12px; border-bottom: 1px dashed var(--line); }
    .headlines h3 a {
        height: auto; line-height: 1.45; font-size: 15.5px; font-weight: 700;
        color: var(--ink); text-align: left;
        display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
        overflow: hidden;
    }
    .headlines p { width: auto; height: auto; padding: 6px 0 10px; }
    .headlines p span {
        display: block; width: 100%; float: none; text-align: left;
        font-size: 12.5px; color: var(--mut); line-height: 1.5;
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .headlines p span a { color: var(--brand); font-size: 12.5px; }
    .headlines .hl3 { margin: 2px 0 0; width: 100%; }
    .headlines .hl3 ul { display: flex; flex-direction: column; gap: 6px; }
    .headlines .hl3 li { width: auto; height: auto; font-size: 13px; display: flex; align-items: center; gap: 8px; }
    .headlines .hl3 li a {
        flex: 1; min-width: 0; color: var(--ink-2); white-space: nowrap;
        overflow: hidden; text-overflow: ellipsis;
    }
    .headlines .hl3 li em {
        flex: 0 0 auto; width: auto; min-width: 40px; height: 20px; line-height: 20px;
        padding: 0 6px; font-size: 11px; text-align: center;
        border-radius: 5px; border: none; font-weight: 600;
    }
    .headlines .hl3 li em.ev { background: #fff3e8; color: #c2410c; }
    .headlines .hl3 li em.ns { background: #eafaf0; color: #15803d; }

    /* ---------- 首页 · 推荐游戏（两列 · 图上压字 + 卡底按钮条） ---------- */
    .col_2 { margin-top: 20px; }
    .col_2 ul { width: 100%; display: flex; flex-wrap: wrap; gap: 10px; margin-top: 0; }
    .col_2 li {
        position: relative; float: none; width: calc(50% - 5px); height: auto; margin: 0;
        background: var(--card); border-radius: var(--radius); overflow: hidden;
        box-shadow: var(--shadow);
        transition: transform .2s ease, box-shadow .2s ease;
    }
    .col_2 li > a { display: block; position: relative; line-height: 0; }
    .col_2 li img.gpic {
        width: 100%; height: auto; aspect-ratio: 275 / 160; object-fit: cover; display: block;
    }
    /* 游戏名：图下静态标题行（严谨、无重叠） */
    .col_2 li p {
        position: static; margin: 0; padding: 9px 10px 0;
        font-size: 13.5px; font-weight: 600; line-height: 1.35; color: var(--ink);
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .col_2 li .img_hover {
        position: static; left: auto; top: auto; width: 100%; height: auto;
        z-index: auto; overflow: visible; padding: 8px 8px 10px;
        display: flex; align-items: center; gap: 6px;
    }
    .col_2 li .img_hover .l,
    .col_2 li .img_hover .r > a,
    .col_2 li .img_hover .notice,
    .col_2 li .bg,
    .col_2 li .clear { display: none !important; }
    .col_2 li .img_hover .r {
        float: none; width: 100%; padding: 0;
        display: flex; align-items: center; gap: 6px;
    }
    .col_2 li .img_hover .r > div[style] {
        flex: 1; color: var(--mut-2) !important; font-size: 12px;
        text-align: center; line-height: 30px;
    }
    .col_2 li .img_hover .dl {
        float: none; flex: 1 1 50%; margin: 0; border: none;
        height: 30px; line-height: 30px; width: auto; text-align: center;
        border-radius: 15px; background: var(--grad);
        box-shadow: 0 2px 8px rgba(37, 99, 235, .25);
        transition: transform .16s ease, filter .16s ease;
    }
    .col_2 li .img_hover .dl a { display: block; color: #fff !important; font-size: 12px; font-weight: 500; }
    .col_2 li .img_hover .dl:active { transform: scale(.94); filter: brightness(1.05); }

    /* ---------- 首页 · 热门游戏（行卡 + 渐变按钮） ---------- */
    .col_3 { margin-top: 20px; }
    .col_3 .l { float: none; width: 100%; }
    .col_3 .r { float: none; width: 100%; margin-top: 20px; }
    .col_3 .mcs { border: none; margin-top: 0; }
    .col_3 .mcs dl {
        float: none; width: 100%; height: auto; padding: 10px 12px; margin-bottom: 10px;
        background: var(--card); border-radius: var(--radius); border: 1px solid var(--line);
        display: flex; align-items: center;
        box-shadow: var(--shadow);
        transition: transform .18s ease, box-shadow .18s ease;
    }
    .col_3 .mcs dl:active { transform: scale(.985); box-shadow: var(--shadow-up); }
    .col_3 .mcs dl.hover { background: var(--card); }
    .col_3 .mcs dt { float: none; width: 68px; flex: 0 0 auto; }
    .col_3 .mcs dt img { width: 68px; height: 68px; border-radius: 16px; object-fit: cover; }
    .col_3 .mcs dd { float: none; flex: 1; padding-left: 12px; min-width: 0; }
    .col_3 .mcs dd h3 {
        font-size: 14.5px; font-weight: 600; color: var(--ink);
        margin-bottom: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .col_3 .mcs dd h3 a { color: inherit; }
    .col_3 .mcs dd .gamestyle { padding: 0 0 6px; }
    .col_3 .mcs dd .gamestyle span { display: inline-block; font-size: 11.5px; color: var(--mut); background: var(--bg); padding: 2px 6px; border-radius: 4px; margin-right: 4px; }
    .col_3 .mcs dd .gamestyle span:empty { display: none; }
    .col_3 .mcs dd .gamedown { display: flex; flex-wrap: wrap; gap: 6px; }
    .col_3 .mcs dd .gamedown a {
        flex: 0 0 auto; width: auto; height: 28px; line-height: 28px; padding: 0 12px;
        font-size: 12px; font-weight: 500; border-radius: 14px;
        white-space: nowrap; box-sizing: border-box;
        background: var(--grad); color: #fff !important;
        box-shadow: 0 2px 6px rgba(37, 99, 235, .22);
        transition: transform .16s ease, filter .16s ease;
    }
    .col_3 .mcs dd .gamedown a:active { transform: scale(.94); filter: brightness(1.05); }
    .col_3 .mcs dd .gamedown a.gift {
        background: none; border: 1.5px solid var(--gold-bd); color: var(--gold) !important;
        box-shadow: none;
    }
    .col_3 .mcs dd .gamedown a.gift:active { background: var(--gold-bd); color: #fff !important; }

    /* 礼包开服 tab */
    .col_3 .r .tabs { background: none; border: none; }
    .col_3 .r .tabNavigation {
        display: flex; background: var(--card); border-radius: var(--radius-s);
        padding: 4px; gap: 4px;
        box-shadow: var(--shadow);
    }
    .col_3 .r .tabNavigation li { flex: 1; }
    .col_3 .r .tabNavigation li.big { font-size: 13px; font-weight: 700; color: var(--ink); text-align: center; line-height: 34px; }
    .col_3 .r .tabNavigation li.nor a {
        display: block; font-size: 13px; color: var(--mut); text-align: center;
        padding: 6px 0; border-radius: var(--radius-s); transition: all .2s ease;
    }
    .col_3 .r .tabNavigation li.nor a.on { background: var(--grad); color: #fff; font-weight: 600; }
    .col_3 .r .tabNavigation li.nor a:hover:not(.on) { background: var(--bg); color: var(--ink); }
    .col_3 .r .tabcon { border: none; margin-top: 10px; background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); }
    .col_3 .r .tabcon ul { height: auto; padding: 6px 0; }
    .col_3 .r .tabcon dl { border-radius: 0; }
    .col_3 .r .tabcon dl dd { width: auto; }
    .col_3 .r .tabcon li { padding: 10px 12px; border-bottom: 1px solid var(--line); }
    .col_3 .r .tabcon li:last-child { border-bottom: none; }
    .col_3 .r .tabcon h3 { font-size: 13.5px; font-weight: 600; margin-bottom: 2px; }
    .col_3 .r .tabcon p { font-size: 12px; color: var(--mut); }
    .col_3 .r .tabcon .package-btn {
        display: inline-block; padding: 4px 12px; font-size: 12px;
        border-radius: 12px; background: var(--grad); color: #fff !important;
        box-shadow: 0 2px 6px rgba(37, 99, 235, .22);
    }

    /* ---------- 首页 · 游戏活动（两列）+ 客服 ---------- */
    .col_4 { margin-top: 20px; }
    .col_4 .l { float: none; width: 100%; }
    .col_4 .r { float: none; width: 100%; margin-top: 20px; }
    .col_4 .l ul { width: 100%; display: flex; flex-wrap: wrap; gap: 10px; padding-bottom: 0; }
    .col_4 .l li {
        float: none; width: calc(50% - 5px); height: auto; margin: 0;
        background: var(--card); border-radius: var(--radius); overflow: hidden;
        box-shadow: var(--shadow); transition: transform .18s ease, box-shadow .18s ease;
    }
    .col_4 .l li:active { transform: scale(.975); box-shadow: var(--shadow-up); }
    .col_4 .l li img.gpic { width: 100%; height: auto; aspect-ratio: 275 / 170; object-fit: cover; display: block; }
    .col_4 .l li p, .col_4 .l li .cover { width: 100%; }
    .col_4 .l li p {
        font-size: 12.5px; font-weight: 500; padding: 8px 8px 10px;
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--ink);
    }
    .col_4 .r .cons { border: none; border-radius: var(--radius); height: auto; padding: 14px; background: var(--card); box-shadow: var(--shadow); }
    .col_4 .r .cons .mc { margin-bottom: 10px; }
    .col_4 .r .cons .mc span { display: block; font-size: 16px; font-weight: 700; color: var(--brand); margin-bottom: 4px; }
    .col_4 .r .cons .mc p { font-size: 12px; color: var(--mut); }
    .col_4 .r .cons .ot { font-size: 12.5px; color: var(--ink-2); line-height: 1.7; }
    .col_4 .r .cons .ot a { color: var(--brand); }

    /* ---------- 列表页通用 ---------- */
    .crumbs { font-size: 12.5px; color: var(--mut); padding: 12px 0; }
    .crumbs a { color: var(--mut); }
    .crumbs a:hover { color: var(--brand); }
    .crumbs em { font-weight: 500; color: var(--mut-2); }

    .gameclass { background: var(--card); border-radius: var(--radius); padding: 12px 14px; border: none; box-shadow: var(--shadow); margin-bottom: 14px; }
    .titi { font-size: 16px; font-weight: 700; color: var(--ink); margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
    .titi span { font-size: 13px; color: var(--mut); font-weight: 400; }
    .gameclasslist { display: flex; flex-wrap: wrap; gap: 6px; }
    .gameclasslist li { float: none; display: block; width: auto; margin: 0; }
    .gameclasslist li span { float: none; display: none; }
    .gameclasslist li p { float: none; display: flex; flex-wrap: wrap; gap: 6px; }
    .gameclasslist li p a {
        margin: 0; padding: 5px 14px; line-height: 1; font-size: 12.5px; border-radius: 16px;
        background: var(--bg); color: var(--ink-2); border: 1.5px solid transparent;
        transition: all .18s ease;
    }
    .gameclasslist li p a:hover { background: #eff4ff; border-color: var(--brand); color: var(--brand); }
    .gameclasslist li p a.curr { background: var(--grad); color: #fff !important; border-color: transparent; font-weight: 600; box-shadow: 0 2px 8px rgba(37, 99, 235, .3); }

    .gameslist { width: 100%; margin: 0 0 14px; }
    .gameslist li {
        float: none; width: 100%; margin: 0 0 10px; padding: 10px 12px;
        display: flex; align-items: center;
        background: var(--card); border-radius: var(--radius); box-sizing: border-box;
        box-shadow: var(--shadow);
        transition: transform .18s ease, box-shadow .18s ease;
    }
    .gameslist li:active { transform: scale(.985); box-shadow: var(--shadow-up); }
    .gameslistl { float: none; width: 72px; margin: 0; flex: 0 0 auto; }
    .gameslistl img { width: 72px; height: 72px; border-radius: 12px; object-fit: cover; }
    .gameslistr { width: auto; flex: 1; padding: 0 0 0 12px; min-width: 0; }
    .gameslistr h3 { font-size: 14.5px; font-weight: 600; padding-bottom: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--ink); }
    .gameslistr p { font-size: 12px; color: var(--mut); margin-bottom: 4px; }
    .gameslistr p span { margin-right: 8px; }
    .gameslistr .jianjie { line-height: 1.45; padding: 0 0 6px; }
    .gameslistr .jianjie a { font-size: 12px; color: var(--mut-2); }
    .ganlink a {
        display: inline-block; height: 28px; line-height: 28px; padding: 0 12px;
        font-size: 12px; border-radius: 14px; margin-right: 6px; text-align: center;
        background: var(--grad); color: #fff !important;
        box-shadow: 0 2px 6px rgba(37, 99, 235, .22);
        transition: transform .16s ease, filter .16s ease;
    }
    .ganlink a:active { transform: scale(.94); filter: brightness(1.05); }
    .ganlink a.gift, .ganlink a._blank[href*="gift"] { background: none; border: 1.5px solid var(--gold-bd); color: var(--gold) !important; box-shadow: none; }
    .ganlink a._blank[href*="gift"]:active { background: var(--gold-bd); color: #fff !important; }
    .ganlink a:disabled, .ganlink a[style*="color:green"] { background: #f3f4f6; color: var(--mut-2) !important; border-color: #e5e7eb; box-shadow: none; cursor: default; }

    /* 分页 */
    .page { width: 100%; text-align: center; height: auto; padding: 14px 0 6px; display: block; overflow: hidden; line-height: 26px; }
    .page a, .page span {
        border-radius: 8px; height: 30px; line-height: 30px; font-size: 13px;
        padding: 0 10px; margin: 0 3px; font-family: inherit; background: var(--card);
        border: 1px solid var(--line); color: var(--ink-2); text-decoration: none;
        transition: all .18s ease;
    }
    .page a:hover { background: var(--grad); color: #fff; border-color: transparent; box-shadow: 0 2px 8px rgba(37, 99, 235, .3); }
    .page span { background: var(--grad); color: #fff; border-color: transparent; font-weight: 600; }
    .page .pager-dot { background: none; color: var(--mut-2); border: none; }

    /* ---------- 游戏详情页 ---------- */
    #gameshow .l { float: none; width: 100%; }
    #gameshow .r { float: none; width: 100%; margin-top: 14px; }
    .gameinti { padding: 16px 14px; border: none; border-radius: var(--radius); background: var(--card); box-shadow: var(--shadow); }
    .gameintile { float: none; width: 100%; text-align: center; }
    .gameintile img { width: 120px !important; height: 120px !important; border-radius: 20px; object-fit: cover; display: block; margin: 0 auto; }
    .gameintile .score {
        display: inline-block; margin-top: 6px; padding: 2px 10px;
        background: var(--grad); color: #fff; font-size: 13px; font-weight: 700;
        border-radius: 12px; box-shadow: 0 2px 8px rgba(37, 99, 235, .32);
    }
    .gameintiri { float: none; width: 100%; padding-top: 14px; border-top: 1px solid var(--line); }
    .gameintiritit { float: none; width: 100%; font-size: 13px; }
    .gameintiritit h3 { font-size: 18px; font-weight: 700; color: var(--ink); margin-bottom: 6px; }
    .gameintiritit p { font-size: 12.5px; color: var(--mut); line-height: 1.6; margin-bottom: 3px; }
    .gameintiritit p strong { color: var(--ink-2); font-weight: 600; }
    .gaminwex { float: none; width: 100%; text-align: center; padding: 12px 0 8px; }
    .gaminwex span { float: none; display: block; }
    .gaminwex img { width: 96px !important; height: 96px !important; border-radius: 12px; display: block; margin: 0 auto 6px; }
    .gaminwex span::after { content: '扫码下载'; font-size: 12px; color: var(--mut); }
    .gaindow { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 8px; }
    .gaindow a {
        flex: 1 1 45%; min-width: 0; margin: 0; border-radius: var(--radius-s); height: 40px;
        line-height: 40px; text-align: center; font-size: 14px; font-weight: 600;
        background: var(--grad); color: #fff !important;
        box-shadow: 0 4px 12px rgba(37, 99, 235, .32);
        transition: transform .16s ease, filter .16s ease;
    }
    .gaindow a:active { transform: scale(.96); filter: brightness(1.05); }
    .gaindow a[style*="#dc2d11"] { background: #e5e7eb !important; color: var(--mut) !important; box-shadow: none; }
    .gaindow #cuow { flex: 0 0 100%; color: var(--mut-2) !important; background: none !important; box-shadow: none !important; font-size: 12px; text-align: center; margin-top: 4px; }
    .gameincount .gamtiti { font-size: 16px; font-weight: 700; color: var(--ink); margin: 18px 0 10px; padding-left: 12px; border-left: 3px solid var(--brand); }
    .gameincount .intro { font-size: 13.5px; color: var(--ink-2); line-height: 1.75; padding: 10px 12px; background: var(--bg); border-radius: var(--radius-s); }
    .gameincount .gaminimg div { width: 100%; overflow-x: auto; display: flex; gap: 8px; padding: 4px 0 10px; }
    .gameincount .gaminimg img { width: 140px; height: 78px; border-radius: 8px; object-fit: cover; flex-shrink: 0; }

    /* ---------- 礼包列表 ---------- */
    #giftlist { margin-top: 10px; }
    #giftlist ul { width: 100%; }
    #giftlist li {
        float: none; width: 100%; height: auto; margin: 0 0 10px; padding: 10px 12px;
        border: none; background: var(--card); border-radius: var(--radius);
        box-sizing: border-box; box-shadow: var(--shadow);
        display: flex; align-items: center; gap: 12px;
    }
    #giftlist li .l { width: 68px; padding: 0; flex: 0 0 auto; }
    #giftlist li .l img { width: 68px; height: 68px; border-radius: 12px; object-fit: cover; }
    #giftlist li .r { width: auto; padding: 0; flex: 1; min-width: 0; }
    #giftlist li .r h3 { font-size: 14.5px; font-weight: 600; color: var(--ink); margin-bottom: 2px; }
    #giftlist li .r .bn { position: static; margin-top: 8px; }
    #giftlist li .r .bn a {
        display: inline-block; border-radius: 14px; height: 30px; line-height: 30px;
        padding: 0 14px; font-size: 12.5px; font-weight: 500;
        background: var(--grad); color: #fff !important;
        box-shadow: 0 2px 6px rgba(37, 99, 235, .22);
    }

    /* ---------- 新闻列表 / 详情 ---------- */
    #newlist .l { float: none; width: 100%; }
    #newlist .r { float: none; width: 100%; margin-top: 14px; }
    .ntab { display: flex; flex-wrap: wrap; gap: 8px; }
    .ntab li {
        width: calc(50% - 4px); background: var(--card); border-radius: var(--radius-s);
        overflow: hidden; box-shadow: var(--shadow);
        transition: transform .18s ease;
    }
    .ntab li:active { transform: scale(.975); }
    .ntab li img { width: 100%; height: 72px; object-fit: cover; display: block; }
    .ntab li span { display: none; }
    .ntab li h4 { font-size: 13.5px; font-weight: 600; line-height: 1.4; padding: 8px 10px 10px; color: var(--ink); margin: 0; }
    #newshow .meta { width: 100%; font-size: 12px; color: var(--mut); padding: 12px 0; border-bottom: 1px solid var(--line); }
    #newshow .cons { width: 100%; padding: 14px 2px; font-size: 14px; line-height: 1.75; color: var(--ink-2); }
    #newshow .title { font-size: 18px; font-weight: 700; color: var(--ink); padding-bottom: 8px; }

    /* ---------- 客服中心 ---------- */
    #service_main { margin: 0 0 12px; background: var(--card); border-radius: var(--radius); padding: 14px; box-shadow: var(--shadow); }
    #service_main h3 { font-size: 15px; font-weight: 700; color: var(--ink); margin-bottom: 10px; }
    #service_main ul { padding: 0; display: flex; flex-wrap: wrap; }
    #service_main li { width: 50%; margin: 8px 0; text-align: center; }
    #service_main li a {
        display: block; padding: 10px 6px; font-size: 12.5px; color: var(--ink-2);
        background: var(--bg); border-radius: var(--radius-s);
        transition: all .18s ease;
    }
    #service_main li a:hover { background: #eff4ff; color: var(--brand); box-shadow: 0 2px 8px rgba(37, 99, 235, .12); }
    #service_bot { margin: 0 0 12px; }
    #service_bot #left { float: none; width: 100%; }
    #service_bot #right { float: none; width: 100%; padding-top: 12px; }
    #ser_sub #l { float: none; width: 100%; height: auto; padding: 8px; margin-bottom: 12px; background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); }
    #ser_sub #l ul { display: flex; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    #ser_sub #l li { float: none; flex: 0 0 auto; padding: 0 14px; line-height: 38px; height: 38px; font-size: 13px; color: var(--mut); border-radius: 19px; margin-right: 6px; }
    #ser_sub #r { float: none; width: 100%; padding: 14px; box-sizing: border-box; border-radius: var(--radius); background: var(--card); box-shadow: var(--shadow); }
    #ser_sub #r h4 { font-size: 17px; font-weight: 700; line-height: 48px; color: var(--ink); margin: 0; }

    /* ---------- 会员中心 ---------- */
    #member_l { float: none; width: 100%; height: auto; padding: 6px 0; border-radius: var(--radius); margin-bottom: 12px; background: var(--card); box-shadow: var(--shadow); }
    #member_l dl { margin: 0; display: flex; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    #member_l dt { display: none; }
    #member_l dd { float: none; flex: 0 0 auto; line-height: 40px; }
    #member_l dd a { padding: 0 16px; font-size: 13.5px; color: var(--mut); border-radius: 20px; transition: all .18s ease; }
    #member_l dd a:hover { color: var(--brand); background: #eff4ff; }
    #member_r { float: none; width: 100%; padding: 14px; box-sizing: border-box; border-radius: var(--radius); background: var(--card); box-shadow: var(--shadow); }
    #profile .img { width: 64px; height: 64px; }
    #profile .img .uc-avatar { width: 64px; height: 64px; border-radius: 50%; }
    #profile .otherinfo { float: none; width: 100%; }
    #profile .otherinfo p { font-size: 16px; font-weight: 600; color: var(--ink); margin-bottom: 4px; }
    .game_mod li { width: calc(33.33% - 10px); padding: 14px 5px 0; }
    .game_mod li a { font-size: 12.5px; color: var(--mut); text-align: center; display: block; padding: 8px; border-radius: var(--radius-s); transition: all .18s ease; }
    .game_mod li a:hover { background: var(--bg); color: var(--brand); }

    /* ---------- 充值 / 支付页 ---------- */
    .pay_box { width: 100%; padding-top: 12px; }
    .pay_l { float: none; width: 100%; border-left: none; }
    .pay_l_t { width: 100%; height: auto; padding: 8px 0; font-size: 16px; font-weight: 700; color: var(--ink); }
    .pay_l ul { display: flex; gap: 6px; padding-bottom: 8px; }
    .pay_l li, .pay_l li:hover, .pay_l .li_h {
        float: none; width: auto; flex: 1; padding: 0; text-align: center;
        height: 40px; line-height: 40px; background: var(--card); border: 1.5px solid var(--line);
        border-radius: var(--radius-s); color: var(--ink-2); font-size: 13px;
        transition: all .18s ease;
    }
    .pay_l .li_h { border-color: var(--brand); color: var(--brand); font-weight: 600; background: #eff4ff; }
    .pay_r { float: none; width: 100%; border-top: none; padding: 8px 0; }
    .pay_r_t { width: 100%; padding: 8px; background: none; height: auto; line-height: 1.6; }
    .cz_ul { width: 100%; }
    .cz_ul li { margin-bottom: 10px; background: var(--card); border-radius: var(--radius-s); padding: 12px; }
    .cz_ul li span.label_name { text-align: left; width: auto; display: block; margin-bottom: 6px; color: var(--mut); font-size: 12.5px; }
    .zh_input { display: block; width: 100%; box-sizing: border-box; margin-left: 0; height: 36px; border-radius: var(--radius-s); border: 1.5px solid var(--line); font-size: 14px; padding: 0 10px; background: var(--bg); color: var(--ink); }
    .zh_input:focus { border-color: var(--brand); background: #fff; outline: none; }
    .pay_money_box { width: 100%; float: none; margin-left: 0; display: flex; flex-wrap: wrap; }
    .pay_money_box span { width: 31%; height: 40px; margin: 4px 1.5% 4px 0; box-sizing: border-box; border-radius: var(--radius-s); border: 1.5px solid var(--line); background: var(--card); }
    .pay_money_box span font { width: 100%; height: 38px; line-height: 38px; display: block; text-align: center; font-size: 13px; color: var(--ink-2); font-weight: 500; }
    .pay_money_box span:active { border-color: var(--brand); }
    a.pay_submit {
        width: 100%; border-radius: var(--radius-s); background: var(--grad);
        color: #fff !important; border: none; height: 44px; line-height: 44px;
        font-size: 15px; font-weight: 700;
        box-shadow: 0 4px 14px rgba(37, 99, 235, .35);
        transition: transform .16s ease, filter .16s ease;
    }
    a.pay_submit:active { transform: scale(.975); filter: brightness(1.05); }

    /* ---------- 表单 / 弹窗 ---------- */
    .login, .reg { width: 92%; max-width: 420px; left: 4%; right: auto; margin-left: 0; top: 12%; border-radius: var(--radius); background: var(--card); }
    .login .formbox .txtinput, .reg .formbox .txtinput, .reg .formbox .txtcode {
        width: 100%; box-sizing: border-box; height: 40px;
        border: 1.5px solid var(--line); border-radius: var(--radius-s);
        padding: 0 10px; font-size: 14px; background: var(--bg); color: var(--ink);
    }
    .login .formbox .txtinput:focus, .reg .formbox .txtinput:focus { border-color: var(--brand); background: #fff; outline: none; }
    .login .formbox #sub, .reg .formbox #sub {
        width: 100%; border-radius: var(--radius-s); background: var(--grad);
        height: 44px; line-height: 44px; font-size: 15px; font-weight: 700;
        box-shadow: 0 4px 14px rgba(37, 99, 235, .35);
    }
    .login .formbox #sub:active, .reg .formbox #sub:active { transform: scale(.975); }
    .g-pop .m-box, .g-login-pop .m-box { width: 92%; max-width: 420px; left: 4%; margin-left: 0; border-radius: var(--radius); background: var(--card); }
    .g-login-pop .form-box { padding-left: 16px; padding-right: 16px; }
    .g-login-pop .title-bar { margin: 20px 0 16px; }
    .g-login-pop input, .g-login-pop .login-btn, .g-login-pop .tabewmsub {
        width: 100%; box-sizing: border-box; border-radius: var(--radius-s);
        border: 1.5px solid var(--line); padding: 0 12px; height: 40px; font-size: 14px;
    }
    .g-login-pop input:focus { border-color: var(--brand); outline: none; }
    .g-login-pop .clear-text { left: auto; right: 12px; }
    .g-login-pop .placeholder { width: auto; right: 0; }
    .g-register-pop .m-register-box { left: 4%; width: 92%; margin-left: 0; border-radius: var(--radius); background: var(--card); }
    .info_fill div input { width: 96%; box-sizing: border-box; border: 1.5px solid var(--line); border-radius: var(--radius-s); padding: 0 10px; height: 36px; font-size: 14px; background: var(--bg); }
    .info_fill div input:focus { border-color: var(--brand); background: #fff; outline: none; }
    .info_fill div.verify input { width: 60%; }
    .appeal_div { width: 100%; box-sizing: border-box; white-space: normal; }
    .appeal_textarea { width: 96%; box-sizing: border-box; border: 1.5px solid var(--line); border-radius: var(--radius-s); padding: 10px; font-size: 13.5px; background: var(--bg); }
    .wx_gift_ok .box { width: 92%; max-width: 420px; left: 4%; right: auto; margin: 0; top: 15%; border-radius: var(--radius); background: var(--card); }

    /* ---------- 通用兜底 ---------- */
    .gamelistbox { width: 100%; }
    .gamelistbox li { width: 100%; margin: 0 0 14px; background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); }
    .gamelistbox li .box01 { width: auto; }
    .edit_info .td_r select, .edit_pass form div .inp_txt, .edit_pass form div .inp_code { width: 100%; box-sizing: border-box; border: 1.5px solid var(--line); border-radius: var(--radius-s); padding: 0 10px; height: 36px; font-size: 14px; background: var(--bg); }
    .edit_info .td_r select:focus, .edit_pass form div .inp_txt:focus { border-color: var(--brand); outline: none; }
    .other_dat th.dat_1 { width: auto; }
    .other_dat td { padding: 10px 12px; font-size: 13px; color: var(--ink-2); }

    /* ---------- 底部：深色收尾 ---------- */
    .footer {
        background: #0a1220; padding: 28px 0 32px; margin-top: 26px;
        color: rgba(255, 255, 255, .55);
    }
    .footer .wrap_w { padding: 0 12px; }
    .f-links { height: auto; padding: 0 6px 16px; border-bottom: 1px solid rgba(255, 255, 255, .08); }
    .f-links span { position: static; width: auto; display: block; text-align: center; margin-bottom: 8px; color: rgba(255, 255, 255, .4); font-size: 12px; }
    .f-links .roll { overflow-x: auto; white-space: nowrap; text-align: center; }
    .f-links .roll li { float: none; display: inline-block; margin: 0 6px; }
    .f-links .roll li a { color: rgba(255, 255, 255, .55); font-size: 12.5px; padding: 4px 0; transition: color .18s ease; }
    .f-links .roll li a:hover { color: #fff; }
    .infoot { height: auto; padding-top: 16px; display: flex; flex-direction: column; align-items: center; }
    .infoot .ifl { float: none; width: auto; height: auto; margin: 0 auto 12px; padding: 0; text-align: center; }
    .infoot .ifl img { width: auto; height: 40px; border-radius: 8px; }
    .infoot .ifc { float: none; width: 100%; padding: 0; text-align: center; font-size: 11.5px; color: rgba(255, 255, 255, .42); line-height: 1.8; }
    .infoot .ifc p a { color: rgba(255, 255, 255, .55); transition: color .18s ease; }
    .infoot .ifc p a:hover { color: #fff; }
    .infoot .ifc p span { color: rgba(255, 255, 255, .25); margin: 0 6px; }
    .infoot .ifr { float: none; width: auto; height: auto; margin: 14px auto 0; padding: 0; text-align: center; }
    .infoot .ifr img { width: 80px; height: 80px; border-radius: 10px; }

    /* ---------- 通用渐变按钮 ---------- */
    .doandr, .gaindow a, a.pay_submit, .package-btn, .game-package-now span a, .get, .rank-checkin a {
        border-radius: var(--radius-s);
    }
    .slide-nav .nownav { background: var(--brand); }

    /* ---------- 安全区适配 (iPhone X+) ---------- */
    @supports (padding-bottom: env(safe-area-inset-bottom)) {
        .menu { padding-bottom: env(safe-area-inset-bottom); }
        .footer { padding-bottom: calc(32px + env(safe-area-inset-bottom)); }
        body { padding-bottom: env(safe-area-inset-bottom); }
    }

    /* ---------- 交互反馈统一 ---------- */
    button, input[type="submit"], a { transition: all .16s ease; }
    button:active, input[type="submit"]:active, a:active { transform: scale(.96); }
    a { text-decoration: none; }
}

/* =====================================================================
   桌面端品牌细节（≥769px 生效）
   修复：LOGO 被容器拉伸 → 原比例方形；推荐游戏悬浮层错位/绿圈绿字/
   红条土气 → 拟态玻璃面板刚好盖住缩略图；热门游戏按钮同款统一。
   ===================================================================== */
@media screen and (min-width: 769px) {

    /* —— 新方形 LOGO：杜绝被 190×60 容器拉成矩形 —— */
    .header .logo { width: auto; height: auto; background: none !important; }
    .header .logo a { width: auto; height: auto; }
    .header .logo img { width: 56px !important; height: 56px !important; border-radius: 12px; }
    .infoot .ifl { width: auto; height: auto; }
    .infoot .ifl img { width: 52px !important; height: 52px !important; border-radius: 10px; }

    /* 悬浮时深色轻纱托底（透出底图，配合拟态玻璃） */
    .col_2 li .bg {
        top: 0; height: 160px; opacity: 0 !important;
        background: #0b1526; transition: opacity .28s ease;
    }
    .col_2 li:hover .bg { opacity: .40 !important; }

    /* 悬浮面板：拟态玻璃 · 刚好盖住缩略图（160px，不多不少） */
    .col_2 li .img_hover {
        height: 160px;
        font-family: 'Microsoft YaHei', '微软雅黑', 'PingFang SC', Arial, sans-serif;
        background: rgba(10, 22, 46, .40);
        -webkit-backdrop-filter: blur(16px) saturate(1.5);
        backdrop-filter: blur(16px) saturate(1.5);
        border-bottom: 1px solid rgba(255, 255, 255, .14);
        box-shadow: 0 10px 28px rgba(11, 21, 38, .35);
    }
    /* 红条通知栏：直接移除 */
    .col_2 li .img_hover .notice { display: none; }

    /* 二维码白卡 */
    .col_2 li .img_hover .l { height: auto; padding: 12px 0 0 12px; }
    .col_2 li .img_hover .l img {
        width: 84px; background: #fff; padding: 4px;
        border-radius: 8px; box-sizing: border-box;
    }
    /* 信息列 */
    .col_2 li .img_hover .r { width: 150px; padding: 12px 10px 0 12px; box-sizing: border-box; }
    .col_2 li .img_hover .r > a { display: block; }
    .col_2 li .img_hover .r h3 {
        font-size: 15px; font-weight: 700; color: #fff;
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
        text-shadow: 0 1px 4px rgba(0, 10, 30, .65);
    }
    .col_2 li .img_hover .r .star { color: #bfdbfe; font-size: 11px; height: 16px; line-height: 16px; }
    .col_2 li .img_hover .r .info { color: #93c5fd; font-size: 12px; }
    .col_2 li .img_hover .r > div[style] { color: #e2e8f0 !important; font-size: 12px; text-align: center; }

    /* 下载按钮：品牌蓝实心胶囊（去绿圈、去绿字） */
    .col_2 li .img_hover .r .dl {
        float: left; width: auto; height: auto; line-height: normal;
        border: none; border-radius: 0; margin: 8px 6px 0 0; background: none;
    }
    .col_2 li .img_hover .r .dl br { display: none; }
    .col_2 li .img_hover .r .dl a {
        display: block; height: 26px; line-height: 26px; padding: 0 12px;
        background: linear-gradient(135deg, #3b82f6, #2563eb 55%, #1d4ed8);
        color: #fff !important; border-radius: 13px;
        font-size: 11.5px; font-weight: 500;
        box-shadow: 0 2px 8px rgba(37, 99, 235, .45);
        transition: transform .15s ease, filter .15s ease;
    }
    .col_2 li .img_hover .r .dl a:hover { filter: brightness(1.08); transform: translateY(-1px); }
    .col_2 li .img_hover .r .dl a:active { transform: scale(.95); }

    /* 热门游戏下载按钮：同款统一（去绿框绿字） */
    .col_3 .mcs dd .gamedown a {
        width: auto; height: 26px; line-height: 26px; padding: 0 13px;
        border: none; border-radius: 13px; color: #fff;
        background: linear-gradient(135deg, #3b82f6, #2563eb 55%, #1d4ed8);
        box-shadow: 0 2px 6px rgba(37, 99, 235, .3);
        transition: filter .15s ease;
    }
    .col_3 .mcs dd .gamedown a:hover { background: linear-gradient(135deg, #2563eb, #1e40af); color: #fff; }
    .col_3 .mcs dd .gamedown .gift {
        background: #fff7ed; color: #c2410c; border: 1px solid #f0b23e;
        height: 24px; line-height: 24px; box-shadow: none;
    }
    .col_3 .mcs dd .gamedown .gift:hover { background: #ffedd5; color: #c2410c; }
}

/* =====================================================================
   PC 端头部/导航「蓝晶剔透」（≥769px 生效）
   搜索 PANEL + 主导航统一换亮蓝渐变基调：半透明 + 毛玻璃 + 高光层，
   衬以 hero_particles.js 的 THREE 蓝晶星云粒子；导航悬浮升级为
   玻璃悬浮胶囊（上浮 + 高光描边 + 按钮内扫光），选中项渐变发光。
   ===================================================================== */
@media screen and (min-width: 769px) {

    /* 头部：亮蓝渐变剔透面板（透出粒子光效） */
    .header {
        position: relative; z-index: 1; overflow: visible;
        background: linear-gradient(118deg,
            rgba(8, 52, 148, .74) 0%, rgba(23, 100, 220, .62) 42%,
            rgba(56, 160, 246, .56) 70%, rgba(16, 74, 190, .70) 100%);
        -webkit-backdrop-filter: blur(3px) saturate(1.35);
        backdrop-filter: blur(3px) saturate(1.35);
        box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .18),
                    inset 0 1px 0 rgba(255, 255, 255, .22),
                    0 10px 30px rgba(9, 40, 110, .22);
    }
    /* 顶部高光流动层（剔透感） */
    .header::before {
        content: ''; position: absolute; left: 0; right: 0; top: 0; height: 46%;
        background: linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, 0));
        pointer-events: none;
    }
    .header .wrap_w { position: relative; z-index: 1; }

    /* 顶栏文字链融入蓝底 */
    .topbar {
        background: rgba(4, 18, 48, .28); border-bottom: 1px solid rgba(255, 255, 255, .10);
        color: #cfe3ff;
    }
    .topleft a { color: #bcd7ff; transition: color .2s ease; }
    .topleft a:hover { color: #fff; }

    /* 搜索胶囊：白色玻璃 */
    .searchbar { display: flex; }
    .searchstyle {
        width: 78%; height: 38px; margin: 0; padding: 0 16px; float: left;
        border: 1px solid rgba(255, 255, 255, .55); border-right: none;
        border-radius: 19px 0 0 19px; background: rgba(255, 255, 255, .92);
        font-size: 13px; color: #1b1f27;
        box-shadow: inset 0 2px 6px rgba(9, 40, 110, .10);
        transition: box-shadow .25s ease, background .25s ease;
    }
    .searchstyle:focus {
        outline: none; background: #fff;
        box-shadow: 0 0 0 3px rgba(125, 211, 252, .45), inset 0 2px 6px rgba(9, 40, 110, .08);
    }
    .searchstyle::-webkit-input-placeholder { color: #9aa1ab; }
    .searchebtn {
        width: 22%; height: 38px; float: left; border: none; cursor: pointer;
        border-radius: 0 19px 19px 0; color: #fff; font-size: 14px; letter-spacing: 4px;
        background: linear-gradient(135deg, #38bdf8 0%, #2563eb 60%, #1d4ed8 100%);
        box-shadow: 0 4px 14px rgba(37, 99, 235, .45), inset 0 1px 0 rgba(255, 255, 255, .35);
        transition: filter .2s ease, transform .2s ease, box-shadow .2s ease;
    }
    .searchebtn:hover { filter: brightness(1.12); box-shadow: 0 6px 20px rgba(37, 99, 235, .55), inset 0 1px 0 rgba(255, 255, 255, .35); }
    .searchebtn:active { transform: scale(.97); }

    .searchhot { height: 20px; line-height: 20px; overflow: hidden; margin-top: 10px; }
    .searchhot span { font-weight: 600; color: #cfe3ff; vertical-align: middle; }
    .searchhot a { margin: 0 8px; color: #a9caff; transition: color .2s ease; }
    .searchhot a:hover { color: #fff; }

    /* 主导航：深亮蓝玻璃横带（粒子从雾面玻璃后透出） */
    .menu {
        position: relative; z-index: 2;
        background: linear-gradient(118deg,
            rgba(5, 26, 74, .80) 0%, rgba(14, 66, 164, .72) 45%,
            rgba(29, 106, 216, .64) 72%, rgba(7, 34, 96, .78) 100%);
        -webkit-backdrop-filter: blur(9px) saturate(1.5);
        backdrop-filter: blur(9px) saturate(1.5);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14),
                    inset 0 -1px 0 rgba(0, 20, 60, .35),
                    0 10px 26px rgba(7, 34, 96, .28);
    }
    .menu ul { height: 54px; line-height: 54px; position: relative; }
    .menu ul li { height: 54px; position: relative; }
    .menu ul li a {
        position: relative; height: 54px; padding: 0 34px;
        font-size: 15.5px; font-weight: 500; letter-spacing: 1px; color: #dbeafe;
        overflow: hidden;
        transition: color .25s ease, text-shadow .25s ease;
    }
    /* 悬浮：玻璃悬浮胶囊（上浮 + 高光描边） */
    .menu ul li a::before {
        content: ''; position: absolute; inset: 8px 8px; border-radius: 12px;
        background: rgba(255, 255, 255, .12);
        border: 1px solid rgba(190, 225, 255, .45);
        opacity: 0; transform: translateY(7px) scale(.94);
        transition: opacity .28s ease, transform .28s cubic-bezier(.22, 1, .36, 1),
                    box-shadow .28s ease, background .28s ease;
    }
    .menu ul li a:hover { color: #fff; background: none; text-shadow: 0 0 12px rgba(125, 211, 252, .8); }
    .menu ul li:hover a::before {
        opacity: 1; transform: translateY(0) scale(1);
        box-shadow: 0 6px 18px rgba(6, 30, 80, .45), 0 0 22px rgba(56, 189, 248, .30),
                    inset 0 0 12px rgba(56, 189, 248, .12);
    }
    /* 按钮内扫光（悬浮时划过） */
    .menu ul li a::after {
        content: ''; position: absolute; top: 0; bottom: 0; left: -70%; width: 45%;
        background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .50), transparent);
        transform: skewX(-18deg);
        transition: left .55s ease;
        pointer-events: none;
    }
    .menu ul li:hover a::after { left: 130%; }
    /* 选中项：品牌蓝渐变发光胶囊 */
    .menu ul li.cur { background: none; }
    .menu ul li.cur a { color: #fff; font-weight: 700; text-shadow: 0 1px 3px rgba(0, 30, 90, .5); }
    .menu ul li.cur a::before {
        opacity: 1; transform: none;
        background: linear-gradient(135deg, #38bdf8 0%, #2563eb 55%, #1d4ed8 100%);
        border-color: rgba(255, 255, 255, .45);
        box-shadow: 0 4px 18px rgba(37, 99, 235, .55), 0 0 26px rgba(56, 189, 248, .30),
                    inset 0 1px 0 rgba(255, 255, 255, .35);
    }
    /* 选中项底部霓虹下划线 */
    .menu ul li.cur::after {
        content: ''; position: absolute; left: 34px; right: 34px; bottom: 4px; height: 2px;
        border-radius: 2px; background: #7dd3fc; z-index: 3;
        box-shadow: 0 0 8px #38bdf8, 0 0 16px #38bdf8;
        pointer-events: none;
    }

    /* 降低动态偏好时收敛动效 */
    @media (prefers-reduced-motion: reduce) {
        .menu ul li a::before { transition: opacity .2s ease; transform: none; }
        .menu ul li a::after { display: none; }
    }
}


/* ===== 2026-10-29 布局修复：首页区块回归容器 / 新闻与海报留距 / 详情页收窄 ===== */
@media screen and (min-width: 769px) {
    .col_1 .headlines {
        width: 342px; margin-left: 28px; padding: 6px 14px 10px;
        box-sizing: border-box; border-left: 1px solid #e6e6e6;
    }
    .col_1 .headlines h3 { padding: 4px 0 2px; }
    .col_1 .headlines h3 a {
        height: auto; line-height: 1.45; padding: 0; font-size: 17px;
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .col_1 .headlines p {
        width: auto; height: auto; line-height: 1.6; margin: 0 0 8px;
        white-space: normal; padding-bottom: 8px; border-bottom: 1px dashed #eee;
    }
    .col_1 .headlines p:last-of-type { border-bottom: none; padding-bottom: 2px; }
    .col_1 .headlines p span { float: none; display: block; }
    .col_1 .headlines p .hl-desc {
        display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
        overflow: hidden; white-space: normal;
    }
    .col_1 .headlines p span a {
        display: inline-block; margin-left: 6px; font-size: 13px;
        color: #8a8f99; text-decoration: none; vertical-align: baseline;
    }
    .col_1 .headlines p span a:hover { color: #DC2D11; text-decoration: none; }
    .col_1 .headlines .hl3 {
        margin: 18px 0 0; padding: 14px 0 2px; border-top: 1px dotted #ddd;
    }
    .col_1 .headlines .hl3 li { width: auto; height: auto; line-height: 2.1; padding-bottom: 2px; }
    /* 首页整体略窄于主导航（1200），底部区块同步收窄 */
    .main.wrap_w { width: 1160px; }
    .col_1 .l { width: 788px; }
    .col_1 .l .slide-cont, .col_1 .l .slide-item,
    .col_1 .l .slide-mask, .col_1 .l .slide-txt { width: 100%; }
    .col_1 .l .slide-item img { width: 100%; height: 352px; object-fit: cover; }
    .col_1 .headlines { margin-left: 24px; }
    .col_2 ul, .col_4 .l ul { width: 100%; }
    .col_2 li { width: 272px; margin-right: 24px; }
    .col_2 li:nth-child(4n) { margin-right: 0; }
    .col_2 li img.gpic { width: 100%; }
    .col_3 .l, .col_4 .l { width: 876px; }
    .col_3 .mcs dl { width: 262px; }
    .main_sub.wrap_w { width: 1140px; }
/* 个人中心/客服中心等子页面内容与页脚同步收窄 */
.wrap_w.wrap_narrow { width: 1160px; }
.wrap_w.wrap_narrow #member_l { width: 220px; }
.wrap_w.wrap_narrow #member_r { width: 860px; padding: 30px; }

/* 页脚与主内容同步收窄，不宽于主导航 */
.footer .area.wrap_w { width: 1160px; }
    #newlist .l { width: 838px; }
    #newshow .meta, #newshow .cons { width: 100%; }
}


/* ============================================================
   2026-10-29 移动端修补：底部导航遮挡 / 新闻列表 / 新闻详情 / 客服模块 / 游戏详情
   ============================================================ */
/* 遗留底部悬浮广告条会盖住底部导航并拦截点击，直接隐藏 */
#vivo-head, .vivo-search, .vivo-nav { display: none !important; }

@media screen and (max-width: 768px) {
    /* 为固定底部导航留出安全区 */
    body { padding-bottom: calc(86px + env(safe-area-inset-bottom)); }

    /* 主导航面板与底部导航面板左右各缩进 12px；中间内容列再窄一档（20px），
       形成“上下两道框、中间略收”的统一版心，和桌面端 1200/1160 的关系一致 */
    .wrap_w { padding-left: 20px; padding-right: 20px; }
    .main.wrap_w, .main_sub.wrap_w, .wrap_w.wrap_narrow { width: 100%; }
    .footer .wrap_w { padding: 0 20px; }

    /* ---- 新闻列表：标签横排、卡片两列平铺 ---- */
    #newlist .l .tabNavigation {
        display: flex; flex-wrap: nowrap; gap: 2px; overflow-x: auto;
        border-bottom: 1px solid var(--line); -webkit-overflow-scrolling: touch;
    }
    #newlist .l .tabNavigation li { float: none; flex: 0 0 auto; margin: 0; }
    #newlist .l .tabNavigation li a {
        float: none; margin: 0; padding: 0 12px; font-size: 14px; line-height: 42px; white-space: nowrap;
    }
    #newlist .l .tabNavigation li a.on { font-size: 15px; }
    .ntab { display: block; }
    .ntab > ul { display: flex; flex-wrap: wrap; gap: 8px; padding: 10px 0 0; margin: 0; }
    .ntab > ul > li { width: calc(50% - 4px) !important; float: none; margin: 0 !important; box-sizing: border-box; }
    .ntab > ul > li h4 { padding: 8px 10px 4px; }
    .ntab > ul > li .ptwo { padding: 0 10px 10px; margin: 0; font-size: 11.5px; color: var(--mut); }

    /* ---- 新闻详情：标题/作者行完整显示 ---- */
    #newshow .title { height: auto; line-height: 1.45; font-size: 19px; text-align: left; overflow: visible; margin: 12px 0 6px; }
    #newshow .title a { font-size: inherit; line-height: inherit; }
    #newshow .meta {
        height: auto; line-height: 1.7; width: 100%; text-align: left; overflow: visible;
        padding: 0 0 12px; font-size: 12.5px; white-space: normal; color: var(--mut);
    }
    #newshow .meta em, #newshow .meta span { display: inline-block; margin-right: 10px; }
    #newshow .cons { width: 100%; font-size: 14.5px; line-height: 1.8; padding: 12px 0 18px; }
    #newshow .cons img { max-width: 100% !important; height: auto; }

    /* ---- 客服中心：四个模块平铺，不再叠字 ---- */
    #service_main { padding: 12px 10px; }
    #service_main ul { display: flex; flex-wrap: wrap; gap: 10px; padding: 2px 0 4px; margin: 0; }
    #service_main li { width: calc(50% - 5px) !important; float: none; margin: 0 !important; }
    #service_main li a,
    #service_main #q_01 a, #service_main #q_02 a, #service_main #q_03 a, #service_main #q_04 a, #service_main #q_05 a {
        width: auto; height: auto; min-height: 0; margin: 0; position: static;
        border-radius: 12px; background-color: var(--bg);
        background-position: center 14px !important; background-size: 44px 44px !important; background-repeat: no-repeat;
        padding: 70px 6px 14px; font-size: 14px; font-weight: 600; color: var(--ink-2);
    }
    #service_main li a span { position: static; width: auto; bottom: auto; left: auto; }

    /* ---- 游戏详情 ---- */
    #gameshow .l, #gameshow .r { float: none; width: 100%; }
}

@media screen and (min-width: 769px) {
    /* ---- 游戏详情：左列自适应，右侧排行不换行 ---- */
    #gameshow { display: flex; align-items: flex-start; gap: 24px; }
    #gameshow .l { width: auto; flex: 1 1 auto; min-width: 0; float: none; }
    #gameshow .r { width: 276px; flex: 0 0 276px; float: none; }
}

/* ===== 2026-10-30 首页头条标题：暗红 PANEL 条 + 描边字 ===== */
@font-face {
    font-family: "FZQKBYS-Web";
    src: url("fonts/fzqkbys-headline.woff2") format("woff2");
    font-weight: 400; font-style: normal; font-display: swap;
}
@media screen and (min-width: 769px) {
    .col_1 .headlines h3 {
        margin: 2px -14px 8px; padding: 7px 16px;
        border-bottom: 0; position: relative; overflow: hidden;
        background:
            radial-gradient(120% 220% at 80% -70%, rgba(255, 196, 150, .18), rgba(255, 196, 150, 0) 54%),
            radial-gradient(95% 170% at 4% 150%, rgba(196, 46, 34, .30), rgba(196, 46, 34, 0) 58%),
            linear-gradient(180deg, #9e2226 0%, #85201f 38%, #6a1719 74%, #4d1013 100%);
        box-shadow:
            inset 0 1px 0 rgba(255, 214, 168, .34),
            inset 0 -1px 0 rgba(28, 4, 4, .60),
            0 0 0 1px rgba(214, 168, 92, .22),
            0 2px 6px rgba(60, 8, 6, .22);
    }
    .col_1 .headlines h3::before {
        content: ""; position: absolute; inset: 0; pointer-events: none;
        border-top: 1px solid rgba(240, 196, 128, .40);
        border-bottom: 1px solid rgba(214, 154, 88, .24);
        background: linear-gradient(90deg, transparent 0%, rgba(255, 224, 186, .10) 50%, transparent 100%);
    }
    .col_1 .headlines h3 a {
        position: relative; display: block; height: auto; line-height: 1.5;
        font-family: "FZQKBYS-Web", "方正清刻本悦宋简体", "FZQingKeBenYueSongS-R-GB", "STSong", "SimSun", serif;
        font-weight: 400; font-size: 19px; letter-spacing: .1em; text-align: center;
        color: transparent; -webkit-text-fill-color: transparent;
        background: linear-gradient(180deg, #fff8e4 0%, #fde2a8 38%, #e2b56a 72%, #ffefcc 100%);
        -webkit-background-clip: text; background-clip: text;
        -webkit-text-stroke: 0;
        text-shadow: 0 1px 1px rgba(36, 6, 4, .50);
        filter:
            drop-shadow(0 0 8px rgba(255, 208, 140, .44))
            drop-shadow(0 0 18px rgba(255, 172, 86, .19));
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .col_1 .headlines h3 a:hover {
        filter:
            drop-shadow(0 0 10px rgba(255, 212, 148, .52))
            drop-shadow(0 0 22px rgba(255, 176, 92, .22))
            brightness(1.03);
    }
}

/* ============================================================
   2026-10-31 个人中心移动端适配（<=768px）
   子页面会在 body 内额外加载 profile/safe/resetpwd/home/pay 等旧表，
   它们晚于本文件且带着 754/548/900 等固定宽度，故这里用 #member 前缀 + !important 覆盖
   ============================================================ */
@media screen and (max-width: 768px) {
    .wrap_w.wrap_narrow { width: 100% !important; padding-left: 14px; padding-right: 14px; }

    /* ---- 左侧导航：横向滚动胶囊条 ---- */
    #member_l, .wrap_w.wrap_narrow #member_l {
        float: none !important; width: 100% !important; height: auto !important;
        margin: 0 0 12px !important; padding: 6px 4px !important; box-sizing: border-box;
        background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow);
    }
    /* 模板里有两组 <dl>（个人中心/平台币/消费记录 与 资料/手机/认证/密码），
       让它们作为整条横向滚动，而不是各占一行 */
    #member_l .nav-scroller, #member_l {
        display: flex !important; flex-wrap: nowrap !important; align-items: center;
        overflow-x: auto !important; overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch;
    }
    #member_l dl {
        display: flex !important; flex-wrap: nowrap !important; align-items: center;
        flex: 0 0 auto; margin: 0 !important; padding: 2px;
        overflow: visible !important;
    }
    #member_l dd { margin: 0 !important; white-space: nowrap; }
    #member_l dt { display: none; }
    #member_l dd { float: none; flex: 0 0 auto; line-height: 40px; }
    #member_l dd a {
        display: block; height: 40px; line-height: 40px; padding: 0 14px !important;
        font-size: 13.5px; color: var(--mut); white-space: nowrap;
        border-left: 0 !important; border-radius: 20px;
    }
    #member_l dd a.on { color: #fff; background: var(--brand); }

    /* ---- 右侧内容区 ---- */
    #member_r, .wrap_w.wrap_narrow #member_r {
        float: none !important; width: 100% !important;
        padding: 14px !important; box-sizing: border-box;
        border-radius: var(--radius); background: var(--card); box-shadow: var(--shadow);
    }
    #member_r .other_s h3 { line-height: 44px; display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
    #member_r .other_s h3 span { float: none; font-size: 16px; }
    #member_r .other_s h3 em { float: none; font-size: 12px; line-height: 1.5; }
    #member_r .other_s h3 em a { margin-left: 8px; }
    #member_r .other_s .other_p { width: 100%; padding: 20px 0 0; }
    #member_r .other_s .other_p h4 { font-size: 20px; line-height: 1.5; }
    #member_r .other_s .other_p h4 em { font-size: 24px; }
    #member_r .other_s .other_p p { font-size: 13px; line-height: 1.7; }
    #member_r .other_s > p { font-size: 14px !important; line-height: 1.7 !important; padding: 12px 0 0 !important; }
    #member_r .features { padding-top: 20px; display: flex; flex-direction: column; gap: 16px; }
    #member_r .features li { float: none; width: 100%; margin: 0; }
    #member_r .features li img { width: 48px; padding-bottom: 10px; }

    /* ---- 个人中心首页 ---- */
    #member_r #profile .img { float: none; margin: 0 auto 10px; width: 64px; height: 64px; }
    #member_r #profile .img .uc-avatar { width: 64px; height: 64px; border-radius: 50%; }
    #member_r #profile .otherinfo { float: none; width: 100%; text-align: center; }
    #member_r #profile .otherinfo p { font-size: 17px; padding: 4px 0 8px; }
    #member_r .customer { float: none; width: 100%; box-sizing: border-box; margin-top: 14px; border-radius: var(--radius-s); }
    #member_r .customer #left { width: 64px; }
    #member_r .customer #left img { width: 56px; border-radius: 50%; }
    #member_r .customer #right { float: left; width: calc(100% - 64px); font-size: 13px; line-height: 1.8; }
    #member_r .customer #right a { display: inline-block; width: auto; padding: 0 12px; height: 26px; line-height: 26px; border-radius: 13px; margin-top: 6px; }
    #member_r .game_mod { margin-top: 26px; }
    #member_r .game_mod li { width: calc(50% - 8px); padding: 14px 0 0; }

    /* ---- 平台币 / 通用内容 ---- */
    #member_r img { max-width: 100%; height: auto; }
    #member_r p[style] { font-size: 14px !important; line-height: 1.7 !important; }

    /* ---- 消费记录：表格在容器内横向滚动 ---- */
    #member_r #main_con, #member_r .infor { width: 100% !important; }
    #member_r .infor .line { display: none; }
    #member_r .tab-pane { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    #member_r .tab-pane table { width: 100% !important; min-width: 0 !important; table-layout: auto; }
    #member_r .tab-pane th, #member_r .tab-pane td { padding: 8px 6px !important; font-size: 12.5px !important; line-height: 1.5; white-space: normal; word-break: break-all; }
    #member_r .tab-pane th { white-space: nowrap; }
    #member_r .pagelist { height: auto; }
    #member_r .pagelist ul { margin: 0 !important; display: flex; flex-wrap: wrap; justify-content: center; }

    /* ---- 个人资料 ---- */
    #member_r .m-personInfo-wrap .info-box { width: 100% !important; margin: 8px 0 0 !important; }
    #member_r .m-personInfo-wrap .info-box .item { height: auto; padding: 10px 12px; }
    #member_r .m-personInfo-wrap .info-box .li-label {
        float: none; display: block; width: auto; height: auto; line-height: 1.6;
        padding: 0 0 6px; text-align: left; background: none; color: var(--mut);
    }
    #member_r .m-personInfo-wrap .info-box .li-content {
        float: none; display: block; width: auto; height: auto; line-height: 1.6; margin: 0;
    }
    #member_r .m-personInfo-wrap .info-box .li-content input { width: 100% !important; box-sizing: border-box; height: 38px; }
    #member_r .m-personInfo-wrap .tips { width: auto; margin: 12px 0; }
    #member_r .m-personInfo-wrap .editor-btn { margin: 8px 0 20px; }
    #member_r #notice, #member_r .notice { margin-left: 0 !important; font-size: 13px !important; line-height: 1.6 !important; }

    /* 校验提示原本绝对定位在 ~260px 处，移动端改为静态换行 */
    #member_r .error-msg, #member_r .right-msg {
        position: static !important; display: block; margin: 4px 0 0 !important;
        font-size: 12px !important; height: auto !important; line-height: 1.5 !important;
        white-space: normal !important;
    }

    /* ---- 安全验证 / 绑定手机 / 实名认证 ---- */
    #member_r .m-allineone-validatePass .validate-pass-wrap { padding: 18px 0 30px !important; font-size: 13px; }
    #member_r .m-allineone-validatePass .validate-pass-wrap .tips { margin-bottom: 10px; }
    #member_r .m-allineone-validatePass .validate-pass-wrap .pass-input { width: 100% !important; box-sizing: border-box; margin-bottom: 14px; }
    #member_r .binded-wrap { padding: 14px 0 0 !important; }
    #member_r .binded-wrap .form-item { margin: 0 0 12px; }
    #member_r .binded-wrap label { display: block; width: auto; margin: 0 0 6px; text-align: left; }
    #member_r .binded-wrap .input-optimize { display: block; width: 100%; }
    #member_r .binded-wrap .input-optimize input { width: 100% !important; box-sizing: border-box; height: 38px; }
    #member_r .binded-wrap .check-code-wrap input { width: calc(100% - 90px) !important; }
    #member_r .binded-wrap .check-code-wrap img { width: 72px; height: 32px; margin-left: 8px; }
    #member_r .binded-wrap .send-code { margin: 0 0 12px !important; }
    #member_r .m-binded-id .input-optimize { display: block; width: 100%; }
    #member_r .m-binded-id .input-optimize input { width: 100% !important; box-sizing: border-box; }
    #member_r .m-binded-id label { display: block; margin: 0 0 6px; }
    #member_r .m-binded-id p { font-size: 12px; line-height: 1.7; }
    #member_r .operation-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
    #member_r .operation-bar .confirm, #member_r .operation-bar .cancel { margin-left: 0 !important; }

    /* ---- 修改密码 ---- */
    #member_r .modify_box { padding: 0; min-height: 0; }
    #member_r .modify_box .bread-wrap { height: auto; padding: 8px 0; }
    #member_r .modify_box .bread-list { height: auto; padding-left: 0; font-size: 12.5px; display: flex; flex-wrap: wrap; }
    #member_r .modify_box .bread-list li { float: none; height: auto; line-height: 26px; }
    #member_r .modify_box .bread-list .gutter { margin: 0 4px; }
    #member_r .modify_box .m-confirm-username-wrap { padding: 14px 0 0 !important; }
    #member_r .modify_box label { display: block; width: auto; margin: 0 0 6px; text-align: left; }
    #member_r .modify_box .input-optimize { display: block; width: 100% !important; margin-bottom: 14px; }
    #member_r .modify_box .input-optimize input { width: 100% !important; box-sizing: border-box; height: 38px; }
    #member_r .modify_box .pure-text { display: block; margin-bottom: 10px; height: auto; line-height: 1.6; }
    #member_r .modify_box .send-safe-code { display: inline-block; margin: 4px 0 12px; }
    #member_r .modify_box .operation-bar { margin-top: 8px; }
}