/* 液态玻璃风底座：平台后台 / 代理后台 / 官网后台共用（两个项目各放一份，内容保持一致） */

/* ---------- 1. 色板与背景 ---------- */
.glass-theme {
    /* 调色板变量（默认：暖霞）。其它配色见文件末尾 html[data-glass-palette] */
    --g-peach-rgb: 228, 192, 166;
    --g-rose-rgb: 212, 184, 172;
    --g-copper-rgb: 182, 112, 60;
    --g-copper-deep-rgb: 148, 87, 43;
    --g-accent-rgb: 214, 150, 96;
    --g-glow-rgb: 232, 170, 112;
    --g-shadow-rgb: 95, 52, 30;
    --g-line-rgb: 120, 72, 48;
    --g-tint-rgb: 255, 220, 190;
    --g-wash1-rgb: 255, 238, 226;
    --g-wash2-rgb: 255, 246, 240;
    --g-dark-rgb: 27, 27, 25;
    --g-rank-deep-rgb: 63, 31, 17;
    --g-copper-hi: #D08A52;
    --g-copper-hi2: #C9834D;
    --g-copper-hover: #BE7842;
    --g-copper-hover-deep: #9C5D30;
    --g-accent-text: #F0B482;
    --g-rank-top: #4A2615;
    --g-dark-text: #F1E6DD;
    --g-rank-text: #F6E7DC;
    --g-muted: #7A6156;
    --g-peach: #E4C0A6;
    --g-rose: #D4B8AC;
    --g-apricot: #EBD7CC;
    --g-copper: #B6703C;
    --g-copper-deep: #94572B;
    --g-copper-soft: rgba(var(--g-copper-rgb), 0.14);
    --g-ink: #3A2419;
    --g-ink-soft: #6E5244;
    --g-ink-faint: #A08A7F;
    --g-line: rgba(var(--g-line-rgb), 0.12);
    --g-dark: #1B1B19;
    --g-rank: #3F1F11;
    --g-fill-top: rgba(255, 255, 255, 0.6);
    --g-fill-bottom: rgba(255, 255, 255, 0.45);
    --g-stroke: rgba(255, 255, 255, 0.55);
    --g-shadow: 0 24px 60px -18px rgba(var(--g-shadow-rgb), 0.28), 0 6px 18px -8px rgba(var(--g-shadow-rgb), 0.16);
    --g-radius: 24px;
    --g-ease-spring: cubic-bezier(0.34, 1.45, 0.64, 1);

    /* 官网项目 site.css 的变量，在后台里换成暖色玻璃值 */
    --ink: #ffffff;
    --paper: rgba(255, 255, 255, 0.55);
    --surface: rgba(255, 255, 255, 0.5);
    --line: rgba(var(--g-line-rgb), 0.14);
    --text: var(--g-ink);
    --muted: var(--g-muted);
    --gold: var(--g-copper);
    --gold-dim: var(--g-copper-deep);
    --ember: #C2410C;
    --mint: #047857;
    --glass: rgba(255, 255, 255, 0.45);
    --glass-border: rgba(255, 255, 255, 0.55);
}

body.glass-theme {
    margin: 0;
    min-height: 100vh;
    color: var(--g-ink);
    background-color: var(--g-rose);
    background-image:
        radial-gradient(1100px 760px at 0% 0%, var(--g-peach) 0%, rgba(var(--g-peach-rgb), 0) 62%),
        radial-gradient(900px 640px at 62% 46%, var(--g-rose) 0%, rgba(var(--g-rose-rgb), 0) 66%),
        linear-gradient(172deg, var(--g-peach) 0%, var(--g-rose) 48%, var(--g-apricot) 100%);
    background-attachment: fixed;
    -webkit-font-smoothing: antialiased;
}

/* 两道白色半透明光弧 + 柔光团，像隔着磨砂玻璃看晚霞 */
body.glass-theme::before,
body.glass-theme::after {
    content: "";
    position: fixed;
    pointer-events: none;
    z-index: -1;
}

body.glass-theme::before {
    inset: -25%;
    background:
        radial-gradient(ellipse 62% 34% at 28% 26%, rgba(255, 255, 255, 0) 57%, rgba(255, 255, 255, 0.42) 60%, rgba(255, 255, 255, 0) 64%),
        radial-gradient(ellipse 74% 40% at 78% 82%, rgba(255, 255, 255, 0) 59%, rgba(255, 255, 255, 0.3) 62%, rgba(255, 255, 255, 0) 66%);
    filter: blur(16px);
    transform: rotate(-8deg);
}

body.glass-theme::after {
    inset: 0;
    background:
        radial-gradient(520px 420px at 82% 12%, rgba(var(--g-wash1-rgb), 0.55), rgba(var(--g-wash1-rgb), 0) 70%),
        radial-gradient(640px 480px at 12% 88%, rgba(var(--g-wash2-rgb), 0.5), rgba(var(--g-wash2-rgb), 0) 70%);
    filter: blur(30px);
}

/* ---------- 2. 外壳布局 ---------- */
.glass-shell {
    display: grid;
    grid-template-columns: 248px minmax(0, 1fr);
    min-height: 100vh;
}

html[data-glass-nav="dock"] .glass-shell {
    grid-template-columns: minmax(0, 1fr);
}

