/* ==========================================================================
   HCY · 蓝色浅色系液态玻璃主题
   页面级：英雄区 / 各版块 / 页脚 / 表单 / 工具 / 文档页
   本文件最后加载，用于统一覆盖各模块的旧配色
   ========================================================================== */

/* ======================================================================
   1. 版块与标题
   ====================================================================== */

/* 字体：字工厂浮生行楷（两个页面统一，图标库除外） */
body,
body * {
    font-family: var(--font-hcy,
        'HCY FangSheng',
        '字工厂浮生行楷',
        '华文行楷',
        'STXingkai',
        '楷体',
        'Microsoft YaHei',
        sans-serif) !important;
}

i.fa, i.fas, i.far, i.fal, i.fat,
.fa, .fas, .far, .fal, .fat,
.fa-solid, .fa-regular, .fa-light {
    font-family: "Font Awesome 6 Free" !important;
}

i.fab, .fab, .fa-brands {
    font-family: "Font Awesome 6 Brands" !important;
}

section { position: relative; }

#features,
#advantages,
#faq,
#rules {
    background: transparent !important;
}

/* 交替的浅蓝玻璃带 */
#features::before,
#advantages::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
                rgba(255, 255, 255, 0.34) 0%,
                rgba(255, 255, 255, 0.06) 45%,
                rgba(255, 255, 255, 0.28) 100%);
    border-top: 1px solid rgba(255, 255, 255, 0.6);
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
    pointer-events: none;
    z-index: 0;
}

#features > div,
#advantages > div,
#ip > div,
#rules > div,
#faq > div,
#social > div {
    position: relative;
    z-index: 1;
}

section h2 {
    color: var(--hcy-blue-900);
    letter-spacing: 0.06em;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);
}

section h2::after {
    content: "";
    display: block;
    width: 68px;
    height: 4px;
    margin: 0.85rem auto 0;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(96, 165, 250, 0), #3B82F6 35%, #2364D2 65%, rgba(35, 100, 210, 0));
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.45);
}

/* Tailwind 浅底/深底类改写成玻璃语汇 */
.bg-gray-50 { background-color: transparent !important; }
.bg-white { background-color: rgba(255, 255, 255, 0.72) !important; }
.text-gray-600 { color: var(--hcy-text-soft) !important; }
.text-gray-500, .text-gray-400 { color: var(--hcy-text-muted) !important; }
.text-gray-700 { color: var(--hcy-blue-800) !important; }
.text-gray-800 { color: var(--hcy-blue-900) !important; }

/* ======================================================================
   2. 英雄区（液态玻璃主视觉）
   ====================================================================== */

.hero-section {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 7rem 1.25rem 5rem;
    overflow: hidden;
    color: var(--hcy-text);
    background:
        radial-gradient(1200px 700px at 50% -10%, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0) 60%),
        linear-gradient(180deg, #EAF4FF 0%, #DDEDFF 55%, #EEF7FF 100%);
}

