@charset "UTF-8";
/* =========================================================
 * MoGlass v1.6.11 —— 年轻时尚毛玻璃导航主题
 * 布局原型：左侧窄分类栏 + 中间主画布（顶部：品牌/搜索/时间/二维码）
 *           + 分组卡片墙 + 友情链接 + 右下角悬浮工具组
 * 全部样式原创，gl- 前缀自创变量体系，零框架依赖
 * ========================================================= */

/* ---------- 一、变量体系（原创命名） ---------- */
:root {
    --gl-paint: #3b5bdb;                        /* 主色：沉稳蓝 */
    --gl-paint-2: #5c7cfa;                      /* 辅色：清亮蓝 */
    --gl-paint-3: #748ffc;                      /* 点缀：浅蓝（替代原糖果粉） */
    --gl-ink: #23283d;                          /* 正文墨色 */
    --gl-ink-soft: #7b81a3;                     /* 次级文字 */
    --gl-plate: rgba(255, 255, 255, 0.34);      /* 玻璃板底色（降不透明度，让毛玻璃模糊可见） */
    --gl-side-plate: rgba(255, 255, 255, 0.55);  /* 左侧分类栏底色（比全局更实，保证文字清晰） */
    --gl-plate-deep: rgba(255, 255, 255, 0.34); /* 更透的玻璃 */
    --gl-edge: rgba(255, 255, 255, 0.75);       /* 玻璃高光描边 */
    --gl-frost: 18px;                           /* 模糊半径（后台可调） */
    --gl-curve: 20px;                           /* 大圆角 */
    --gl-curve-s: 13px;                         /* 小圆角 */
    --gl-cols: 5;                               /* 列数（后台可调） */
    /* 老 WebView 不认识 clamp()：变量声明保留两个值，具体使用处另给像素兜底 */
    --gl-side-w: 108px;
    --gl-side-w: clamp(88px, 9vw, 132px);       /* 左侧分类栏宽（约 1/10） */
    --gl-phone-w: 360px;                        /* 右侧手机壳宽 */
    --gl-phone-h: calc(var(--gl-phone-w) * 1.95); /* 手机壳高（19.5:9 比例） */
    --gl-drop: 0 10px 34px rgba(96, 110, 165, 0.16);      /* 玻璃投影 */
    --gl-drop-up: 0 16px 42px rgba(30, 41, 90, 0.26); /* 悬浮投影 */
    --gl-glide: 0.28s cubic-bezier(0.22, 0.61, 0.36, 1);
    --gl-beam: linear-gradient(115deg, var(--gl-paint), var(--gl-paint-2) 60%);
    --gl-sky: linear-gradient(160deg, #e7ecff 0%, #eef4ff 40%, #fceeff 100%);
}

/* 夜间变量：同一套命名，仅换色板 */
html.is-night {
    --gl-ink: #eceefb;
    --gl-ink-soft: #98a0c4;
    --gl-plate: rgba(32, 35, 60, 0.52);
    --gl-side-plate: rgba(32, 35, 60, 0.62);
    --gl-plate-deep: rgba(32, 35, 60, 0.38);
    --gl-edge: rgba(255, 255, 255, 0.11);
    --gl-drop: 0 10px 34px rgba(0, 0, 0, 0.34);
    --gl-drop-up: 0 16px 42px rgba(30, 41, 90, 0.34);
    --gl-sky: linear-gradient(160deg, #14162c 0%, #191c36 45%, #231e34 100%);
}

/* ---------- 二、基底 ---------- */
* { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

.gl-body {
    position: relative;
    min-height: 100vh;
    color: var(--gl-ink);
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB",
                 "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
    font-weight: 300;
    letter-spacing: 0.02em;
    background-color: #eef0fd;
    background-image: var(--gl-sky);
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    overflow-x: hidden;
}
html.is-night .gl-body { background-color: #14162c; }

::selection { background: rgba(30, 41, 90, 0.22); }

a { color: inherit; text-decoration: none; }

img, svg { vertical-align: middle; }

/* ---------- 三、背景光斑：缓慢漂移的彩色雾气 ---------- */
.gl-aura {
    position: fixed;
    top: 0; right: 0; bottom: 0; left: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}
.gl-aura-blob {
    position: absolute;
    display: block;
    border-radius: 50%;
    filter: blur(70px);
    opacity: 0.2;
}
.gl-aura-blob--a {
    width: 40vw; height: 40vw;
    top: -12vw; left: -8vw;
    background: radial-gradient(circle, #93a4e6, transparent 68%);
    animation: gl-drift-a 22s ease-in-out infinite alternate;
}
.gl-aura-blob--b {
    width: 34vw; height: 34vw;
    top: 24vh; right: -10vw;
    background: radial-gradient(circle, #8fc1e8, transparent 68%);
    animation: gl-drift-b 26s ease-in-out infinite alternate;
}
.gl-aura-blob--c {
    width: 30vw; height: 30vw;
    bottom: -14vw; left: 22vw;
    background: radial-gradient(circle, #c2b6e6, transparent 70%);
    animation: gl-drift-c 30s ease-in-out infinite alternate;
}
html.is-night .gl-aura-blob { opacity: 0.14; }

@keyframes gl-drift-a {
    from { transform: translate3d(0, 0, 0) scale(1); }
    to   { transform: translate3d(6vw, 6vh, 0) scale(1.12); }
}
@keyframes gl-drift-b {
    from { transform: translate3d(0, 0, 0) scale(1.06); }
    to   { transform: translate3d(-7vw, 8vh, 0) scale(1); }
}
@keyframes gl-drift-c {
    from { transform: translate3d(0, 0, 0) scale(1); }
    to   { transform: translate3d(5vw, -6vh, 0) scale(1.15); }
}

/* ---------- 四、玻璃材质 ---------- */
.gl-side,
.gl-head,
.gl-seek,
.gl-bulletin,
.gl-panel,
.gl-tile,
.gl-mates,
.gl-changelog,
.gl-qchip-pop,
.gl-phone-box,
.gl-hits {
    background: var(--gl-plate);
    -webkit-backdrop-filter: blur(var(--gl-frost)) saturate(1.6);
    backdrop-filter: blur(var(--gl-frost)) saturate(1.6);
    border: 1px solid var(--gl-edge);
    box-shadow: var(--gl-drop);
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .gl-side,
    .gl-head,
    .gl-seek,
    .gl-bulletin,
    .gl-panel,
    .gl-tile,
    .gl-mates,
    .gl-changelog,
    .gl-qchip-pop,
    .gl-phone-box,
    .gl-hits { background: rgba(255, 255, 255, 0.9); }
    html.is-night .gl-side,
    html.is-night .gl-head,
    html.is-night .gl-seek,
    html.is-night .gl-bulletin,
    html.is-night .gl-panel,
    html.is-night .gl-tile,
    html.is-night .gl-mates,
    html.is-night .gl-changelog,
    html.is-night .gl-qchip-pop,
    html.is-night .gl-phone-box,
    html.is-night .gl-hits { background: rgba(28, 30, 52, 0.6); }
}

/* ---------- 五、左侧窄分类栏 ---------- */
.gl-side {
    position: fixed;
    top: 12px;
    bottom: 12px;
    left: 12px;
    z-index: 60;
    width: 108px;                 /* 兜底：不支持 clamp()/var() 的老浏览器 */
    width: var(--gl-side-w);
    display: flex;
    flex-direction: column;
    border-radius: var(--gl-curve);
    padding: 14px 10px 10px;
    background: var(--gl-side-plate, var(--gl-plate));
    -webkit-backdrop-filter: blur(var(--gl-side-frost, var(--gl-frost))) saturate(1.6);
    backdrop-filter: blur(var(--gl-side-frost, var(--gl-frost))) saturate(1.6);
    animation: gl-rise 0.6s ease-out both;
}

/* 品牌竖排 */
.gl-side-brand {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 4px 0 12px;
    border-bottom: 1px solid var(--gl-edge);
    margin-bottom: 10px;
}
.gl-side-brand img {
    width: 34px;
    height: 34px;
    border-radius: 11px;
    object-fit: cover;
}
.gl-side-brand span {
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-align: center;
    line-height: 1.4;
    background: var(--gl-beam);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    word-break: break-all;
}

/* 分类 / 导航滚动区 */
.gl-side-cats,
.gl-side-way {
    display: flex;
    flex-direction: column;
    gap: 3px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 2px;
}
.gl-side-cats::-webkit-scrollbar,
.gl-side-way::-webkit-scrollbar { display: none; }

.gl-side-cats { flex: 1 1 auto; min-height: 0; }
.gl-side-way { flex: 0 1 auto; max-height: 42%; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--gl-edge); }

.gl-side-cap {
    flex: 0 0 auto;
    font-size: 10.5px;
    letter-spacing: 0.22em;
    color: var(--gl-ink-soft);
    padding: 4px 6px 6px;
}

.gl-side-cats a,
.gl-side-way a {
    flex: 0 0 auto;
    display: block;
    padding: 7px 9px;
    border-radius: 10px;
    font-size: 12.5px;
    color: var(--gl-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    border: 1px solid transparent;
    transition: all var(--gl-glide);
}
.gl-side-cats a:hover,
.gl-side-way a:hover,
.gl-side-way a:focus {
    color: var(--gl-ink);
    background: rgba(255, 255, 255, 0.55);
    border-color: var(--gl-edge);
}
html.is-night .gl-side-cats a:hover,
html.is-night .gl-side-way a:hover { background: rgba(255, 255, 255, 0.09); }
.gl-side-cats a.is-now {
    color: #fff;
    background: var(--gl-paint);
    border-color: transparent;
}

/* 左下角后台管理 */
.gl-side-foot {
    flex: 0 0 auto;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--gl-edge);
}
.gl-side-admin {
    display: block;
    padding: 8px 9px;
    border-radius: 10px;
    font-size: 12px;
    text-align: center;
    color: #fff;
    background: var(--gl-beam);
    transition: filter var(--gl-glide), transform var(--gl-glide);
}
.gl-side-admin:hover { filter: brightness(1.08); transform: translateY(-1px); }

/* ---------- 六、中间主画布 ---------- */
.gl-main {
    position: relative;
    z-index: 1;
    min-height: 100vh;
    margin-left: 124px;           /* 兜底：不支持 clamp()/calc() 的老浏览器 */
    margin-left: calc(var(--gl-side-w) + 16px);
    margin-right: 18px;
    display: flex;
    flex-direction: column;
}

/* 顶部一行：品牌（左） + 搜索（中） + 时间 + 二维码（右） */
.gl-head {
    position: sticky;
    top: 12px;
    z-index: 50;
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 12px 0 0;
    padding: 10px 16px;
    border-radius: var(--gl-curve);
    animation: gl-rise 0.6s ease-out both;
}

/* 品牌（左） */
.gl-head-brand {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: 24%;
}
.gl-head-brand img {
    width: 30px;
    height: 30px;
    border-radius: 10px;
    object-fit: cover;
}
.gl-head-name {
    font-size: 15.5px;
    font-weight: 600;
    letter-spacing: 0.03em;
    white-space: nowrap;
    background: var(--gl-beam);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
/* ---------- 顶部二维码芯片（微信 / 商城） ---------- */
.gl-head-codes {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 6px;
    padding-left: 14px;
    border-left: 1px solid var(--gl-edge);
}

.gl-qchip {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
}

.gl-qchip-btn {
    display: block;
    width: 46px;
    height: 46px;
    padding: 4px;
    border: 1px solid var(--gl-edge);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.62);
    cursor: pointer;
    transition: transform var(--gl-glide), box-shadow var(--gl-glide),
                border-color var(--gl-glide);
}
html.is-night .gl-qchip-btn { background: rgba(255, 255, 255, 0.07); }
.gl-qchip-btn:hover,
.gl-qchip.is-open .gl-qchip-btn {
    transform: translateY(-2px);
    border-color: rgba(30, 41, 90, 0.45);
    box-shadow: var(--gl-drop-up);
}
.gl-qchip-btn img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    object-fit: contain;
    background: #fff;
}

.gl-qchip-cap {
    font-size: 10.5px;
    line-height: 1.3;
    letter-spacing: 0.02em;
    color: var(--gl-ink-soft);
    white-space: nowrap;
}

/* 弹出大图卡片：悬停或点击展开 */
.gl-qchip-pop {
    position: absolute;
    top: calc(100% + 12px);
    right: -8px;
    z-index: 70;
    width: 168px;
    padding: 13px 13px 14px;
    border-radius: var(--gl-curve);
    text-align: center;
    opacity: 0;
    transform: translateY(-6px) scale(0.97);
    transform-origin: top right;
    pointer-events: none;
    transition: opacity var(--gl-glide), transform var(--gl-glide);
}
.gl-qchip:hover .gl-qchip-pop,
.gl-qchip.is-open .gl-qchip-pop {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}
.gl-qchip-pop::before {
    content: "";
    position: absolute;
    top: -12px;
    right: 0;
    left: 0;
    height: 12px;
}
.gl-qchip-pop img {
    display: block;
    width: 100%;
    border-radius: 12px;
    background: #fff;
}
.gl-qchip-pop strong {
    display: block;
    margin-top: 9px;
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: 0.05em;
    color: var(--gl-ink);
}
.gl-qchip-link {
    display: block;
    margin-top: 8px;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--gl-beam);
    color: #fff;
    font-size: 11.5px;
    letter-spacing: 0.06em;
    transition: filter var(--gl-glide);
}
.gl-qchip-link:hover { filter: brightness(1.08); }

/* 时间窗口（右） */
.gl-head-clock {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 1px;
    padding-left: 14px;
    border-left: 1px solid var(--gl-edge);
    min-width: 74px;
}
.gl-time {
    font-size: 21px;
    font-weight: 200;
    line-height: 1.1;
    letter-spacing: 0.04em;
    font-variant-numeric: tabular-nums;
    color: var(--gl-paint);
    -webkit-text-fill-color: var(--gl-paint);
}
.gl-date {
    font-size: 10.5px;
    letter-spacing: 0.08em;
    color: var(--gl-ink-soft);
    white-space: nowrap;
}

/* ---------- 七、全局搜索（顶部中间） ---------- */
.gl-finder {
    position: relative;
    z-index: 40;
    flex: 1 1 auto;
    min-width: 0;
    max-width: 500px;      /* 收窄搜索栏，避免过长 */
    margin: 0 auto;        /* 在品牌与二维码之间居中 */
}

.gl-seek {
    padding: 4px;
    border-radius: 999px;
    background: var(--gl-beam);
    border: 0;
    box-shadow: 0 8px 24px rgba(30, 41, 90, 0.16);
    transition: box-shadow var(--gl-glide);
}
.gl-seek:hover { box-shadow: 0 12px 32px rgba(30, 41, 90, 0.24); }

.gl-seek-box {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-left: 17px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.78);
    -webkit-backdrop-filter: blur(var(--gl-frost)) saturate(1.6);
    backdrop-filter: blur(var(--gl-frost)) saturate(1.6);
}
html.is-night .gl-seek-box { background: rgba(18, 20, 38, 0.66); }
.gl-seek-mark { display: flex; color: var(--gl-paint); }
.gl-seek input {
    flex: 1 1 auto;
    min-width: 0;
    height: 48px;          /* 加高搜索栏 */
    border: 0;
    outline: 0;
    background: transparent;
    font-size: 15px;
    font-weight: 300;
    color: var(--gl-ink);
}
.gl-seek input::placeholder { color: #a3a9c4; }
.gl-seek button {
    flex: 0 0 auto;
    height: 40px;
    margin-right: 2px;
    padding: 0 24px;
    border: 0;
    border-radius: 999px;
    background: var(--gl-beam);
    color: #fff;
    font-size: 14px;
    letter-spacing: 0.16em;
    text-indent: 0.16em;
    cursor: pointer;
    transition: filter var(--gl-glide), transform var(--gl-glide);
}
.gl-seek button:hover { filter: brightness(1.08); transform: translateY(-1px); }
.gl-seek button:active { transform: translateY(0); filter: brightness(0.95); }

/* 搜索引擎选择 */
.gl-sou {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
}
.gl-sou-item {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 11px 3px 9px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.6);
    background: rgba(255, 255, 255, 0.42);
    font-size: 11.5px;
    color: var(--gl-ink-soft);
    cursor: pointer;
    transition: all var(--gl-glide);
}
.gl-sou-item:hover {
    color: var(--gl-ink);
    background: rgba(255, 255, 255, 0.72);
}
.gl-sou-item input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}
/* 选中引擎：兄弟选择器点亮，兼容无 :has 环境 */
.gl-sou-item input:checked ~ span {
    background: var(--sou-tint, var(--gl-paint));
    color: #fff;
    padding: 2px 10px;
    margin: -2px 0;
    border-radius: 999px;
}

/* 全局搜索结果面板 */
.gl-hits {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    padding: 8px;
    border-radius: var(--gl-curve);
    text-align: left;
    animation: gl-rise 0.22s ease-out both;
}
.gl-hits[hidden] { display: none; }

.gl-hits-list {
    list-style: none;
    max-height: 44vh;
    overflow-y: auto;
}
.gl-hits-list li { border-radius: var(--gl-curve-s); }
.gl-hits-list a {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 9px 12px;
    border-radius: var(--gl-curve-s);
    transition: background var(--gl-glide);
}
.gl-hits-list a:hover,
.gl-hits-list li.is-cursor a { background: rgba(30, 41, 90, 0.13); }
.gl-hits-ico {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.7);
    overflow: hidden;
}
html.is-night .gl-hits-ico { background: rgba(255, 255, 255, 0.08); }
.gl-hits-name {
    min-width: 0;
    font-size: 13.5px;
    color: var(--gl-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.gl-hits-from {
    margin-left: auto;
    flex: 0 0 auto;
    font-size: 11px;
    color: var(--gl-ink-soft);
}
.gl-hits-none {
    padding: 14px 12px;
    font-size: 13px;
    color: var(--gl-ink-soft);
}

.gl-hits-more {
    display: block;
    width: 100%;
    margin-top: 6px;
    padding: 10px 12px;
    border: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: var(--gl-curve-s);
    background: transparent;
    font-size: 13px;
    color: var(--gl-ink-soft);
    cursor: pointer;
    text-align: center;
    transition: background var(--gl-glide), color var(--gl-glide);
}
.gl-hits-more:hover { background: rgba(255, 255, 255, 0.6); color: var(--gl-ink); }
.gl-hits-more em { font-style: normal; color: var(--gl-paint); font-weight: 500; }

/* ---------- 八、一言 / 公告 ---------- */
.gl-word {
    max-width: 640px;
    margin: 12px auto 0;
    font-size: 13px;
    line-height: 1.85;
    color: var(--gl-ink-soft);
    text-align: center;
}

.gl-bulletin {
    max-width: 760px;
    margin: 12px auto 0;
    padding: 11px 18px;
    border-radius: var(--gl-curve);
    font-size: 12.5px;
    line-height: 1.8;
    color: var(--gl-ink-soft);
    animation: gl-rise 0.7s ease-out 0.18s both;
}

/* ---------- 九、内容区：左侧卡片墙 + 右侧手机商城 ---------- */
.gl-board {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;   /* 手机列与卡片墙顶部齐平 */
    gap: 16px;
    width: 100%;
}

.gl-canvas {
    position: relative;
    z-index: 1;
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
    max-width: 1300px;
    /* 左侧留白由后台「内容区左侧留白」控制（--gl-pad-left，默认 28px） */
    margin: 18px 0 0 var(--gl-pad-left, 0px);
    padding: 0 0 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
/* 整体居中：后台「内容区对齐」选「居中」时生效 */
body.is-board-center .gl-canvas {
    margin-left: auto;
    margin-right: auto;
}

.gl-panel {
    position: relative;
    padding: 16px 14px 14px;
    border-radius: var(--gl-curve);
    display: grid;
    grid-template-columns: repeat(var(--gl-cols), 1fr);
    gap: 11px;
    scroll-margin-top: 86px;
}

/* 屏幕外分组跳过渲染（后台「屏幕外分组跳过渲染」开启时）
 * 兼容说明：content-visibility:auto 在部分安卓平板 WebView / 旧版 Chromium 上
 * 会把跳过的分组连同「滚动渐入」一起锁死，表现为「框架在、内容整片空白」。
 * 因此这里收紧为：必须同时满足 ①浏览器显式声明支持 ②宽屏桌面
 * ③渐入脚本确实跑起来了 ④该分组已完成首次显示，才启用跳过渲染。
 * 平板、手机、老内核一律全量渲染，链接数量有限，性能影响可忽略。 */
@media (min-width: 1366px) {
    @supports (content-visibility: auto) {
        html.gl-reveal-on body.is-lazy-render .gl-panel.is-in {
            content-visibility: auto;
            contain-intrinsic-size: 400px;
        }
    }
}

/* 卡片列数自适应：1366→4列，1600→5列，1920→6列（覆盖上面的固定列数；中屏/平板走下方移动端断点） */
@media (min-width: 1366px) {
    .gl-panel { grid-template-columns: repeat(4, 1fr); }
}
@media (min-width: 1600px) {
    .gl-panel { grid-template-columns: repeat(5, 1fr); }
}
@media (min-width: 1920px) {
    .gl-panel { grid-template-columns: repeat(6, 1fr); }
}

/* 卡片顶部一道渐变细光带 */
.gl-panel::before {
    content: "";
    position: absolute;
    top: 0; left: 20px; right: 20px;
    height: 2px;
    border-radius: 0 0 2px 2px;
    background: var(--gl-beam);
    opacity: 0.65;
}

.gl-panel-title {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 1px;
    font-size: 14.5px;
    font-weight: 600;
    letter-spacing: 0.05em;
    color: var(--gl-ink);
}
.gl-panel-title svg,
.gl-panel-title img { opacity: 0.9; }

.gl-tile {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: var(--gl-curve-s);
    min-width: 0;
    transition: transform var(--gl-glide), box-shadow var(--gl-glide),
                border-color var(--gl-glide), background var(--gl-glide);
}
.gl-tile:hover,
.gl-tile:focus {
    transform: translateY(-4px);
    border-color: rgba(30, 41, 90, 0.42);
    box-shadow: var(--gl-drop-up);
    background: rgba(255, 255, 255, 0.72);
}
html.is-night .gl-tile:hover { background: rgba(46, 50, 84, 0.7); }

.gl-tile-ico {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: inset 0 0 0 1px var(--gl-edge);
    overflow: hidden;
}
html.is-night .gl-tile-ico { background: rgba(255, 255, 255, 0.08); }

.gl-tile-body {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}
.gl-tile-name {
    font-size: 13.5px;
    color: var(--gl-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.gl-tile-desc {
    font-size: 11.5px;
    line-height: 1.5;
    color: var(--gl-ink-soft);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.gl-tile-desc:empty { display: none; }

/* ---------- 十、友情链接 ---------- */
.gl-mates {
    padding: 14px 16px;
    border-radius: var(--gl-curve);
}
.gl-mates-cap {
    font-size: 11.5px;
    letter-spacing: 0.2em;
    color: var(--gl-ink-soft);
    margin-bottom: 10px;
}
.gl-mates-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.gl-mates-row a {
    padding: 5px 14px;
    border-radius: 999px;
    border: 1px solid var(--gl-edge);
    background: rgba(255, 255, 255, 0.4);
    font-size: 12.5px;
    color: var(--gl-ink-soft);
    transition: all var(--gl-glide);
}
.gl-mates-row a:hover,
.gl-mates-row a:focus {
    color: #fff;
    background: var(--gl-paint);
    border-color: transparent;
    transform: translateY(-2px);
}

/* ---------- 十之三、网站更新日志（内容由后台主题设置维护） ---------- */
.gl-changelog {
    padding: 16px 18px 14px;
    border-radius: var(--gl-curve);
    scroll-margin-top: 86px;
}
.gl-log-head {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 6px 12px;
    margin-bottom: 8px;
}
.gl-log-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 14.5px;
    font-weight: 600;
    letter-spacing: 0.05em;
    color: var(--gl-ink);
}
.gl-log-title svg,
.gl-log-title img { flex: 0 0 auto; width: 17px; height: 17px; color: var(--gl-paint); }
.gl-log-meta {
    font-size: 11.5px;
    letter-spacing: 0.03em;
    color: var(--gl-ink-soft);
}
/* 列表限高 + 内部滚动：日志再多也不会把页面一直往下撑长 */
.gl-log-list {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: var(--gl-log-maxh, 280px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: rgba(109, 92, 255, 0.35) transparent;
}
.gl-log-list::-webkit-scrollbar { width: 6px; }
.gl-log-list::-webkit-scrollbar-track { background: transparent; }
.gl-log-list::-webkit-scrollbar-thumb {
    background: rgba(109, 92, 255, 0.32);
    border-radius: 999px;
}
html.is-night .gl-log-list::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.18); }
.gl-log-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 9px 0;
}
.gl-log-item + .gl-log-item { border-top: 1px dashed var(--gl-edge); }
.gl-log-date {
    flex: 0 0 auto;
    min-width: 84px;
    font-size: 11.5px;
    line-height: 1.95;
    color: var(--gl-ink-soft);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}
.gl-log-rail {
    flex: 0 0 auto;
    width: 9px;
    height: 9px;
    margin-top: 8px;
    border-radius: 50%;
    background: var(--gl-paint);
    box-shadow: 0 0 0 4px rgba(109, 92, 255, 0.13);
}
.gl-log-item:not(:first-child) .gl-log-rail { opacity: 0.45; box-shadow: none; }
.gl-log-body { flex: 1 1 auto; min-width: 0; }
.gl-log-tag {
    display: inline-block;
    margin: 0 7px 0 0;
    padding: 0 8px;
    border: 1px solid var(--gl-edge);
    border-radius: 999px;
    background: var(--gl-plate-deep);
    color: var(--gl-paint);
    font-size: 10.5px;
    line-height: 1.85;
    white-space: nowrap;
    vertical-align: 1px;
}
.gl-log-text {
    font-size: 12.8px;
    line-height: 1.95;
    color: var(--gl-ink);
    word-break: break-word;
}
.gl-log-more {
    display: block;
    width: 100%;
    margin-top: 6px;
    padding: 9px 12px 2px;
    border: 0;
    border-top: 1px solid var(--gl-edge);
    border-radius: 0 0 var(--gl-curve-s) var(--gl-curve-s);
    background: transparent;
    color: var(--gl-paint);
    font-size: 12px;
    cursor: pointer;
    transition: opacity var(--gl-glide);
}
.gl-log-more:hover,
.gl-log-more:focus { opacity: 0.72; text-decoration: underline; }
.gl-log-more[hidden] { display: none; }
/* 折叠类由 JS 追加；无 JS 时所有条目照常可见 */
.gl-changelog.is-folded .gl-log-item.is-extra { display: none; }

@media (max-width: 768px) {
    .gl-changelog { padding: 14px 12px 12px; }
    .gl-log-item { gap: 8px; }
    .gl-log-date { min-width: 72px; font-size: 10.5px; }
    .gl-log-text { font-size: 12.2px; }
}

/* ---------- 十之二、右侧手机壳商城（宽屏，与卡片墙齐平） ---------- */
.gl-phone {
    flex: 0 0 var(--gl-phone-w);
    width: var(--gl-phone-w);
    margin-top: 18px;
    position: sticky;
    top: 96px;
}

.gl-phone-box {
    display: flex;
    flex-direction: column;
    gap: 11px;
    padding: 13px 12px 14px;
    border-radius: var(--gl-curve);
}

.gl-phone-cap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.gl-phone-cap strong {
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: 0.05em;
    color: var(--gl-ink);
}
.gl-phone-cap a {
    flex: 0 0 auto;
    font-size: 11.5px;
    color: var(--gl-ink-soft);
    transition: color var(--gl-glide);
}
.gl-phone-cap a:hover { color: var(--gl-paint); }

/* 手机外壳：金属中框 + 圆角玻璃屏 */
.gl-phone-device {
    position: relative;
    width: 100%;
    height: var(--gl-phone-h);
    padding: 9px;
    border-radius: 44px;
    background: linear-gradient(155deg, #4a5169 0%, #191c26 42%, #2c3243 100%);
    box-shadow: 0 20px 44px rgba(18, 22, 38, 0.34),
                inset 0 0 0 1px rgba(255, 255, 255, 0.16),
                inset 0 0 12px rgba(0, 0, 0, 0.4);
}

/* 屏幕 */
.gl-phone-screen {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 36px;
    overflow: hidden;
    background: #fff;
}
.gl-phone-screen iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    background: #fff;
    -webkit-overflow-scrolling: touch;
}

/* 底部 home 横条 */
.gl-phone-bar {
    position: absolute;
    bottom: 15px;
    left: 50%;
    margin-left: -48px;
    width: 96px;
    height: 4px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.6);
    pointer-events: none;
    z-index: 2;
}

.gl-phone-open {
    display: block;
    padding: 9px 12px;
    border-radius: 999px;
    text-align: center;
    font-size: 12.5px;
    letter-spacing: 0.04em;
    color: #fff;
    background: var(--gl-beam);
    transition: filter var(--gl-glide), transform var(--gl-glide);
}
.gl-phone-open:hover { filter: brightness(1.08); transform: translateY(-1px); }

/* 手机下方：商城二维码（手机扫码查看） */
.gl-phone-qr {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 11px 10px 12px;
    border-radius: var(--gl-curve-s);
    border: 1px solid var(--gl-edge);
    background: rgba(255, 255, 255, 0.42);
    text-align: center;
}
html.is-night .gl-phone-qr { background: rgba(255, 255, 255, 0.07); }
.gl-phone-qr img {
    width: 116px;
    height: 116px;
    border-radius: 10px;
    background: #fff;
    object-fit: contain;
}
.gl-phone-qr strong {
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: 0.05em;
    color: var(--gl-ink);
}
.gl-phone-qr small {
    font-size: 11px;
    color: var(--gl-ink-soft);
}

/* ---------- 十一、底部 ---------- */
.gl-foot {
    margin-top: 8px;
    padding: 6px 10px 10px;
    font-size: 12px;
    line-height: 2;
    color: var(--gl-ink-soft);
    text-align: center;
}
.gl-foot a.icp,
.gl-foot a.gonganbei {
    color: var(--gl-ink-soft);
    margin: 0 6px;
    transition: color var(--gl-glide);
}
.gl-foot a.icp:hover,
.gl-foot a.gonganbei:hover { color: var(--gl-paint); }

/* ---------- 十二、右下角悬浮工具 ---------- */
.gl-dock {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 90;
    display: flex;
    align-items: center;
    gap: 9px;
}

/* 回到顶部 */
.gl-up {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--gl-edge);
    border-radius: 50%;
    background: var(--gl-plate);
    -webkit-backdrop-filter: blur(var(--gl-frost)) saturate(1.5);
    backdrop-filter: blur(var(--gl-frost)) saturate(1.5);
    color: var(--gl-ink);
    box-shadow: var(--gl-drop);
    cursor: pointer;
    opacity: 0;
    transform: translateY(8px);
    pointer-events: none;
    transition: transform var(--gl-glide), opacity var(--gl-glide),
                color var(--gl-glide), background var(--gl-glide);
}
.gl-up.is-show {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}
.gl-up:hover { color: #fff; background: var(--gl-paint); border-color: transparent; }

/* 昼夜切换 */
.gl-lamp {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--gl-edge);
    border-radius: 50%;
    background: var(--gl-plate);
    -webkit-backdrop-filter: blur(var(--gl-frost)) saturate(1.5);
    backdrop-filter: blur(var(--gl-frost)) saturate(1.5);
    color: var(--gl-ink);
    box-shadow: var(--gl-drop);
    cursor: pointer;
    transition: transform var(--gl-glide), color var(--gl-glide);
}
.gl-lamp:hover { transform: translateY(-2px); color: var(--gl-paint); }
.gl-lamp-moon { display: none; }
html.is-night .gl-lamp-sun { display: none; }
html.is-night .gl-lamp-moon { display: block; }

/* ---------- 十四、图标尺寸约束（★必须同时覆盖 svg 与 img★） ---------- */
/* 搜索引擎图标 */
.gl-sou-item svg,
.gl-sou-item img { width: 14px; height: 14px; }
/* 分组标题图标 */
.gl-panel-title svg,
.gl-panel-title img { width: 18px; height: 18px; flex: 0 0 auto; }
/* 链接图标 */
.gl-tile-ico svg,
.gl-tile-ico img { width: 22px; height: 22px; display: block; }
/* 搜索结果图标 */
.gl-hits-ico svg,
.gl-hits-ico img { width: 19px; height: 19px; display: block; }
/* 品牌图标（侧栏 / 顶栏，可能被系统注入为 svg） */
.gl-side-brand svg,
.gl-side-brand img { width: 34px; height: 34px; }
.gl-head-brand svg,
.gl-head-brand img { width: 30px; height: 30px; }
/* 悬浮按钮图标（自定义内联 SVG，显式限尺寸） */
.gl-lamp svg { width: 20px; height: 20px; }
.gl-up svg { width: 19px; height: 19px; }

/* ---------- 十五、动效 ---------- */
@keyframes gl-rise {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* 分组卡片滚动渐入（渐进增强）
 * 关键兼容点：内容「默认可见」。只有渐入脚本确认 DOM 已就绪、且浏览器支持
 * IntersectionObserver 时，才给 html 加 .gl-reveal-on 并对屏幕外元素加 .is-pending。
 * 这样即使 defer 脚本未执行、脚本被提前执行、观察器不回调、老 WebView 实现有缺陷，
 * 卡片墙也始终可见，不会出现「只有框架没有内容」。 */
.gl-reveal {
    opacity: 1;
    transform: none;
    transition: opacity 0.5s ease-out, transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
}
html.gl-reveal-on .gl-reveal.is-pending {
    opacity: 0;
    transform: translateY(22px);
}
html.gl-reveal-on .gl-reveal.is-in {
    opacity: 1;
    transform: none;
}

@media (prefers-reduced-motion: reduce) {
    .gl-aura-blob { animation: none; }
    .gl-side, .gl-head, .gl-bulletin, .gl-reveal,
    html.gl-reveal-on .gl-reveal.is-pending {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}

/* ---------- 十六、窄屏适配（<1280px）：隐藏手机商城，卡片墙回归居中 ---------- */
@media (max-width: 1279px) {
    .gl-phone { display: none; }
    .gl-canvas { margin: 18px auto 0; }
    body.is-board-center .gl-canvas { margin: 18px auto 0; }
}

/* ---------- 十六之二、平板 / 中屏适配（769–1365px） ----------
 * 原样式在 769–1365px 之间仍套用桌面 5 列 + 顶栏一行不换行，
 * 平板横屏（常见 1280×800、1024×768）会把卡片挤成细条、顶栏内容溢出。
 * 这里按宽度分档收敛列数，并让窄一点的平板把搜索栏换到第二行。 */
@media (min-width: 769px) and (max-width: 1023px) {
    .gl-panel { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .gl-head { flex-wrap: wrap; gap: 10px 12px; }
    .gl-head-brand { max-width: 100%; }
    .gl-head-clock { margin-left: auto; }
    .gl-finder { order: 3; flex: 1 1 100%; max-width: none; }
    .gl-qchip-cap { display: none; }
    .gl-qchip-btn { width: 40px; height: 40px; }
    .gl-canvas { margin-left: 12px; margin-right: 12px; }
    .gl-tile { padding: 9px 10px; gap: 8px; }
    .gl-tile-ico { width: 30px; height: 30px; border-radius: 9px; }
    .gl-tile-ico svg, .gl-tile-ico img { width: 20px; height: 20px; }
}
@media (min-width: 1024px) and (max-width: 1365px) {
    .gl-panel { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (min-width: 1280px) and (max-width: 1365px) {
    /* 刚够显示右侧手机壳的宽度：收窄它，把空间让给卡片墙 */
    .gl-phone { flex-basis: 300px; width: 300px; }
    .gl-phone-device { height: 585px; }
    .gl-phone-qr img { width: 96px; height: 96px; }
    .gl-head { gap: 10px; }
    .gl-head-codes { padding-left: 8px; }
}

@media (max-width: 1099px) {
    .gl-qchip-cap { font-size: 10px; }
    .gl-head-codes { padding-left: 10px; gap: 4px; }
    .gl-qchip-btn { width: 42px; height: 42px; }
}

/* ---------- 十七、移动端 ---------- */
@media (max-width: 768px) {

    :root { --gl-side-w: auto; }

    /* 左侧栏折叠为顶部横向条 */
    .gl-side {
        position: static;
        top: auto; bottom: auto; left: auto;
        width: calc(100% - 20px);
        height: auto;
        margin: 10px 10px 0;
        padding: 10px;
        flex-direction: column;
        gap: 8px;
    }
    .gl-side-brand {
        flex-direction: row;
        padding: 0 2px 8px;
        margin-bottom: 2px;
        gap: 8px;
    }
    .gl-side-brand img, .gl-side-brand svg { width: 26px; height: 26px; }
    .gl-side-brand span { font-size: 14px; }
    .gl-side-cats {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 5px;
        overflow: visible;
    }
    .gl-side-way {
        flex-direction: row;
        flex-wrap: wrap;
        max-height: none;
        margin-top: 0;
        padding-top: 0;
        border-top: 0;
        gap: 5px;
    }
    .gl-side-cap { display: none; }
    .gl-side-cats a,
    .gl-side-way a { padding: 5px 11px; }
    .gl-side-foot { margin-top: 0; padding-top: 0; border-top: 0; }
    .gl-side-admin { display: inline-block; padding: 5px 13px; font-size: 11.5px; }

    .gl-main { margin: 0 10px; min-height: auto; }

    /* 顶栏换行：品牌 + 时间 + 二维码一行，搜索独占一行 */
    .gl-head {
        position: static;
        flex-wrap: wrap;
        gap: 10px;
        margin: 10px 0 0;
        padding: 10px 12px;
    }
    .gl-head-brand { max-width: 100%; flex: 1 1 auto; }
    .gl-head-clock { padding-left: 10px; }
    .gl-head-codes { order: 2; }
    .gl-finder { flex: 1 1 100%; order: 3; max-width: none; }
    .gl-board { display: block; }
    .gl-canvas { margin: 12px auto 0; }
    .gl-seek input { height: 44px; font-size: 14.5px; }
    .gl-seek button { height: 36px; padding: 0 18px; }
    .gl-sou { gap: 4px; }

    .gl-canvas { gap: 12px; margin-top: 12px; }

    /* 链接列数收敛为 2 列 */
    .gl-panel {
        grid-template-columns: repeat(2, 1fr);
        gap: 9px;
        padding: 13px 11px 11px;
    }
    .gl-panel::before { left: 12px; right: 12px; }
    .gl-tile { padding: 9px 10px; gap: 8px; }
    .gl-tile-ico { width: 30px; height: 30px; border-radius: 9px; }
    .gl-tile-desc { font-size: 11px; }

    .gl-dock { right: 14px; bottom: 14px; gap: 8px; }
    .gl-up, .gl-lamp { width: 36px; height: 36px; }

    /* 二维码芯片：缩小并居中弹出，避免溢出屏幕 */
    .gl-qchip-btn { width: 38px; height: 38px; padding: 3px; }
    .gl-qchip-cap { font-size: 9.5px; }
    .gl-qchip-pop { right: -8px; width: 150px; padding: 11px 11px 12px; }
}

/* =========================================================
 * 隐藏分类折叠（新增功能）
 * 名称匹配的分组只显示一行链接，其余由 script.js 收起；
 * 链接 DOM 完整保留，全局搜索索引照常命中。
 * ========================================================= */
.gl-panel.is-gl-fold .gl-tile.is-gl-fold-extra { display: none; }
.gl-panel.is-gl-fold.is-gl-fold-open .gl-tile.is-gl-fold-extra { display: flex; }

.gl-fold-more {
    grid-column: 1 / -1;
    justify-self: start;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 1px;
    padding: 5px 14px;
    border: 1px solid var(--gl-edge, rgba(30, 41, 90, .14));
    border-radius: 999px;
    background: rgba(255, 255, 255, .58);
    color: var(--gl-ink-soft, #6c7893);
    font-size: calc(12px * var(--gl-fs, 1));
    line-height: 1.65;
    cursor: pointer;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    transition: background .2s ease, color .2s ease, transform .2s ease;
}
.gl-fold-more::after {
    content: "";
    width: 6px;
    height: 6px;
    border-right: 1.6px solid currentColor;
    border-bottom: 1.6px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    opacity: .75;
}
.gl-panel.is-gl-fold-open .gl-fold-more::after {
    transform: rotate(225deg) translateY(-1px);
}
.gl-fold-more:hover,
.gl-fold-more:focus {
    background: rgba(255, 255, 255, .9);
    color: var(--gl-paint, #4361ee);
    transform: translateY(-1px);
    outline: none;
}
html.is-night .gl-fold-more {
    background: rgba(255, 255, 255, .08);
    border-color: rgba(255, 255, 255, .14);
    color: #c3cae0;
}
html.is-night .gl-fold-more:hover,
html.is-night .gl-fold-more:focus {
    background: rgba(255, 255, 255, .16);
}