.glass-side {
    position: sticky;
    top: 0;
    height: 100vh;
    padding: 16px 0 16px 16px;
}

html[data-glass-nav="dock"] .glass-side {
    display: none;
}

.glass-side-inner {
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 20px 14px;
    border-radius: 28px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.28));
    backdrop-filter: blur(28px) saturate(140%);
    -webkit-backdrop-filter: blur(28px) saturate(140%);
    border: 1px solid var(--g-stroke);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), var(--g-shadow);
    overflow-y: auto;
}

.glass-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 4px 8px;
    font-size: 15px;
    font-weight: 700;
    color: var(--g-ink);
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.glass-brand-mark {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 11px;
    font-size: 14px;
    color: #fff;
    background: linear-gradient(145deg, var(--g-copper-hi) 0%, var(--g-copper) 55%, var(--g-copper-deep) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), 0 6px 14px -4px rgba(var(--g-copper-deep-rgb), 0.55);
}

.glass-side-foot {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 8px 0;
    border-top: 1px solid var(--g-line);
    font-size: 12px;
    color: var(--g-ink-soft);
}

.glass-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    padding: 16px 20px 32px;
}

html[data-glass-nav="dock"] .glass-main {
    padding-bottom: 128px;
}

.glass-topbar {
    position: sticky;
    top: 16px;
    z-index: 40;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 10px 14px 10px 18px;
    margin-bottom: 18px;
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.34));
    backdrop-filter: blur(28px) saturate(140%);
    -webkit-backdrop-filter: blur(28px) saturate(140%);
    border: 1px solid var(--g-stroke);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 14px 36px -18px rgba(var(--g-shadow-rgb), 0.3);
}

.glass-topbar-brand {
    display: none;
}

html[data-glass-nav="dock"] .glass-topbar-brand {
    display: flex;
}

.glass-topbar-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--g-ink);
    white-space: nowrap;
}

.glass-topbar-actions {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--g-ink-soft);
    white-space: nowrap;
}

.glass-user {
    padding: 0 6px;
    font-weight: 600;
}

.glass-icon-btn,
.glass-chip-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 34px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.7);
    background: rgba(255, 255, 255, 0.45);
    color: var(--g-ink-soft);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
    cursor: pointer;
    transition: background 0.2s, color 0.2s, transform 0.2s;
}

.glass-icon-btn {
    width: 34px;
    padding: 0;
}

.glass-chip-btn {
    padding: 0 14px;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
}

.glass-icon-btn:hover,
.glass-chip-btn:hover {
    background: rgba(255, 255, 255, 0.72);
    color: var(--g-copper-deep);
}

.glass-icon-btn svg {
    width: 17px;
    height: 17px;
}

.glass-panel {
    flex: 1;
    min-width: 0;
    padding: 24px;
    border-radius: 30px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.24), rgba(255, 255, 255, 0.12));
    border: 1px solid rgba(255, 255, 255, 0.45);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

/* ---------- 3. 滑动玻璃胶囊（左侧菜单 / 顶部标签条） ---------- */
.glass-capsule-track {
    position: relative;
}

.glass-capsule {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
    z-index: 0;
    opacity: 0;
    pointer-events: none;
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.46));
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.95),
        inset 0 -1px 0 rgba(var(--g-copper-rgb), 0.12),
        0 8px 20px -8px rgba(var(--g-shadow-rgb), 0.35);
}

/* 胶囊边缘一圈细高光 */
.glass-capsule::after {
    content: "";
    position: absolute;
    inset: 0;
    padding: 1px;
    border-radius: inherit;
    background: linear-gradient(160deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.25) 40%, rgba(255, 255, 255, 0.15) 60%, rgba(255, 255, 255, 0.9) 100%);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
}

.glass-capsule-track.is-ready .glass-capsule {
    opacity: 1;
}

.glass-side-nav {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.glass-side-link {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 10px 12px;
    border-radius: 14px;
    font-size: 14px;
    font-weight: 500;
    color: var(--g-ink-soft);
    text-decoration: none;
    transition: color 0.25s;
}

.glass-side-link svg {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    opacity: 0.85;
}

.glass-side-link:hover {
    color: var(--g-ink);
}

.glass-side-link.is-active {
    color: var(--g-ink);
    font-weight: 600;
}

.glass-side-link.is-active svg {
    color: var(--g-copper);
    opacity: 1;
}

.glass-tabs {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 4px;
    max-width: 100%;
    overflow-x: auto;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.22);
    border: 1px solid rgba(255, 255, 255, 0.5);
    scrollbar-width: none;
}

.glass-tabs .glass-capsule {
    border-radius: 999px;
}

.glass-tab {
    position: relative;
    z-index: 1;
    padding: 6px 15px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 500;
    color: var(--g-ink-soft);
    white-space: nowrap;
    text-decoration: none;
    transition: color 0.25s;
}

.glass-tab:hover,
.glass-tab.is-active {
    color: var(--g-ink);
}

.glass-tab.is-active {
    font-weight: 600;
}