/* 漂浮液态光斑 */
.hero-aurora {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.aurora-blob {
    position: absolute;
    display: block;
    border-radius: 46% 54% 62% 38% / 52% 44% 56% 48%;
    filter: blur(42px);
    opacity: 0.85;
    animation: blobMorph 18s ease-in-out infinite alternate, blobFloat 14s ease-in-out infinite alternate;
}

.aurora-blob.b1 {
    width: 36vmax; height: 36vmax;
    left: -8vmax; top: -6vmax;
    background: radial-gradient(circle at 32% 30%, rgba(96, 165, 250, 0.55), rgba(96, 165, 250, 0.05) 68%);
}
.aurora-blob.b2 {
    width: 30vmax; height: 30vmax;
    right: -6vmax; top: 6vmax;
    background: radial-gradient(circle at 60% 40%, rgba(147, 197, 253, 0.6), rgba(147, 197, 253, 0.04) 70%);
    animation-delay: -4s, -2s;
}
.aurora-blob.b3 {
    width: 40vmax; height: 40vmax;
    left: 22%; bottom: -16vmax;
    background: radial-gradient(circle at 50% 50%, rgba(59, 130, 246, 0.42), rgba(59, 130, 246, 0.02) 72%);
    animation-delay: -8s, -6s;
}

@keyframes blobMorph {
    0%   { border-radius: 46% 54% 62% 38% / 52% 44% 56% 48%; }
    50%  { border-radius: 60% 40% 42% 58% / 42% 58% 42% 58%; }
    100% { border-radius: 38% 62% 56% 44% / 60% 40% 60% 40%; }
}

@keyframes blobFloat {
    0%   { transform: translate3d(0, 0, 0) scale(1); }
    100% { transform: translate3d(2.5vmax, -3vmax, 0) scale(1.08); }
}

/* 英雄区玻璃面板 */
.hero-inner {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 980px;
}

.hero-glass {
    position: relative;
    padding: clamp(1.8rem, 4vw, 3.2rem) clamp(1.3rem, 4vw, 3rem);
    text-align: center;
    border-radius: 34px;
    background:
        linear-gradient(150deg,
            rgba(255, 255, 255, 0.82) 0%,
            rgba(240, 248, 255, 0.62) 45%,
            rgba(219, 236, 255, 0.5) 100%);
    backdrop-filter: blur(30px) saturate(190%);
    -webkit-backdrop-filter: blur(30px) saturate(190%);
    border: 1px solid rgba(255, 255, 255, 0.9);
    box-shadow:
        0 50px 120px -50px rgba(9, 42, 90, 0.6),
        0 6px 24px rgba(9, 42, 90, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 1),
        inset 0 -2px 4px rgba(147, 197, 253, 0.35);
    overflow: hidden;
    animation: heroFloat 9s ease-in-out infinite alternate;
}

/* 玻璃边缘的液体高光 */
.hero-glass::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background:
        radial-gradient(120% 70% at 12% -18%, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0) 58%),
        radial-gradient(90% 70% at 92% 118%, rgba(147, 197, 253, 0.55), rgba(147, 197, 253, 0) 62%);
}

.hero-glass::after {
    content: "";
    position: absolute;
    top: -60%;
    left: -40%;
    width: 60%;
    height: 220%;
    background: linear-gradient(104deg,
                rgba(255, 255, 255, 0) 0%,
                rgba(255, 255, 255, 0.55) 45%,
                rgba(255, 255, 255, 0) 100%);
    transform: rotate(8deg);
    animation: glassSheen 9s ease-in-out infinite;
    pointer-events: none;
}

@keyframes heroFloat {
    0%   { transform: translateY(0); }
    100% { transform: translateY(-10px); }
}

@keyframes glassSheen {
    0%, 55%   { left: -55%; opacity: 0; }
    70%       { opacity: 0.9; }
    100%      { left: 115%; opacity: 0; }
}

.hero-glass > * { position: relative; z-index: 1; }

.hero-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 1rem;
    margin-bottom: 1.1rem;
    border-radius: 999px;
    font-size: 0.82rem;
    letter-spacing: 0.16em;
    color: var(--hcy-blue-700);
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(147, 197, 253, 0.7);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

#typing-title {
    min-height: 1.25em;
    font-size: clamp(2rem, 5.2vw, 3.6rem);
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--hcy-blue-900);
    margin-bottom: 1rem;
    text-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9),
        0 18px 40px rgba(27, 79, 156, 0.22);
}

.hero-sub {
    font-size: clamp(1rem, 1.6vw, 1.18rem);
    color: var(--hcy-text-soft);
    margin-bottom: 1.4rem;
    letter-spacing: 0.05em;
}

.hero-online {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 0.6rem 1.2rem;
    margin-bottom: 1.6rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.66);
    border: 1px solid rgba(147, 197, 253, 0.65);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95),
                0 14px 30px -26px rgba(9, 42, 90, 0.8);
    color: var(--hcy-text-soft);
    font-size: 1rem;
}

.hero-online #player-count {
    color: var(--hcy-blue-600);
    cursor: pointer;
    font-weight: 700;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.9rem;
}

/* 状态胶囊 */
#server-status {
    border: 1px solid rgba(255, 255, 255, 0.7);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
    letter-spacing: 0.06em;
}
#server-status.bg-green-500 { background: linear-gradient(135deg, #4ADE80, #16A34A) !important; color: #fff; }
#server-status.bg-red-500 { background: linear-gradient(135deg, #FB7185, #E11D48) !important; color: #fff; }
#server-status.bg-yellow-500 { background: linear-gradient(135deg, #FDBA74, #F59E0B) !important; color: #fff; }

/* ======================================================================
   3. 服务器地址区
   ====================================================================== */

#ip {
    background:
        radial-gradient(900px 420px at 50% -30%, rgba(255, 255, 255, 0.65), rgba(255, 255, 255, 0) 70%) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.6);
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}

#ip .bg-primary\/5 { background: transparent !important; }

#ip .bg-white {
    background: var(--glass-fill-strong) !important;
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-stroke);
    border-radius: 24px !important;
    box-shadow: var(--glass-shadow), var(--glass-highlight);
}

#ip-text,
#ip-text-secondary,
#ip-text-fast {
    color: var(--hcy-blue-700);
    letter-spacing: 0.04em;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);
    transition: color 0.25s ease;
}
#ip-text:hover,
#ip-text-secondary:hover { color: var(--hcy-blue-500); }

/* 备用线路按钮（原紫色渐变，改为浅蓝玻璃） */
#ip .copy-btn[data-target="ip-text-secondary"] {
    background:
        linear-gradient(150deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 45%),
        linear-gradient(135deg, #7FB4F5 0%, #3B82F6 60%, #2364D2 100%) !important;
}

/* ======================================================================
   4. 规则 / 社交 / FAQ
   ====================================================================== */

#rules .bg-white {
    background: var(--glass-fill) !important;
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-stroke);
    border-radius: 24px !important;
    box-shadow: var(--glass-shadow), var(--glass-highlight);
}
#rules h3 { color: var(--hcy-blue-800); }
#rules ul li span { color: var(--hcy-text-soft); }
#rules .fa-times { color: #EF6B7E !important; }

#social {
    background: linear-gradient(180deg,
                rgba(255, 255, 255, 0.5) 0%,
                rgba(226, 240, 255, 0.35) 100%) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.55);
}

.social-card { border-radius: 22px !important; }
.social-card iframe { border-radius: 14px; }

/* ======================================================================
   5. 页脚（浅蓝玻璃）
   ====================================================================== */

footer.bg-gray-900 {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.72) 0%, rgba(214, 233, 255, 0.9) 100%) !important;
    backdrop-filter: var(--glass-blur-strong);
    -webkit-backdrop-filter: var(--glass-blur-strong);
    border-top: 1px solid rgba(255, 255, 255, 0.9);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95);
    color: var(--hcy-text) !important;
}

footer h4 { color: var(--hcy-blue-800) !important; }
footer .text-gray-400 { color: var(--hcy-text-muted) !important; }
footer a.text-gray-400 { color: var(--hcy-text-soft) !important; }
footer a.text-gray-400:hover { color: var(--hcy-blue-600) !important; }
footer .border-gray-800 { border-color: rgba(147, 197, 253, 0.55) !important; }
footer .text-white { color: var(--hcy-blue-900) !important; }

/* ======================================================================
   6. 表单控件 / 工具标签 / 认证弹窗
   ====================================================================== */

input[type="text"],
input[type="password"],
input[type="number"],
input[type="email"],
select,
textarea {
    background: rgba(255, 255, 255, 0.78) !important;
    border: 1px solid rgba(147, 197, 253, 0.75) !important;
    border-radius: 12px !important;
    color: var(--hcy-text) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95);
    transition: border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
select:focus,
textarea:focus {
    outline: none;
    border-color: #3B82F6 !important;
    background: rgba(255, 255, 255, 0.95) !important;
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.16),
                inset 0 1px 0 rgba(255, 255, 255, 1);
}