/* ---------- 4. 底部浮动玻璃停靠栏 ---------- */
.glass-dock {
    position: fixed;
    left: 50%;
    bottom: 18px;
    z-index: 60;
    display: none;
    align-items: flex-end;
    gap: 6px;
    padding: 10px 14px 6px;
    transform: translateX(-50%);
    border-radius: 26px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.34));
    backdrop-filter: blur(28px) saturate(140%);
    -webkit-backdrop-filter: blur(28px) saturate(140%);
    border: 1px solid var(--g-stroke);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 22px 50px -16px rgba(var(--g-shadow-rgb), 0.4);
}

html[data-glass-nav="dock"] .glass-dock {
    display: flex;
}

.glass-dock-item {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    outline: none;
}

.glass-dock-icon {
    --s: 46px;
    width: var(--s);
    height: var(--s);
    display: grid;
    place-items: center;
    border-radius: calc(var(--s) * 0.3);
    color: var(--g-ink-soft);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.5));
    border: 1px solid rgba(255, 255, 255, 0.85);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 1), 0 6px 14px -6px rgba(var(--g-shadow-rgb), 0.35);
    transition: width 0.18s ease-out, height 0.18s ease-out, color 0.2s;
}

.glass-dock.is-hovering .glass-dock-icon {
    transition-duration: 0.08s;
}

.glass-dock-icon svg {
    width: 52%;
    height: 52%;
}

.glass-dock-item.is-active .glass-dock-icon {
    color: var(--g-copper);
}

.glass-dock-dot {
    width: 5px;
    height: 5px;
    margin-top: 5px;
    border-radius: 50%;
    background: var(--g-copper);
    opacity: 0;
}

.glass-dock-item.is-active .glass-dock-dot {
    opacity: 1;
}

.glass-dock-label {
    position: absolute;
    left: 50%;
    bottom: calc(100% + 8px);
    padding: 4px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 500;
    color: #fff;
    white-space: nowrap;
    background: rgba(var(--g-dark-rgb), 0.82);
    box-shadow: 0 6px 16px -6px rgba(0, 0, 0, 0.4);
    opacity: 0;
    transform: translate(-50%, 4px);
    pointer-events: none;
    transition: opacity 0.15s, transform 0.15s;
}

.glass-dock-item:hover .glass-dock-label,
.glass-dock-item:focus-visible .glass-dock-label {
    opacity: 1;
    transform: translate(-50%, 0);
}

.glass-dock-sep {
    align-self: center;
    width: 1px;
    height: 32px;
    margin: 0 4px 8px;
    background: rgba(var(--g-line-rgb), 0.18);
}

/* ---------- 5. 卡片 ---------- */
.glass-card,
.admin-panel,
.glass-theme main :is(div, section, form, article, a).bg-white:is(.rounded-xl, .rounded-2xl, .rounded-3xl) {
    position: relative;
    isolation: isolate;
    border-radius: var(--g-radius);
    background: linear-gradient(180deg, var(--g-fill-top), var(--g-fill-bottom));
    backdrop-filter: blur(28px) saturate(140%);
    -webkit-backdrop-filter: blur(28px) saturate(140%);
    border: 1px solid var(--g-stroke);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), var(--g-shadow);
    color: var(--g-ink);
}

/* 内层模块：在玻璃卡里再叠一层 */
.glass-inner,
.glass-theme main :is(div, section, form, article, a).bg-white:is(.rounded-xl, .rounded-2xl, .rounded-3xl) :is(div, section, form, article, a).bg-white:is(.rounded-xl, .rounded-2xl, .rounded-3xl) {
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.38);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: 1px solid rgba(255, 255, 255, 0.6);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

/* 弹窗面板：保持玻璃，但不透明度更高，保证可读 */
.glass-theme main .fixed > :is(div, form).bg-white {
    background: linear-gradient(180deg, rgba(var(--g-wash2-rgb), 0.92), rgba(var(--g-wash2-rgb), 0.86));
    border-radius: var(--g-radius);
}

/* 光标光斑与边框局部提亮（由 glass.js 写入 --gx / --gy / --glow） */
.glass-fx::before,
.glass-fx::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    opacity: var(--glow, 0);
    transition: opacity 0.35s ease;
}

.glass-fx::before {
    z-index: 2;
    background: radial-gradient(240px circle at var(--gx, 50%) var(--gy, 50%), rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0) 70%);
}

.glass-fx::after {
    z-index: 3;
    padding: 1px;
    background: radial-gradient(150px circle at var(--gx, 50%) var(--gy, 50%), rgba(255, 255, 255, 1), rgba(255, 255, 255, 0) 72%);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
}

.glass-dark.glass-fx::before {
    background: radial-gradient(260px circle at var(--gx, 50%) var(--gy, 50%), rgba(var(--g-accent-rgb), 0.16), rgba(var(--g-accent-rgb), 0) 70%);
}

.glass-dark.glass-fx::after,
.glass-rank.glass-fx::after {
    background: radial-gradient(150px circle at var(--gx, 50%) var(--gy, 50%), rgba(var(--g-glow-rgb), 0.85), rgba(var(--g-glow-rgb), 0) 72%);
}

.glass-tilt {
    transform-style: preserve-3d;
    will-change: transform;
}

/* 深色压画面卡：顶部窄铜色光晕 */
.glass-dark {
    position: relative;
    isolation: isolate;
    border-radius: var(--g-radius);
    color: var(--g-dark-text);
    background:
        linear-gradient(90deg, rgba(var(--g-accent-rgb), 0) 18%, rgba(var(--g-accent-rgb), 0.85) 50%, rgba(var(--g-accent-rgb), 0) 82%) top center / 100% 1px no-repeat,
        radial-gradient(48% 70px at 50% 0%, rgba(var(--g-copper-rgb), 0.5), rgba(var(--g-copper-rgb), 0) 100%),
        var(--g-dark);
    border: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow: 0 30px 70px -22px rgba(var(--g-dark-rgb), 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.glass-dark .glass-card-title {
    color: var(--g-dark-text);
}

/* 榜单实底卡 */
.glass-rank {
    position: relative;
    isolation: isolate;
    border-radius: var(--g-radius);
    color: var(--g-rank-text);
    background: linear-gradient(180deg, var(--g-rank-top) 0%, var(--g-rank) 100%);
    border: 1px solid rgba(var(--g-tint-rgb), 0.1);
    box-shadow: 0 26px 60px -22px rgba(var(--g-rank-deep-rgb), 0.65), inset 0 1px 0 rgba(var(--g-tint-rgb), 0.12);
}

.glass-rank .glass-card-title {
    color: var(--g-rank-text);
}

.glass-rank-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 10px;
    border-radius: 12px;
    font-size: 14px;
}

.glass-rank-row + .glass-rank-row {
    margin-top: 2px;
}

.glass-rank-row:hover {
    background: rgba(var(--g-tint-rgb), 0.06);
}

.glass-rank-no {
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    color: rgba(246, 231, 220, 0.7);
    background: rgba(var(--g-tint-rgb), 0.08);
}

.glass-rank-row:nth-child(-n + 3) .glass-rank-no {
    color: #fff;
    background: linear-gradient(145deg, var(--g-copper-hi), var(--g-copper));
}

.glass-rank-name {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.glass-rank-val {
    font-weight: 700;
    color: var(--g-accent-text);
}

.glass-card-title {
    margin: 0 0 12px;
    font-size: 14px;
    font-weight: 600;
    color: var(--g-ink);
}

/* 统计模块 */
.glass-stat {
    padding: 18px 18px 16px;
    cursor: pointer;
}

.glass-stat-value {
    font-size: 26px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--g-ink);
    font-variant-numeric: tabular-nums;
}

.glass-stat-label {
    margin-top: 4px;
    font-size: 12px;
    color: var(--g-ink-soft);
}

.glass-stat-sub {
    margin-top: 2px;
    font-size: 12px;
    color: var(--g-ink-faint);
}

.glass-stat-value.is-copper { color: var(--g-copper); }
.glass-stat-value.is-good { color: #047857; }
.glass-stat-value.is-warn { color: #B45309; }

.glass-detail[hidden] {
    display: none !important;
}

/* ---------- 6. 模块原位放大 ---------- */
.glass-expand-layer {
    position: fixed;
    inset: 0;
    z-index: 120;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 24px 150px;
}

.glass-expand-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(var(--g-shadow-rgb), 0.16);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    opacity: 0;
    transition: opacity 0.4s ease;
}

.glass-expand-layer.is-open .glass-expand-backdrop {
    opacity: 1;
}

.glass-expand-stage {
    --g-fill-top: rgba(var(--g-wash2-rgb), 0.84);
    --g-fill-bottom: rgba(var(--g-wash2-rgb), 0.74);
    position: relative;
    width: min(760px, 100%);
    min-height: 300px;
    max-height: calc(100vh - 220px);
    overflow: auto;
    padding: 36px 36px 30px;
    transform-origin: 0 0;
}

.glass-expand-body [data-glass-value] {
    font-size: 56px;
    line-height: 1.1;
}

.glass-expand-body [data-glass-label] {
    margin-top: 10px;
    font-size: 15px;
}

.glass-expand-body .glass-detail {
    margin-top: 26px;
    padding-top: 18px;
    border-top: 1px solid var(--g-line);
    font-size: 14px;
    color: var(--g-ink-soft);
}

.glass-expand-close {
    position: absolute;
    top: 16px;
    right: 16px;
    z-index: 4;
}

.glass-expand-strip {
    position: absolute;
    left: 50%;
    bottom: 26px;
    display: flex;
    gap: 10px;
    max-width: calc(100% - 32px);
    padding: 10px;
    overflow-x: auto;
    transform: translateX(-50%);
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.32));
    backdrop-filter: blur(28px) saturate(140%);
    -webkit-backdrop-filter: blur(28px) saturate(140%);
    border: 1px solid var(--g-stroke);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 20px 46px -16px rgba(var(--g-shadow-rgb), 0.4);
}

.glass-expand-thumb {
    flex: 0 0 auto;
    min-width: 112px;
    padding: 10px 14px;
    border-radius: 16px;
    text-align: left;
    cursor: pointer;
    color: var(--g-ink);
    background: rgba(255, 255, 255, 0.42);
    border: 1px solid rgba(255, 255, 255, 0.65);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
    transform-origin: 0 0;
    transition: background 0.2s, box-shadow 0.2s;
}

.glass-expand-thumb:hover {
    background: rgba(255, 255, 255, 0.7);
}