input::placeholder,
textarea::placeholder { color: #8AA6C6; }

input[type="range"] {
    background: rgba(147, 197, 253, 0.5) !important;
    border: none !important;
    box-shadow: none !important;
}

/* 渐变工具 / 符号 / 色块 */
.char-btn {
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(147, 197, 253, 0.65);
    border-radius: 12px;
    color: var(--hcy-blue-800);
    transition: all 0.2s var(--hcy-ease);
}
.char-btn:hover {
    background: #fff;
    color: var(--hcy-blue-600);
    transform: translateY(-2px);
    box-shadow: 0 12px 22px -16px rgba(9, 42, 90, 0.8);
}

.utility-tab {
    border-bottom-width: 2px;
    letter-spacing: 0.03em;
    transition: all 0.25s ease;
}
.utility-tab.border-primary,
.utility-tab.text-primary { color: var(--hcy-blue-600) !important; border-color: var(--hcy-blue-600) !important; }
.utility-tab.text-gray-500 { color: var(--hcy-text-muted) !important; }

#gradient-result,
#text-preview { color: var(--hcy-blue-900); }
#color-palette { border-color: rgba(147, 197, 253, 0.65) !important; }

/* 认证弹窗 */
#auth-modal { background: radial-gradient(900px 600px at 50% 0%, rgba(59, 130, 246, 0.3), rgba(9, 32, 61, 0.45) 70%); backdrop-filter: blur(10px); }
#auth-modal .bg-white {
    background: var(--glass-fill-strong) !important;
    backdrop-filter: var(--glass-blur-strong);
    -webkit-backdrop-filter: var(--glass-blur-strong);
    border: 1px solid rgba(255, 255, 255, 0.9);
    box-shadow: 0 40px 90px -40px rgba(9, 32, 61, 0.75), var(--glass-highlight);
}
#auth-modal h3 { color: var(--hcy-blue-900); }
#auth-modal .bg-gray-100 { background: rgba(219, 234, 254, 0.6) !important; }
#auth-modal .auth-tab.bg-white { background: #fff !important; color: var(--hcy-blue-600) !important; box-shadow: 0 6px 16px -12px rgba(9, 42, 90, 0.8); }
#auth-modal label { color: var(--hcy-blue-800); }
#auth-modal .text-gray-500 { color: var(--hcy-text-muted) !important; }
#auth-form-register .bg-gradient-to-r {
    background: linear-gradient(135deg, rgba(219, 234, 254, 0.9), rgba(240, 249, 255, 0.9)) !important;
    border-color: rgba(147, 197, 253, 0.8) !important;
}
#auth-form-register .text-blue-700 { color: var(--hcy-blue-800) !important; }
#auth-form-register .text-blue-600 { color: var(--hcy-blue-700) !important; }

/* 协管守则 / 登录按钮的统一蓝色渐变 */
#close-moderator-btn,
.auth-tab-btn,
#auth-login-btn,
#terms-agree-confirm {
    background: linear-gradient(135deg, #4C93F5, #2364D2) !important;
    border: 1px solid rgba(255, 255, 255, 0.55);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6),
                0 16px 30px -20px rgba(9, 42, 90, 0.9);
}

/* ======================================================================
   7. 在线人数趋势弹框（浅色玻璃）
   ====================================================================== */

#player-chart-popup {
    background: var(--glass-fill-strong) !important;
    backdrop-filter: var(--glass-blur-strong);
    -webkit-backdrop-filter: var(--glass-blur-strong);
    border: 1px solid var(--glass-stroke) !important;
    border-radius: 18px !important;
    box-shadow: 0 30px 70px -34px rgba(9, 32, 61, 0.75),
                inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
    color: var(--hcy-text) !important;
}
#player-chart-popup > div:first-child {
    border-bottom-color: rgba(147, 197, 253, 0.6) !important;
    color: var(--hcy-blue-800);
}
#player-chart-note { color: var(--hcy-text-muted) !important; }

/* ======================================================================
   8. 移动端菜单
   ====================================================================== */