.glass-expand-thumb.is-active {
    background: rgba(255, 255, 255, 0.78);
    box-shadow: inset 0 1px 0 #fff, 0 0 0 2px rgba(var(--g-copper-rgb), 0.55);
}

.glass-expand-thumb-v {
    display: block;
    font-size: 17px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.glass-expand-thumb-l {
    display: block;
    margin-top: 2px;
    font-size: 11px;
    color: var(--g-ink-soft);
}

.glass-expand-source-hidden {
    visibility: hidden;
}

.glass-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    color: var(--g-copper);
    text-decoration: none;
}

.glass-link:hover {
    color: var(--g-copper-deep);
}

/* ---------- 7. Tailwind 写法转玻璃（只在 .glass-theme 内生效） ---------- */
.glass-theme .text-slate-900,
.glass-theme .text-slate-800,
.glass-theme .text-slate-700 { color: var(--g-ink); }
.glass-theme .text-slate-600,
.glass-theme .text-slate-500 { color: var(--g-ink-soft); }
.glass-theme .text-slate-400,
.glass-theme .text-slate-300 { color: var(--g-ink-faint); }

.glass-theme .bg-slate-50,
.glass-theme .bg-slate-100 { background-color: rgba(255, 255, 255, 0.36); }
.glass-theme .bg-slate-200 { background-color: rgba(255, 255, 255, 0.5); }
.glass-theme tbody.bg-white,
.glass-theme thead.bg-white { background-color: transparent; }
.glass-theme .hover\:bg-slate-50:hover,
.glass-theme .hover\:bg-slate-100:hover,
.glass-theme .hover\:bg-slate-200:hover { background-color: rgba(255, 255, 255, 0.5); }

.glass-theme .border-slate-100,
.glass-theme .border-slate-200,
.glass-theme .border-slate-300 { border-color: rgba(var(--g-line-rgb), 0.14); }
.glass-theme .divide-slate-100 > :not([hidden]) ~ :not([hidden]),
.glass-theme .divide-slate-200 > :not([hidden]) ~ :not([hidden]) { border-color: rgba(var(--g-line-rgb), 0.1); }
.glass-theme .ring-slate-200 { --tw-ring-color: rgba(255, 255, 255, 0.6); }

/* 靛蓝强调 → 铜橙 */
.glass-theme .text-indigo-400,
.glass-theme .text-indigo-500,
.glass-theme .text-indigo-600 { color: var(--g-copper); }
.glass-theme .text-indigo-700,
.glass-theme .text-indigo-800,
.glass-theme .text-indigo-900 { color: var(--g-copper-deep); }
.glass-theme .bg-indigo-50 { background-color: rgba(var(--g-copper-rgb), 0.1); }
.glass-theme .bg-indigo-100 { background-color: rgba(var(--g-copper-rgb), 0.16); }
.glass-theme .bg-indigo-500,
.glass-theme .bg-indigo-600 { background-color: var(--g-copper); }
.glass-theme .bg-indigo-700,
.glass-theme .bg-indigo-800,
.glass-theme .bg-indigo-900 { background-color: var(--g-copper-deep); }
.glass-theme .border-indigo-200,
.glass-theme .border-indigo-300 { border-color: rgba(var(--g-copper-rgb), 0.3); }
.glass-theme .border-indigo-400,
.glass-theme .border-indigo-500 { border-color: rgba(var(--g-copper-rgb), 0.55); }
.glass-theme .hover\:bg-indigo-100:hover { background-color: rgba(var(--g-copper-rgb), 0.2); }
.glass-theme .hover\:text-indigo-600:hover,
.glass-theme .hover\:text-indigo-800:hover { color: var(--g-copper-deep); }
.glass-theme .hover\:border-indigo-400:hover { border-color: rgba(var(--g-copper-rgb), 0.55); }

/* 天蓝主按钮与聚焦 → 铜橙（天蓝徽章保留原色区分语义） */
.glass-theme .bg-sky-600 { background-color: var(--g-copper); }
.glass-theme .hover\:bg-sky-500:hover { background-color: var(--g-copper-hover); }
.glass-theme .focus\:border-sky-500:focus { border-color: var(--g-copper); }
.glass-theme .focus\:ring-sky-100:focus { --tw-ring-color: rgba(var(--g-copper-rgb), 0.15); }
.glass-theme .focus\:bg-white:focus { background-color: rgba(255, 255, 255, 0.8); }

/* ---------- 8. 表单控件、按钮、表格 ---------- */
.glass-theme .input,
.glass-theme main input[type="text"]:not(.login-line-input),
.glass-theme main input[type="number"],
.glass-theme main input[type="password"]:not(.login-line-input),
.glass-theme main input[type="date"],
.glass-theme main input[type="datetime-local"],
.glass-theme main input:not([type]),
.glass-theme main select,
.glass-theme main textarea {
    background-color: rgba(255, 255, 255, 0.52);
    border-color: rgba(255, 255, 255, 0.75);
    color: var(--g-ink);
    box-shadow: inset 0 1px 2px rgba(var(--g-shadow-rgb), 0.06);
}

.glass-theme .input:focus,
.glass-theme main input:focus,
.glass-theme main select:focus,
.glass-theme main textarea:focus {
    outline: none;
    border-color: rgba(var(--g-copper-rgb), 0.6);
    background-color: rgba(255, 255, 255, 0.78);
    box-shadow: 0 0 0 4px rgba(var(--g-copper-rgb), 0.14);
}

.glass-theme .btn {
    border-radius: 999px;
}

.glass-theme .btn-primary {
    color: #fff;
    background: linear-gradient(180deg, var(--g-copper-hi2) 0%, var(--g-copper) 55%, var(--g-copper-deep) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 8px 18px -8px rgba(var(--g-copper-deep-rgb), 0.6);
}

.glass-theme .btn-primary:hover {
    background: linear-gradient(180deg, var(--g-copper-hi) 0%, var(--g-copper-hover) 55%, var(--g-copper-hover-deep) 100%);
}

.glass-theme .btn-secondary {
    color: var(--g-ink);
    background: rgba(255, 255, 255, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.8);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.glass-theme .btn-secondary:hover {
    background: rgba(255, 255, 255, 0.75);
    border-color: rgba(255, 255, 255, 0.9);
}

.glass-theme .btn-sm {
    padding: 0.35rem 0.8rem;
    font-size: 0.75rem;
}

.glass-theme .btn-danger {
    color: #BE123C;
    background: rgba(255, 228, 230, 0.7);
    border: 1px solid rgba(254, 205, 211, 0.9);
}

.glass-theme .btn-danger:hover {
    background: rgba(255, 228, 230, 0.95);
}

.glass-theme .badge {
    display: inline-flex;
    align-items: center;
    padding: 0.1rem 0.55rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
}

.glass-theme main thead th {
    letter-spacing: 0.06em;
}

/* 官网后台的金色按钮 */
.glass-theme .btn-gold {
    color: #fff;
    background: linear-gradient(180deg, var(--g-copper-hi2) 0%, var(--g-copper) 55%, var(--g-copper-deep) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 8px 18px -8px rgba(var(--g-copper-deep-rgb), 0.6);
}

.glass-theme .btn-ghost {
    color: var(--g-ink);
    background: rgba(255, 255, 255, 0.45);
    border: 1px solid rgba(255, 255, 255, 0.75);
}

/* ---------- 9. 登录页 ---------- */
.glass-theme .login-form-card {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.66), rgba(255, 255, 255, 0.5));
    backdrop-filter: blur(28px) saturate(140%);
    -webkit-backdrop-filter: blur(28px) saturate(140%);
    border: 1px solid var(--g-stroke);
    border-radius: var(--g-radius);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), var(--g-shadow);
}

.glass-theme .login-line-input-wrap {
    border-bottom-color: rgba(var(--g-line-rgb), 0.2);
}

.glass-theme .login-line-input-wrap:focus-within {
    border-bottom-color: var(--g-copper);
}

.glass-theme .login-form-title {
    color: var(--g-ink);
}

.glass-theme .login-form-desc {
    color: var(--g-ink-soft);
}

.glass-theme .login-submit {
    border-radius: 999px;
    background: linear-gradient(180deg, var(--g-copper-hi2) 0%, var(--g-copper) 55%, var(--g-copper-deep) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 10px 22px -8px rgba(var(--g-copper-deep-rgb), 0.6);
}

.glass-theme .login-submit:hover {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 14px 26px -8px rgba(var(--g-copper-deep-rgb), 0.65);
}

.glass-theme .login-speech-bubble {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.8);
    color: var(--g-ink);
}

.glass-theme .login-speech-bubble::after {
    border-top-color: rgba(255, 255, 255, 0.7);
}