#mobile-menu {
    background: var(--glass-fill-strong) !important;
    backdrop-filter: var(--glass-blur-strong);
    -webkit-backdrop-filter: var(--glass-blur-strong);
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-top: 1px solid rgba(147, 197, 253, 0.5) !important;
    box-shadow: 0 30px 60px -30px rgba(9, 42, 90, 0.6) !important;
}
#mobile-menu .border-gray-100 { border-color: rgba(147, 197, 253, 0.45) !important; }
#mobile-menu #nav-login-btn-mobile {
    background: linear-gradient(135deg, #4C93F5, #2364D2) !important;
    border: 1px solid rgba(255, 255, 255, 0.5);
}

#nav-login-btn {
    background: linear-gradient(135deg, #4C93F5, #2364D2) !important;
    border: 1px solid rgba(255, 255, 255, 0.5);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55),
                0 14px 26px -18px rgba(9, 42, 90, 0.9);
}

/* ======================================================================
   9. 文档页（docs.html）
   ====================================================================== */

:root {
    --docs-cyan: #3B82F6;
    --docs-teal: #60A5FA;
    --docs-blue: #2364D2;
    --docs-bg: #EAF3FF;
    --docs-border: rgba(147, 197, 253, 0.55);
    --docs-text: #10294B;
    --docs-text-soft: #2F4C77;
    --docs-text-muted: #5C7799;
}