/* ---------- 10. 窄屏与减少动态 ---------- */
@media (max-width: 900px) {
    .glass-shell {
        grid-template-columns: minmax(0, 1fr);
    }

    .glass-side,
    .glass-nav-toggle {
        display: none !important;
    }

    .glass-topbar-brand {
        display: flex;
    }

    .glass-dock {
        display: flex;
        max-width: calc(100vw - 20px);
        overflow-x: auto;
    }

    .glass-main {
        padding: 10px 10px 120px;
    }

    .glass-topbar {
        top: 10px;
        flex-wrap: wrap;
    }

    .glass-panel {
        padding: 14px;
        border-radius: 22px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .glass-theme *,
    .glass-theme *::before,
    .glass-theme *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}

/* ---------- 11. 配色模板 ---------- */
/* 海盐蓝 */
html[data-glass-palette="ocean"] .glass-theme {
    --g-peach: #AECBE0;
    --g-peach-rgb: 174, 203, 224;
    --g-rose: #ABC0CE;
    --g-rose-rgb: 171, 192, 206;
    --g-apricot: #CEDEE9;
    --g-copper: #2F6993;
    --g-copper-rgb: 47, 105, 147;
    --g-copper-deep: #215173;
    --g-copper-deep-rgb: 33, 81, 115;
    --g-copper-hi: #3D8BC2;
    --g-copper-hi2: #387FB2;
    --g-copper-hover: #3374A3;
    --g-copper-hover-deep: #25597E;
    --g-accent-rgb: 117, 171, 209;
    --g-glow-rgb: 116, 177, 220;
    --g-accent-text: #86C0EA;
    --g-ink: #1B2E3C;
    --g-ink-soft: #445A6A;
    --g-ink-faint: #84919A;
    --g-muted: #546978;
    --g-line-rgb: 47, 84, 111;
    --g-shadow-rgb: 28, 67, 95;
    --g-dark: #181A1B;
    --g-dark-rgb: 24, 26, 27;
    --g-rank: #122D3F;
    --g-rank-deep-rgb: 18, 45, 63;
    --g-rank-top: #17354A;
    --g-tint-rgb: 189, 227, 255;
    --g-wash1-rgb: 227, 243, 255;
    --g-wash2-rgb: 242, 250, 255;
    --g-dark-text: #DDE7EE;
    --g-rank-text: #DFEAF1;
}

/* 松烟绿 */
html[data-glass-palette="pine"] .glass-theme {
    --g-peach: #B1DCC7;
    --g-peach-rgb: 177, 220, 199;
    --g-rose: #AECBBD;
    --g-rose-rgb: 174, 203, 189;
    --g-apricot: #D0E7DB;
    --g-copper: #2E7652;
    --g-copper-rgb: 46, 118, 82;
    --g-copper-deep: #1F563B;
    --g-copper-deep-rgb: 31, 86, 59;
    --g-copper-hi: #3FA270;
    --g-copper-hi2: #399366;
    --g-copper-hover: #33845C;
    --g-copper-hover-deep: #236242;
    --g-accent-rgb: 124, 202, 163;
    --g-glow-rgb: 124, 213, 168;
    --g-accent-text: #8DE2B8;
    --g-ink: #1D392B;
    --g-ink-soft: #466757;
    --g-ink-faint: #85988F;
    --g-muted: #567666;
    --g-line-rgb: 52, 106, 79;
    --g-shadow-rgb: 33, 90, 61;
    --g-dark: #181B1A;
    --g-dark-rgb: 24, 27, 26;
    --g-rank: #163C29;
    --g-rank-deep-rgb: 22, 60, 41;
    --g-rank-top: #1B4630;
    --g-tint-rgb: 194, 250, 222;
    --g-wash1-rgb: 229, 253, 241;
    --g-wash2-rgb: 243, 254, 249;
    --g-dark-text: #DFECE6;
    --g-rank-text: #E0F0E8;
}

/* 薰衣紫 */
html[data-glass-palette="lavender"] .glass-theme {
    --g-peach: #C2B3DB;
    --g-peach-rgb: 194, 179, 219;
    --g-rose: #B9AFCA;
    --g-rose-rgb: 185, 175, 202;
    --g-apricot: #D8D0E6;
    --g-copper: #6845A6;
    --g-copper-rgb: 104, 69, 166;
    --g-copper-deep: #533588;
    --g-copper-deep-rgb: 83, 53, 136;
    --g-copper-hi: #8867C0;
    --g-copper-hi2: #7D59BA;
    --g-copper-hover: #714AB5;
    --g-copper-hover-deep: #5A3993;
    --g-accent-rgb: 153, 126, 200;
    --g-glow-rgb: 157, 127, 210;
    --g-accent-text: #AD90E0;
    --g-ink: #281E39;
    --g-ink-soft: #534766;
    --g-ink-faint: #8C8698;
    --g-muted: #625775;
    --g-line-rgb: 72, 54, 104;
    --g-shadow-rgb: 54, 34, 88;
    --g-dark: #19181B;
    --g-dark-rgb: 25, 24, 27;
    --g-rank: #24173B;
    --g-rank-deep-rgb: 36, 23, 59;
    --g-rank-top: #2B1C45;
    --g-tint-rgb: 215, 195, 248;
    --g-wash1-rgb: 238, 230, 252;
    --g-wash2-rgb: 247, 244, 254;
    --g-dark-text: #E4DFEC;
    --g-rank-text: #E6E1EF;
}

/* 玫瑰粉 */
html[data-glass-palette="rose"] .glass-theme {
    --g-peach: #DFAFBB;
    --g-peach-rgb: 223, 175, 187;
    --g-rose: #CDACB5;
    --g-rose-rgb: 205, 172, 181;
    --g-apricot: #E8CED5;
    --g-copper: #A83954;
    --g-copper-rgb: 168, 57, 84;
    --g-copper-deep: #882B42;
    --g-copper-deep-rgb: 136, 43, 66;
    --g-copper-hi: #C65773;
    --g-copper-hi2: #C14866;
    --g-copper-hover: #B73E5C;
    --g-copper-hover-deep: #942E48;
    --g-accent-rgb: 207, 120, 141;
    --g-glow-rgb: 218, 119, 144;
    --g-accent-text: #E788A0;
    --g-ink: #3B1C24;
    --g-ink-soft: #69454E;
    --g-ink-faint: #998489;
    --g-muted: #77555D;
    --g-line-rgb: 109, 49, 64;
    --g-shadow-rgb: 93, 29, 45;
    --g-dark: #1B1819;
    --g-dark-rgb: 27, 24, 25;
    --g-rank: #3E131E;
    --g-rank-deep-rgb: 62, 19, 30;
    --g-rank-top: #481924;
    --g-tint-rgb: 253, 190, 206;
    --g-wash1-rgb: 254, 228, 234;
    --g-wash2-rgb: 255, 243, 246;
    --g-dark-text: #EDDEE2;
    --g-rank-text: #F1DFE4;
}

/* 石墨灰 */
html[data-glass-palette="graphite"] .glass-theme {
    --g-peach: #C1C6CC;
    --g-peach-rgb: 193, 198, 204;
    --g-rose: #B9BCC0;
    --g-rose-rgb: 185, 188, 192;
    --g-apricot: #D8DBDE;
    --g-copper: #405777;
    --g-copper-rgb: 64, 87, 119;
    --g-copper-deep: #2F415B;
    --g-copper-deep-rgb: 47, 65, 91;
    --g-copper-hi: #56749F;
    --g-copper-hi2: #4F6B92;
    --g-copper-hover: #476185;
    --g-copper-hover-deep: #334866;
    --g-accent-rgb: 140, 159, 186;
    --g-glow-rgb: 142, 164, 194;
    --g-accent-text: #A4B4CC;
    --g-ink: #282B2F;
    --g-ink-soft: #53565B;
    --g-ink-faint: #8C8E91;
    --g-muted: #62656A;
    --g-line-rgb: 72, 78, 86;
    --g-shadow-rgb: 54, 60, 69;
    --g-dark: #19191A;
    --g-dark-rgb: 25, 25, 26;
    --g-rank: #24282E;
    --g-rank-deep-rgb: 36, 40, 46;
    --g-rank-top: #2B3036;
    --g-tint-rgb: 215, 221, 229;
    --g-wash1-rgb: 238, 240, 244;
    --g-wash2-rgb: 247, 248, 250;
    --g-dark-text: #E4E5E7;
    --g-rank-text: #E6E8EA;
}

/* ---------- 12. 列表卡片直角 ---------- */
/* 装着表格的卡片四角不切圆：表头底色铺满，不会被圆角切掉一块 */
.glass-flat,
.glass-card:has(table),
.glass-theme main :is(div, section, article).bg-white:is(.rounded-xl, .rounded-2xl, .rounded-3xl):not(.fixed *):has(table),
.glass-theme .admin-table.admin-panel {
    border-radius: 0;
}

/* ---------- 13. 配色切换按钮 ---------- */
.glass-palette-wrap {
    position: relative;
}

.glass-palette-pop {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 60;
    display: grid;
    gap: 4px;
    min-width: 168px;
    padding: 8px;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(var(--g-wash2-rgb), 0.96), rgba(var(--g-wash1-rgb), 0.92));
    border: 1px solid var(--g-stroke);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 20px 46px -16px rgba(var(--g-shadow-rgb), 0.4);
    backdrop-filter: blur(24px) saturate(140%);
    -webkit-backdrop-filter: blur(24px) saturate(140%);
}