body {
    background-color: #EAF3FF;
    background-image:
        radial-gradient(1100px 720px at 8% -12%, #D8EBFF 0%, rgba(216, 235, 255, 0) 62%),
        radial-gradient(980px 760px at 96% 4%, #CDE3FF 0%, rgba(205, 227, 255, 0) 58%),
        radial-gradient(1200px 900px at 50% 116%, #DDEFFF 0%, rgba(221, 239, 255, 0) 62%),
        linear-gradient(180deg, #F7FBFF 0%, #EAF3FF 46%, #DCEBFF 100%);
    background-attachment: fixed;
    background-repeat: no-repeat;
    color: var(--docs-text);
}

/* 文档页没有 base.css，这里补上液态光斑层 */
body::before {
    content: "";
    position: fixed;
    inset: -18vmax;
    z-index: -2;
    pointer-events: none;
    background:
        radial-gradient(closest-side, rgba(96, 165, 250, 0.38), rgba(96, 165, 250, 0) 70%) 18% 22% / 46vmax 46vmax no-repeat,
        radial-gradient(closest-side, rgba(147, 197, 253, 0.42), rgba(147, 197, 253, 0) 70%) 82% 30% / 40vmax 40vmax no-repeat,
        radial-gradient(closest-side, rgba(59, 130, 246, 0.24), rgba(59, 130, 246, 0) 72%) 55% 84% / 52vmax 52vmax no-repeat;
    filter: blur(8px);
    animation: hcyLiquidDrift 26s ease-in-out infinite alternate;
}

/* 与 base.css 同名的动画（文档页未引入 base.css，这里补一份） */
@keyframes hcyLiquidDrift {
    0%   { transform: translate3d(-2%, -1%, 0) scale(1); }
    50%  { transform: translate3d(1.5%, 2%, 0) scale(1.06); }
    100% { transform: translate3d(3%, -2%, 0) scale(1.02); }
}

.docs-header {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.85), rgba(236, 246, 255, 0.62)) !important;
    backdrop-filter: var(--glass-blur-strong);
    -webkit-backdrop-filter: var(--glass-blur-strong);
    border-bottom: 1px solid rgba(255, 255, 255, 0.85);
    box-shadow: 0 10px 30px -18px rgba(13, 54, 110, 0.45),
                inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.docs-brand { color: var(--hcy-blue-900); }
.docs-brand-img {
    border: 1px solid rgba(255, 255, 255, 0.85);
    box-shadow: 0 8px 18px -12px rgba(13, 54, 110, 0.8);
}
.docs-back { color: var(--hcy-text-soft); }
.docs-back:hover { background: rgba(255, 255, 255, 0.8); color: var(--hcy-blue-600); }
.docs-header-meta { color: var(--hcy-text-muted); }

.docs-layout { position: relative; }

.docs-sidebar-title { color: var(--hcy-text-muted); }

.docs-toc a {
    color: var(--hcy-text-soft);
    border-radius: 12px;
    border-left: 2px solid transparent;
}
.docs-toc a:hover {
    background: rgba(255, 255, 255, 0.75);
    color: var(--hcy-blue-600);
    box-shadow: inset 0 0 0 1px rgba(147, 197, 253, 0.6);
}
.docs-toc a.active {
    background: linear-gradient(90deg, rgba(59, 130, 246, 0.16), rgba(59, 130, 246, 0));
    border-left-color: var(--hcy-blue-600);
    color: var(--hcy-blue-700);
    font-weight: 700;
}
.docs-toc a.active i { color: var(--hcy-blue-600); }
.docs-toc a i { color: var(--hcy-text-muted); }

.docs-section {
    background: var(--glass-fill) !important;
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid rgba(255, 255, 255, 0.85) !important;
    border-radius: 26px !important;
    box-shadow: var(--glass-shadow), var(--glass-highlight) !important;
    overflow: hidden;
}

.docs-section-title { color: var(--hcy-blue-900); }
.docs-section-sub { color: var(--hcy-text-muted); }
.docs-badge {
    background: rgba(255, 255, 255, 0.7) !important;
    color: var(--hcy-blue-700) !important;
    border: 1px solid rgba(147, 197, 253, 0.7);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.docs-markdown h1, .docs-markdown h2, .docs-markdown h3 { color: var(--hcy-blue-900); }
.docs-markdown h2 { border-left-color: var(--hcy-blue-500); }
.docs-markdown p, .docs-markdown li { color: var(--hcy-text-soft); }
.docs-markdown strong { color: var(--hcy-blue-900); }
.docs-markdown hr { border-top-color: rgba(147, 197, 253, 0.55); }
.docs-markdown blockquote {
    background: rgba(255, 255, 255, 0.66);
    border-left-color: var(--hcy-blue-500);
    color: var(--hcy-text-soft);
    border-radius: 0 14px 14px 0;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}
.docs-markdown code {
    background: rgba(255, 255, 255, 0.8);
    color: var(--hcy-blue-700);
    border: 1px solid rgba(147, 197, 253, 0.55);
}
.docs-markdown a { color: var(--hcy-blue-600); }
.docs-markdown .warning-tip { background: rgba(254, 226, 226, 0.8); border-left-color: #ef4444; color: #991b1b; }
.docs-markdown .info-tip { background: rgba(219, 234, 254, 0.85); border-left-color: #3B82F6; color: #1e40af; }

.docs-cmd {
    background: rgba(255, 255, 255, 0.6);
    border: 1px solid rgba(147, 197, 253, 0.5);
    border-radius: 14px;
    transition: all 0.25s var(--hcy-ease);
}
.docs-cmd:hover {
    background: rgba(255, 255, 255, 0.92);
    border-color: rgba(59, 130, 246, 0.6);
    transform: translateY(-2px);
    box-shadow: 0 16px 30px -24px rgba(9, 42, 90, 0.9);
}
.docs-cmd code { color: var(--hcy-blue-700); background: transparent; border: none; }
.docs-cmd-desc { color: var(--hcy-text-muted); }

.docs-dl-btn,
.docs-dl-item {
    background: rgba(255, 255, 255, 0.68);
    border: 1px solid rgba(147, 197, 253, 0.6);
    color: var(--hcy-blue-800);
    border-radius: 14px;
    transition: all 0.25s var(--hcy-ease);
}
.docs-dl-btn:hover,
.docs-dl-item:hover { background: #fff; color: var(--hcy-blue-600); }
.docs-dl-dropdown {
    background: var(--glass-fill-strong);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 16px;
    box-shadow: var(--glass-shadow), var(--glass-highlight);
}
.docs-dl-btn-hash { background: linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(219, 234, 254, 0.8)); }

.docs-agree-bar {
    background: var(--glass-fill-strong);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 18px;
    box-shadow: var(--glass-shadow), var(--glass-highlight);
}
.docs-agree-confirm-btn { background: linear-gradient(135deg, #4C93F5, #2364D2); }
.docs-agree-check-wrap input { accent-color: var(--hcy-blue-600); }

.docs-footer { color: var(--hcy-text-muted); border-top-color: rgba(147, 197, 253, 0.55); }
.docs-footer strong { color: var(--hcy-blue-800); }
.docs-footer a { color: var(--hcy-blue-600); }

.docs-to-top {
    background: linear-gradient(140deg, #4C93F5, #2364D2);
    border: 1px solid rgba(255, 255, 255, 0.6);
    box-shadow: 0 18px 36px -22px rgba(13, 54, 110, 0.9), var(--glass-highlight);
    color: #fff;
}
.docs-to-top:hover { background: linear-gradient(140deg, #60A5FA, #1B4F9C); }

.docs-toast {
    background: linear-gradient(135deg, rgba(76, 147, 245, 0.96), rgba(35, 100, 210, 0.96));
    backdrop-filter: blur(14px);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 14px;
    box-shadow: 0 22px 44px -24px rgba(9, 42, 90, 0.9);
}

.docs-overlay { background: rgba(9, 32, 61, 0.32); backdrop-filter: blur(6px); }

/* 文档页语言下拉（沿用全局玻璃样式） */
.docs-lang-dropdown .lang-current {
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(147, 197, 253, 0.6);
    color: var(--hcy-blue-700);
}

/* ======================================================================
   10. 其他细节
   ====================================================================== */

#command-toast,
.docs-toast { letter-spacing: 0.04em; }

/* 无障碍：尊重「减少动态效果」偏好 */
@media (prefers-reduced-motion: reduce) {
    .aurora-blob,
    .hero-glass,
    .hero-glass::after,
    body::before { animation: none !important; }
    .hero-btn::after,
    .copy-btn::after { transition: none !important; }
    * { scroll-behavior: auto !important; }
}

/* 移动端微调 */
@media (max-width: 768px) {
    .hero-section { padding: 6rem 1rem 3.5rem; min-height: 92vh; }
    .hero-glass { border-radius: 26px; }
    .hero-online { font-size: 0.92rem; padding: 0.5rem 0.9rem; }
    section h2 { font-size: 1.9rem !important; }
    .docs-section { border-radius: 20px !important; }
    .brand-text { display: none; }
}

/* ======================================================================
   11. 站标（HCY 玻璃徽标，替代旧图片 logo）
   ====================================================================== */

.brand {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    text-decoration: none;
    line-height: 1;
}

.brand-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.42rem 0.72rem;
    border-radius: 12px;
    font-size: 1rem !important;
    font-weight: 700;
    letter-spacing: 0.14em;
    color: #fff;
    background:
        linear-gradient(150deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 48%),
        linear-gradient(135deg, #60A5FA 0%, #2364D2 58%, #123A6E 100%);
    border: 1px solid rgba(255, 255, 255, 0.7);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8),
                0 12px 26px -16px rgba(9, 42, 90, 0.95);
    text-shadow: 0 1px 2px rgba(9, 42, 90, 0.45);
    transition: transform 0.3s var(--hcy-ease), box-shadow 0.3s ease;
}

.brand:hover .brand-mark {
    transform: translateY(-1px) scale(1.03);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9),
                0 18px 34px -18px rgba(9, 42, 90, 1);
}

.brand-text {
    font-size: 0.92rem;
    letter-spacing: 0.16em;
    color: var(--hcy-blue-800);
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);
}

/* ======================================================================
   12. 弹窗里的渐变文字统一为蓝色（公告 / 标题）
   ====================================================================== */

.modal-content .text-transparent.bg-clip-text,
#announcement-modal .text-transparent.bg-clip-text {
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: currentColor;
    color: var(--hcy-blue-700) !important;
}

.modal-content .text-transparent.bg-clip-text strong,
#announcement-modal .text-transparent.bg-clip-text strong {
    color: var(--hcy-blue-600) !important;
    -webkit-text-fill-color: currentColor;
}