.glass-palette-pop[hidden] {
    display: none;
}

.glass-palette-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 10px;
    border: 1px solid transparent;
    border-radius: 12px;
    background: transparent;
    color: var(--g-ink);
    font-size: 13px;
    cursor: pointer;
    text-align: left;
}

.glass-palette-item:hover {
    background: rgba(255, 255, 255, 0.55);
}

.glass-palette-item.is-active {
    border-color: rgba(var(--g-copper-rgb), 0.5);
    background: rgba(var(--g-copper-rgb), 0.1);
    font-weight: 700;
}

.glass-palette-swatch {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.9);
    box-shadow: 0 1px 4px rgba(var(--g-shadow-rgb), 0.25);
}

/* ---------- 14. 轻提示、结果确认框、复制工具条 ---------- */
.glass-toast {
    position: fixed;
    left: 50%;
    bottom: 56px;
    z-index: 300;
    padding: 10px 20px;
    border-radius: 999px;
    background: rgba(var(--g-dark-rgb), 0.88);
    color: #fff;
    font-size: 13px;
    opacity: 0;
    transform: translate(-50%, 10px);
    pointer-events: none;
    transition: opacity 0.2s, transform 0.2s;
}

.glass-toast.is-show {
    opacity: 1;
    transform: translate(-50%, 0);
}

.glass-notice-mask {
    position: fixed;
    inset: 0;
    z-index: 250;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: rgba(var(--g-dark-rgb), 0.4);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.glass-notice {
    width: 100%;
    max-width: 380px;
    padding: 26px 26px 22px;
    border-radius: var(--g-radius);
    text-align: center;
    background: linear-gradient(180deg, rgba(var(--g-wash2-rgb), 0.97), rgba(var(--g-wash1-rgb), 0.94));
    border: 1px solid var(--g-stroke);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), var(--g-shadow);
    color: var(--g-ink);
}

.glass-notice-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--g-copper-deep);
}

.glass-notice-msg {
    margin: 12px 0 20px;
    font-size: 15px;
    line-height: 1.6;
    word-break: break-all;
}

.glass-notice-ok {
    min-width: 120px;
}

.glass-copy-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    font-size: 13px;
    color: var(--g-ink-soft);
    background: rgba(var(--g-copper-rgb), 0.1);
    border-bottom: 1px solid rgba(var(--g-line-rgb), 0.12);
}

.glass-copy-bar[hidden] {
    display: none;
}

.glass-copy-btn {
    padding: 2px 10px;
    border-radius: 999px;
    border: 1px solid rgba(var(--g-copper-rgb), 0.35);
    background: rgba(255, 255, 255, 0.6);
    color: var(--g-copper-deep);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.glass-copy-btn:hover {
    background: rgba(255, 255, 255, 0.9);
}