/*
|--------------------------------------------------------------------------
| GalWiki Theme - Base CSS
|--------------------------------------------------------------------------
|
| 文件：
| assets/css/base.css
|
| 当前负责：
|
| 1. 全局基础样式
| 2. CSS 变量
| 3. Reset
| 4. Header
| 5. Desktop Navigation
| 6. Search
| 7. Header Actions
| 8. Mobile Header
| 9. Mobile Menu
| 10. 通用 Button
| 11. 页面基础容器
|
| 用户中心相关：
| assets/css/user.css
|
|--------------------------------------------------------------------------
*/


/* =========================================================
   01. Global Variables
   ========================================================= */

:root {
    /* 品牌色 */

    --gw-primary: #7c5cff;
    --gw-primary-hover: #6848ed;
    --gw-primary-soft: #f1eeff;
    --gw-accent: #8b7cff;
    /* Header */

    --gw-header-height: 66px;
    --gw-header-height-mobile: 58px;
    /* 页面 */

    --gw-container-width: 1280px;
    --gw-content-width: 920px;
    /* 背景 */

    --gw-bg: #f7f8fb;
    --gw-bg-soft: #fbfbfd;
    --gw-white: #ffffff;
    /* 文字 */

    --gw-text: #20232a;
    --gw-text-secondary: #666d78;
    --gw-text-muted: #969ca7;
    --gw-text-light: #b7bcc5;
    --gw-heading: #181a20;
    /* 边框 */

    --gw-border: #e9ebf0;
    --gw-border-light: #f1f2f5;
    /* 状态 */

    --gw-success: #32b878;
    --gw-warning: #eda63d;
    --gw-danger: #e45757;
    --gw-info: #4f8cff;
    /* 圆角 */

    --gw-radius-xs: 6px;
    --gw-radius-sm: 9px;
    --gw-radius-md: 13px;
    --gw-radius-lg: 18px;
    --gw-radius-xl: 24px;
    --gw-radius-pill: 999px;
    /* 阴影 */

    --gw-shadow-xs: 0 1px 2px rgba(20, 24, 40, .04);
    --gw-shadow-sm: 0 5px 18px rgba(20, 24, 40, .07);
    --gw-shadow-md: 0 12px 32px rgba(20, 24, 40, .10);
    --gw-shadow-lg: 0 20px 55px rgba(20, 24, 40, .14);
    /* 字体 */

    --gw-font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
    /* 动画 */

    --gw-transition-fast: 150ms cubic-bezier(.2,.65,.3,1);
    --gw-transition: 240ms cubic-bezier(.2,.65,.3,1);
    --gw-transition-slow: 360ms cubic-bezier(.22,.61,.36,1);
    --gw-glass: rgba(255,255,255,.74);
    --gw-glass-strong: rgba(255,255,255,.9);
    --gw-glass-border: rgba(255,255,255,.72);
    --gw-glow: 0 0 0 1px rgba(124,92,255,.08), 0 18px 48px rgba(72,54,150,.11);
}

body { background: radial-gradient(circle at 8% -10%, rgba(139,124,255,.14), transparent 32rem), var(--gw-bg); }
.gw-container, .gw-main { position: relative; }
.gw-container::before, .gw-main::before { position:absolute; z-index:-1; width:18rem; height:18rem; border-radius:50%; background:rgba(139,124,255,.1); filter:blur(60px); content:''; pointer-events:none; }
.gw-container::before { top:2rem; right:-5rem; }
.gw-main::before { top:18rem; left:-7rem; }
.gw-card, .gw-panel, .gw-home-list-card, .gw-wiki-home__panel, .gw-user-center__content, .gw-user-center__hero, .gw-search-result, .gw-article-card { background:var(--gw-glass); border-color:var(--gw-glass-border); box-shadow:var(--gw-glow); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.gw-card, .gw-home-list-card, .gw-search-result, .gw-article-card { transition:transform var(--gw-transition), box-shadow var(--gw-transition), border-color var(--gw-transition); }
.gw-card, .gw-home-list-card, .gw-article-card { transform:perspective(900px) rotateX(var(--gw-rx,0deg)) rotateY(var(--gw-ry,0deg)); }
.gw-card:hover, .gw-home-list-card:hover, .gw-search-result:hover, .gw-article-card:hover { transform:perspective(900px) translateY(-6px) rotateX(var(--gw-rx,0deg)) rotateY(var(--gw-ry,0deg)); box-shadow:0 22px 54px rgba(72,54,150,.16); border-color:rgba(124,92,255,.32); }
.gw-reveal { opacity:0; transform:translateY(18px); transition:opacity .55s ease, transform .55s cubic-bezier(.2,.65,.3,1); }
.gw-reveal--visible { opacity:1; transform:translateY(0); }
.gw-button, button, input[type=submit] { border-radius:var(--gw-radius-sm); transition:transform var(--gw-transition-fast), box-shadow var(--gw-transition-fast), background var(--gw-transition-fast); }
.gw-button:hover, button:hover, input[type=submit]:hover { transform:translateY(-2px); box-shadow:0 8px 20px rgba(124,92,255,.2); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.01ms !important; } }

.gw-page-transition-progress {
    position: fixed;
    z-index: 10000;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    overflow: hidden;
    pointer-events: none;
    background: transparent;
    opacity: 0;
    transition: opacity .15s ease;
}

.gw-page-transition-progress.is-active {
    opacity: 1;
}

.gw-page-transition-progress::before {
    display: block;
    width: 34%;
    height: 100%;
    border-radius: 0 999px 999px 0;
    background: var(--gw-primary);
    box-shadow: 0 0 12px rgba(124, 92, 255, .45);
    content: '';
    transform: translateX(-110%);
}

.gw-page-transition-progress.is-active::before {
    animation: gw-page-transition-progress 1.15s ease-in-out infinite;
}

[data-gw-page-content] {
    position: relative;
}

.gw-not-found {
    display: grid;
    min-height: calc(100vh - var(--gw-header-height));
    padding: 72px 0;
    place-items: center;
}

.gw-not-found__content {
    max-width: 620px;
    text-align: center;
}

.gw-not-found__code {
    margin: 0;
    color: var(--gw-primary);
    font-size: 72px;
    font-weight: 800;
    line-height: 1;
}

.gw-not-found h1 {
    margin: 18px 0 10px;
    color: var(--gw-heading);
    font-size: 28px;
}

.gw-not-found__content > p:not(.gw-not-found__code) {
    margin: 0;
    color: var(--gw-text-secondary);
    line-height: 1.7;
}

.gw-not-found__actions {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 26px;
}

@media (max-width: 760px) {
    .gw-not-found {
        min-height: calc(100vh - var(--gw-header-height-mobile));
        padding: 48px 20px;
    }

    .gw-not-found__code {
        font-size: 58px;
    }

    .gw-not-found h1 {
        font-size: 24px;
    }

    .gw-not-found__actions {
        flex-direction: column;
        align-items: stretch;
    }
}

.gw-page-transitioning [data-gw-page-content] {
    opacity: .72;
    transition: opacity .15s ease;
}

.gw-page-transitioning [data-gw-page-content]::after {
    position: absolute;
    z-index: 2;
    top: 92px;
    left: 50%;
    width: 30px;
    height: 30px;
    border: 3px solid rgba(124, 92, 255, .18);
    border-top-color: var(--gw-primary);
    border-radius: 50%;
    content: '';
    pointer-events: none;
    transform: translateX(-50%);
    animation: gw-page-transition-spinner .8s linear infinite;
}

@keyframes gw-page-transition-progress {
    0% { transform: translateX(-110%); }
    50% { transform: translateX(220%); }
    100% { transform: translateX(320%); }
}

@keyframes gw-page-transition-spinner {
    to { transform: translateX(-50%) rotate(360deg); }
}

@media (max-width: 760px) {
    .gw-page-transitioning [data-gw-page-content]::after {
        top: 66px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gw-page-transition-progress.is-active::before,
    .gw-page-transitioning [data-gw-page-content]::after {
        animation: none;
    }

    .gw-page-transition-progress.is-active::before {
        width: 58%;
        transform: translateX(36%);
    }
}


/* =========================================================
   02. Reset
   ========================================================= */

html {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

*,
*::before,
*::after {
    box-sizing: inherit;
}

html,
body {
    margin: 0;
    padding: 0;
}

body {
    min-height: 100vh;
    background: var(--gw-bg);
    color: var(--gw-text);
    font-family: var(--gw-font);
    font-size: 16px;
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

button,
input,
textarea,
select {
    font: inherit;
}

button {
    border: 0;
}

img,
svg,
video {
    display: block;
    max-width: 100%;
}

img {
    height: auto;
}

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

ul,
ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
blockquote {
    margin-top: 0;
}

input,
textarea,
button {
    outline: none;
}


/* =========================================================
   03. Accessibility
   ========================================================= */

.screen-reader-text {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

    .screen-reader-text:focus {
        position: fixed !important;
        top: 10px;
        left: 10px;
        width: auto !important;
        height: auto !important;
        padding: 10px 14px !important;
        margin: 0 !important;
        overflow: visible !important;
        clip: auto !important;
        background: #fff;
        color: #111;
        border: 2px solid var(--gw-primary);
        border-radius: var(--gw-radius-sm);
        box-shadow: var(--gw-shadow-md);
        z-index: 999999;
    }


/* =========================================================
   04. Basic Layout
   ========================================================= */

.gw-site {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.gw-main {
    flex: 1 1 auto;
}

.gw-container {
    width: min( calc(100% - 32px), var(--gw-container-width) );
    margin-left: auto;
    margin-right: auto;
}


/* =========================================================
   05. Generic Button
   ========================================================= */

.gw-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 38px;
    padding: 0 16px;
    background: var(--gw-primary);
    color: #fff;
    border: 1px solid var(--gw-primary);
    border-radius: var(--gw-radius-sm);
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    transition: background var(--gw-transition-fast), border-color var(--gw-transition-fast), transform var(--gw-transition-fast), box-shadow var(--gw-transition-fast);
}

    .gw-button:hover {
        background: var(--gw-primary-hover);
        border-color: var(--gw-primary-hover);
        color: #fff;
        box-shadow: 0 5px 16px rgba(124, 92, 255, .18);
        transform: translateY(-1px);
    }

    .gw-button:active {
        transform: translateY(0);
    }

.gw-button--secondary {
    background: var(--gw-primary-soft);
    border-color: var(--gw-primary-soft);
    color: var(--gw-primary);
}

    .gw-button--secondary:hover {
        background: #e9e4ff;
        border-color: #e9e4ff;
        color: var(--gw-primary-hover);
    }

.gw-button--ghost {
    background: transparent;
    border-color: transparent;
    color: var(--gw-text-secondary);
}

    .gw-button--ghost:hover {
        background: var(--gw-bg-soft);
        border-color: var(--gw-border);
        color: var(--gw-text);
        box-shadow: none;
    }


/* =========================================================
   06. Icon Base
   GalWiki Unified Icon System
   ========================================================= */

/*
 * 设计原则：
 *
 * 1. 所有图标统一 20 × 20
 * 2. 所有 SVG 使用 24 × 24 viewBox
 * 3. 统一 1.8px stroke
 * 4. 统一 round linecap / linejoin
 * 5. 统一视觉边界
 * 6. 不使用字体图标
 * 7. 不依赖 CDN
 */

.gw-icon {
    position: relative;

    display: inline-flex;

    width: 20px;
    height: 20px;

    flex: 0 0 20px;

    align-items: center;
    justify-content: center;

    color: currentColor;

    background-color: currentColor;

    font-size: 0;
    line-height: 0;

    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;

    -webkit-mask-position: center;
    mask-position: center;

    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;

    transition:
        color var(--gw-transition-fast),
        transform var(--gw-transition-fast),
        opacity var(--gw-transition-fast);
}


/* =========================================================
   01. Menu
   ========================================================= */

.gw-icon--menu {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round'%3E%3Cpath d='M4 6.5h16M4 12h16M4 17.5h16'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round'%3E%3Cpath d='M4 6.5h16M4 12h16M4 17.5h16'/%3E%3C/svg%3E");
}


/* =========================================================
   02. Search
   ========================================================= */

.gw-icon--search {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10.8' cy='10.8' r='6.2'/%3E%3Cpath d='m15.4 15.4 4.5 4.5'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10.8' cy='10.8' r='6.2'/%3E%3Cpath d='m15.4 15.4 4.5 4.5'/%3E%3C/svg%3E");
}


/* =========================================================
   03. Close
   ========================================================= */

.gw-icon--close {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E");
}


/* =========================================================
   04. User
   ========================================================= */

.gw-icon--user {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='7.7' r='3.35'/%3E%3Cpath d='M5.3 20c.75-3.35 3.2-5.2 6.7-5.2s5.95 1.85 6.7 5.2'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='7.7' r='3.35'/%3E%3Cpath d='M5.3 20c.75-3.35 3.2-5.2 6.7-5.2s5.95 1.85 6.7 5.2'/%3E%3C/svg%3E");
}


/* =========================================================
   05. Bell
   ========================================================= */

.gw-icon--bell {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 9.2a6 6 0 0 0-12 0c0 6.5-2.6 7.2-2.6 9h17.2c0-1.8-2.6-2.5-2.6-9z'/%3E%3Cpath d='M9.8 21h4.4'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 9.2a6 6 0 0 0-12 0c0 6.5-2.6 7.2-2.6 9h17.2c0-1.8-2.6-2.5-2.6-9z'/%3E%3Cpath d='M9.8 21h4.4'/%3E%3C/svg%3E");
}


/* =========================================================
   06. Star / Favorite
   ========================================================= */

.gw-icon--star {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3.2 2.72 5.52 6.09.89-4.4 4.29 1.04 6.07L12 17.1l-5.45 2.87 1.04-6.07-4.4-4.29 6.09-.89L12 3.2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3.2 2.72 5.52 6.09.89-4.4 4.29 1.04 6.07L12 17.1l-5.45 2.87 1.04-6.07-4.4-4.29 6.09-.89L12 3.2z'/%3E%3C/svg%3E");
}


/* =========================================================
   07. Comment
   ========================================================= */

.gw-icon--comment {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11.7a7.3 7.3 0 0 1-7.3 7.3H8l-4 2v-4.35A7.3 7.3 0 1 1 20 11.7z'/%3E%3Cpath d='M8.2 11.8h.01M12 11.8h.01M15.8 11.8h.01'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11.7a7.3 7.3 0 0 1-7.3 7.3H8l-4 2v-4.35A7.3 7.3 0 1 1 20 11.7z'/%3E%3Cpath d='M8.2 11.8h.01M12 11.8h.01M15.8 11.8h.01'/%3E%3C/svg%3E");
}


/* =========================================================
   08. Cloud
   ========================================================= */

.gw-icon--cloud {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7.2 18.3h9.6a4 4 0 0 0 .8-7.92A6 6 0 0 0 6.2 8.75a4.55 4.55 0 0 0 1 9.55z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7.2 18.3h9.6a4 4 0 0 0 .8-7.92A6 6 0 0 0 6.2 8.75a4.55 4.55 0 0 0 1 9.55z'/%3E%3C/svg%3E");
}


/* =========================================================
   09. Task
   ========================================================= */

.gw-icon--task {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4.2' y='3.2' width='15.6' height='17.6' rx='3'/%3E%3Cpath d='m8 9.6 1.7 1.7 3.4-3.4M8 15.2h8'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4.2' y='3.2' width='15.6' height='17.6' rx='3'/%3E%3Cpath d='m8 9.6 1.7 1.7 3.4-3.4M8 15.2h8'/%3E%3C/svg%3E");
}


/* =========================================================
   10. Wallet / Points
   ========================================================= */

.gw-icon--points {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.7' y='5' width='16.6' height='14' rx='3'/%3E%3Cpath d='M4 8.2h13.7a2.6 2.6 0 0 1 2.6 2.6v.9h-5.1a2.15 2.15 0 1 0 0 4.3h5.1'/%3E%3Ccircle cx='15.9' cy='13.85' r='.75' fill='black' stroke='none'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.7' y='5' width='16.6' height='14' rx='3'/%3E%3Cpath d='M4 8.2h13.7a2.6 2.6 0 0 1 2.6 2.6v.9h-5.1a2.15 2.15 0 1 0 0 4.3h5.1'/%3E%3Ccircle cx='15.9' cy='13.85' r='.75' fill='black' stroke='none'/%3E%3C/svg%3E");
}

.gw-icon--sponsor {
    display: inline-block;
    width: 18px;
    height: 18px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.6l-1-1a5.5 5.5 0 0 0-7.8 7.8l1 1L12 21l7.8-7.6 1-1a5.5 5.5 0 0 0 0-7.8Z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.6l-1-1a5.5 5.5 0 0 0-7.8 7.8l1 1L12 21l7.8-7.6 1-1a5.5 5.5 0 0 0 0-7.8Z'/%3E%3C/svg%3E") center / contain no-repeat;
}


/* =========================================================
   11. Edit
   ========================================================= */

.gw-icon--edit {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 19.7.95-4.05L14.8 5.8a2.65 2.65 0 0 1 3.75 3.75l-9.85 9.85L4 19.7z'/%3E%3Cpath d='m13.9 6.7 3.4 3.4M4 19.7h4.1'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 19.7.95-4.05L14.8 5.8a2.65 2.65 0 0 1 3.75 3.75l-9.85 9.85L4 19.7z'/%3E%3Cpath d='m13.9 6.7 3.4 3.4M4 19.7h4.1'/%3E%3C/svg%3E");
}


/* =========================================================
   12. Icon size normalization
   ========================================================= */

/*
 * Header action
 */

.gw-header__action .gw-icon {
    width: 20px;
    height: 20px;
    flex-basis: 20px;
}


/*
 * Mobile buttons
 */

.gw-header__icon-button .gw-icon {
    width: 20px;
    height: 20px;
    flex-basis: 20px;
}


/*
 * Mobile menu tools
 */

.gw-mobile-menu__tool .gw-icon {
    width: 20px;
    height: 20px;
    flex-basis: 20px;
}


/*
 * Submit button
 */

.gw-header__submit .gw-icon,
.gw-header__login .gw-icon {
    width: 18px;
    height: 18px;
    flex-basis: 18px;
}


/*
 * User dropdown
 */

.gw-header__user-item .gw-icon {
    width: 18px;
    height: 18px;
    flex-basis: 18px;
}


/* =========================================================
   13. Icon visual alignment
   ========================================================= */

.gw-header__action {
    line-height: 1;
}


.gw-header__action .gw-icon {
    margin-top: 0;
    margin-bottom: 3px;
}


.gw-mobile-menu__tool .gw-icon {
    margin: 0;
}


/* =========================================================
   14. Hover
   ========================================================= */

.gw-header__action:hover .gw-icon,
.gw-header__icon-button:hover .gw-icon,
.gw-header__user:hover .gw-icon {
    transform: scale(1.045);
}


.gw-header__action:active .gw-icon,
.gw-header__icon-button:active .gw-icon,
.gw-header__user:active .gw-icon {
    transform: scale(.95);
}

/* =========================================================
   07. Modern Header
   ========================================================= */

/*
 * GalWiki Header
 *
 * 特性：
 * ---------------------------------------------------------
 * 1. 毛玻璃
 * 2. 飘逸隐藏 / 出现
 * 3. WordPress Admin Bar 自适应
 * 4. 桌面导航
 * 5. 搜索
 * 6. 用户菜单
 * 7. 移动端菜单
 * 8. 移动端搜索
 */

.gw-header {
    position: fixed;

    top: var(--gw-wp-adminbar-height, 0px);
    left: 0;
    right: 0;

    width: 100%;
    height: var(--gw-header-height);

    background:
        rgba(255, 255, 255, .90);

    border-bottom:
        1px solid rgba(20, 24, 40, .055);

    box-shadow:
        0 8px 30px rgba(20, 24, 40, .055);

    backdrop-filter:
        blur(18px)
        saturate(150%);

    -webkit-backdrop-filter:
        blur(18px)
        saturate(150%);

    z-index: 9000;

    isolation: isolate;

    transform:
        translate3d(0, 0, 0);

    will-change:
        transform;

    backface-visibility:
        hidden;

    -webkit-backface-visibility:
        hidden;

    transition:
        transform .42s cubic-bezier(.22, .61, .36, 1),
        background .28s ease,
        box-shadow .28s ease;
}


/* =========================================================
   Header 显示
   ========================================================= */

.gw-header.gw-header--visible {
    transform:
        translate3d(0, 0, 0);
}


/* =========================================================
   Header 隐藏
   ========================================================= */

.gw-header.gw-header--hidden {
    transform:
        translate3d(0, -112%, 0);
}


/* =========================================================
   Header 锁定
   ========================================================= */

.gw-header.gw-header--locked {
    transform:
        translate3d(0, 0, 0);
}


/* =========================================================
   页面顶部补偿
   ========================================================= */

body {
    padding-top:
        calc(
            var(--gw-header-height)
            +
            var(--gw-wp-adminbar-height, 0px)
        );
}


/* =========================================================
   Header Container
   ========================================================= */

.gw-header__container {
    position:
        relative;

    display:
        flex;

    align-items:
        center;

    width:
        min(
            calc(100% - 36px),
            var(--gw-container-width)
        );

    height:
        var(--gw-header-height);

    margin:
        0 auto;

    padding:
        0;

    gap:
        0;

    overflow:
        visible;
}


/* =========================================================
   Logo
   ========================================================= */

.gw-header__logo {
    position:
        relative;

    display:
        flex;

    align-items:
        center;

    flex:
        0 0 auto;

    height:
        var(--gw-header-height);

    margin:
        0 20px 0 0;

    z-index:
        20;
}


.gw-header__logo-link {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        auto;

    height:
        var(--gw-header-height);

    max-width:
        210px;

    color:
        var(--gw-heading);

    text-decoration:
        none;

    -webkit-tap-highlight-color:
        transparent;
}


.gw-header__logo-image {
    display:
        block;

    width:
        auto;

    height:
        36px;

    max-width:
        185px;

    object-fit:
        contain;
}


.gw-header__logo-text {
    display:
        block;

    max-width:
        210px;

    overflow:
        hidden;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;

    color:
        var(--gw-heading);

    font-size:
        20px;

    font-weight:
        800;

    letter-spacing:
        -.45px;
}


/* =========================================================
   Desktop Navigation
   ========================================================= */

.gw-header__nav {
    display:
        flex;

    align-items:
        center;

    flex:
        0 1 auto;

    min-width:
        0;

    height:
        var(--gw-header-height);

    overflow:
        visible;
}


.gw-header__menu {
    display:
        flex;

    align-items:
        center;

    gap:
        4px;

    height:
        var(--gw-header-height);

    margin:
        0;

    padding:
        0;

    list-style:
        none;

    overflow:
        visible;
}


.gw-header__menu > li {
    position:
        relative;

    display:
        flex;

    align-items:
        center;

    height:
        var(--gw-header-height);

    margin:
        0;

    padding:
        0;

    list-style:
        none;
}


.gw-header__menu > li > a {
    position:
        relative;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    height:
        38px;

    padding:
        0 14px;

    color:
        var(--gw-text-secondary);

    background:
        transparent;

    border:
        1px solid transparent;

    border-radius:
        11px;

    font-size:
        13px;

    font-weight:
        600;

    line-height:
        1;

    white-space:
        nowrap;

    text-decoration:
        none;

    transition:
        color .18s ease,
        background .18s ease,
        border-color .18s ease,
        transform .18s ease;

    -webkit-tap-highlight-color:
        transparent;
}


.gw-header__menu > li > a:hover {
    color:
        var(--gw-primary);

    background:
        rgba(124, 92, 255, .07);

    border-color:
        rgba(124, 92, 255, .08);

    transform:
        translateY(-1px);
}


/* =========================================================
   Desktop Dropdown
   ========================================================= */

.gw-header__menu li {
    position:
        relative;
}


.gw-header__menu .sub-menu {
    position:
        absolute;

    top:
        calc(100% - 1px);

    left:
        0;

    min-width:
        185px;

    max-width:
        290px;

    margin:
        0;

    padding:
        8px;

    background:
        rgba(255, 255, 255, .97);

    border:
        1px solid var(--gw-border);

    border-radius:
        14px;

    box-shadow:
        0 18px 45px rgba(20, 24, 40, .12);

    backdrop-filter:
        blur(18px);

    -webkit-backdrop-filter:
        blur(18px);

    opacity:
        0;

    visibility:
        hidden;

    pointer-events:
        none;

    transform:
        translate3d(0, 8px, 0);

    z-index:
        9100;

    transition:
        opacity .18s ease,
        visibility .18s ease,
        transform .18s ease;
}


.gw-header__menu li:hover > .sub-menu,
.gw-header__menu li:focus-within > .sub-menu {

    opacity:
        1;

    visibility:
        visible;

    pointer-events:
        auto;

    transform:
        translate3d(0, 0, 0);
}


.gw-header__menu .sub-menu li {
    position:
        relative;

    width:
        100%;

    margin:
        0;

    padding:
        0;
}


.gw-header__menu .sub-menu li a {
    display:
        flex;

    align-items:
        center;

    width:
        100%;

    min-height:
        40px;

    padding:
        8px 12px;

    color:
        var(--gw-text-secondary);

    border-radius:
        9px;

    font-size:
        12px;

    line-height:
        1.4;

    white-space:
        nowrap;

    text-decoration:
        none;

    transition:
        background .18s ease,
        color .18s ease;
}


.gw-header__menu .sub-menu li a:hover {
    color:
        var(--gw-primary);

    background:
        var(--gw-primary-soft);
}


/* 二级菜单 */

.gw-header__menu .sub-menu .sub-menu {
    top:
        -8px;

    left:
        calc(100% - 2px);

    transform:
        translate3d(8px, 0, 0);
}


.gw-header__menu .sub-menu li:hover > .sub-menu,
.gw-header__menu .sub-menu li:focus-within > .sub-menu {

    transform:
        translate3d(0, 0, 0);
}


/* =========================================================
   Search
   ========================================================= */

.gw-header__search {
    position:
        relative;

    flex:
        1 1 280px;

    width:
        100%;

    max-width:
        410px;

    min-width:
        160px;

    margin:
        0 14px 0 22px;

    z-index:
        50;
}


.gw-search {
    position:
        relative;

    display:
        flex;

    align-items:
        center;

    width:
        100%;

    height:
        40px;

    margin:
        0;

    padding:
        0 7px 0 15px;

    background:
        #f5f6f9;

    border:
        1px solid transparent;

    border-radius:
        999px;

    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .85);

    transition:
        background .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}


.gw-search:hover {
    background:
        #f1f2f7;
}


.gw-search:focus-within,
.gw-search.search-active {
    background:
        #fff;

    border-color:
        rgba(124, 92, 255, .30);

    box-shadow:
        0 0 0 4px rgba(124, 92, 255, .075);
}


.gw-search__input {
    flex:
        1 1 auto;

    width:
        100%;

    min-width:
        0;

    height:
        100%;

    margin:
        0;

    padding:
        0;

    background:
        transparent;

    border:
        0;

    outline:
        none;

    color:
        var(--gw-text);

    font-size:
        13px;

    line-height:
        1;
}


.gw-search__input::placeholder {
    color:
        #a0a5ae;
}


.gw-search__submit {
    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    flex:
        0 0 auto;

    width:
        33px;

    height:
        33px;

    margin:
        0;

    padding:
        0;

    color:
        var(--gw-text-muted);

    background:
        transparent;

    border:
        0;

    border-radius:
        50%;

    cursor:
        pointer;

    touch-action:
        manipulation;

    transition:
        color .18s ease,
        background .18s ease,
        transform .18s ease;
}


.gw-search__submit:hover {
    color:
        var(--gw-primary);

    background:
        var(--gw-primary-soft);
}


.gw-search__submit:active {
    transform:
        scale(.94);
}


/* =========================================================
   Search Panel
   ========================================================= */

.gw-search-panel {
    position:
        absolute;

    top:
        calc(100% + 9px);

    left:
        0;

    width:
        100%;

    padding:
        15px;

    background:
        rgba(255, 255, 255, .98);

    border:
        1px solid var(--gw-border);

    border-radius:
        16px;

    box-shadow:
        0 18px 45px rgba(20, 24, 40, .12);

    backdrop-filter:
        blur(18px);

    -webkit-backdrop-filter:
        blur(18px);

    opacity:
        0;

    visibility:
        hidden;

    pointer-events:
        none;

    transform:
        translate3d(0, 7px, 0);

    z-index:
        9200;

    transition:
        opacity .18s ease,
        visibility .18s ease,
        transform .18s ease;
}


.gw-search:focus-within .gw-search-panel,
.gw-search.search-active .gw-search-panel {

    opacity:
        1;

    visibility:
        visible;

    pointer-events:
        auto;

    transform:
        translate3d(0, 0, 0);
}


/* =========================================================
   Search Sections
   ========================================================= */

.gw-search-panel__section {
    width:
        100%;
}


.gw-search-panel__section + .gw-search-panel__section {

    margin-top:
        13px;

    padding-top:
        13px;

    border-top:
        1px solid var(--gw-border-light);
}


.gw-search-panel__header {

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        12px;

    margin-bottom:
        9px;

    color:
        var(--gw-text-secondary);

    font-size:
        12px;

    font-weight:
        650;
}


.gw-search-panel__clear {

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        26px;

    margin:
        0;

    padding:
        0 7px;

    color:
        var(--gw-text-muted);

    background:
        transparent;

    border:
        0;

    border-radius:
        7px;

    font-size:
        11px;

    line-height:
        1;

    cursor:
        pointer;

    touch-action:
        manipulation;

    -webkit-appearance:
        none;

    appearance:
        none;

    transition:
        color .18s ease,
        background .18s ease;
}


.gw-search-panel__clear:hover {

    color:
        var(--gw-primary);

    background:
        var(--gw-primary-soft);
}


.gw-search-panel__clear:active {
    transform:
        scale(.96);
}


/* =========================================================
   Search History
   ========================================================= */

.gw-search-history {

    display:
        flex;

    flex-wrap:
        wrap;

    align-items:
        center;

    gap:
        7px;

    width:
        100%;

    min-height:
        29px;
}


.gw-search-history__row {

    display:
        inline-flex;

    align-items:
        center;

    flex:
        0 0 auto;

    min-width:
        0;

    max-width:
        230px;

    min-height:
        29px;

    overflow:
        hidden;

    background:
        #fafafd;

    border:
        1px solid var(--gw-border);

    border-radius:
        999px;

    transition:
        background .18s ease,
        border-color .18s ease,
        transform .18s ease;
}


.gw-search-history__row:hover {

    background:
        var(--gw-primary-soft);

    border-color:
        rgba(124, 92, 255, .18);

    transform:
        translateY(-1px);
}


.gw-search-history__item {

    display:
        inline-flex;

    align-items:
        center;

    min-width:
        0;

    max-width:
        190px;

    min-height:
        28px;

    margin:
        0;

    padding:
        0 8px 0 11px;

    color:
        var(--gw-text-secondary);

    background:
        transparent;

    border:
        0;

    border-radius:
        999px 0 0 999px;

    font-size:
        11px;

    line-height:
        1;

    text-align:
        left;

    white-space:
        nowrap;

    overflow:
        hidden;

    text-overflow:
        ellipsis;

    cursor:
        pointer;

    touch-action:
        manipulation;
}


.gw-search-history__item:hover {

    color:
        var(--gw-primary);

    background:
        transparent;
}


.gw-search-history__delete {

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    flex:
        0 0 26px;

    width:
        26px;

    height:
        28px;

    margin:
        0;

    padding:
        0;

    color:
        #a8adb6;

    background:
        transparent;

    border:
        0;

    border-left:
        1px solid rgba(20, 24, 40, .045);

    border-radius:
        0 999px 999px 0;

    font-family:
        Arial,
        sans-serif;

    font-size:
        14px;

    line-height:
        1;

    cursor:
        pointer;

    touch-action:
        manipulation;
}


.gw-search-history__delete:hover {

    color:
        var(--gw-danger);

    background:
        rgba(228, 87, 87, .07);
}


.gw-search-history__delete:active {

    transform:
        scale(.90);
}


.gw-search-empty {

    display:
        block;

    width:
        100%;

    color:
        var(--gw-text-muted);

    font-size:
        11px;

    line-height:
        1.6;
}


/* =========================================================
   Hot Search
   ========================================================= */

.gw-search-hot {

    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        3px 7px;

    width:
        100%;
}


.gw-search-hot__item {

    display:
        flex;

    align-items:
        center;

    width:
        100%;

    min-width:
        0;

    min-height:
        32px;

    margin:
        0;

    padding:
        0 6px;

    color:
        var(--gw-text-secondary);

    background:
        transparent;

    border:
        0;

    border-radius:
        8px;

    font-size:
        12px;

    line-height:
        1;

    text-align:
        left;

    cursor:
        pointer;

    touch-action:
        manipulation;

    transition:
        color .18s ease,
        background .18s ease;
}


.gw-search-hot__item:hover {

    color:
        var(--gw-primary);

    background:
        var(--gw-primary-soft);
}


.gw-search-hot__item:active {

    transform:
        scale(.985);
}


.gw-search-hot__index {

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    flex:
        0 0 21px;

    width:
        21px;

    height:
        21px;

    color:
        #adb2bb;

    font-size:
        10px;

    text-align:
        center;
}


.gw-search-hot__item:nth-child(1)
.gw-search-hot__index,

.gw-search-hot__item:nth-child(2)
.gw-search-hot__index,

.gw-search-hot__item:nth-child(3)
.gw-search-hot__index {

    color:
        var(--gw-primary);
}


.gw-search-hot__name {

    flex:
        1 1 auto;

    min-width:
        0;

    overflow:
        hidden;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;

    font-size:
        12px;
}


/* =========================================================
   Header Actions
   ========================================================= */

.gw-header__actions {

    display:
        flex;

    align-items:
        center;

    flex:
        0 0 auto;

    height:
        var(--gw-header-height);

    gap:
        3px;

    margin:
        0;

    padding:
        0;

    white-space:
        nowrap;
}


.gw-header__action {

    position:
        relative;

    display:
        flex;

    flex-direction:
        column;

    align-items:
        center;

    justify-content:
        center;

    flex:
        0 0 auto;

    min-width:
        44px;

    height:
        48px;

    margin:
        0;

    padding:
        3px 5px;

    color:
        var(--gw-text-secondary);

    background:
        transparent;

    border:
        1px solid transparent;

    border-radius:
        11px;

    font-size:
        0;

    line-height:
        1;

    text-decoration:
        none;

    cursor:
        pointer;

    touch-action:
        manipulation;

    transition:
        background .18s ease,
        color .18s ease,
        border-color .18s ease,
        transform .18s ease;
}


.gw-header__action:hover {

    color:
        var(--gw-primary);

    background:
        rgba(124, 92, 255, .065);

    border-color:
        rgba(124, 92, 255, .08);

    transform:
        translateY(-1px);
}


.gw-header__action:active {

    transform:
        translateY(0) scale(.97);
}


.gw-header__action .gw-icon {

    width:
        18px;

    height:
        18px;

    margin-bottom:
        3px;
}


.gw-header__action-label {

    display:
        block;

    color:
        currentColor;

    font-size:
        9px;

    font-weight:
        600;

    line-height:
        13px;
}


/* =========================================================
   Points / Balance
   ========================================================= */

.gw-header__points {

    display:
        flex;

    flex-direction:
        row;

    align-items:
        center;

    gap:
        6px;

    min-width:
        auto;

    padding:
        0 8px;
}


.gw-header__points .gw-icon {

    width:
        17px;

    height:
        17px;

    margin:
        0;
}


.gw-header__points-content {

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        center;

    min-width:
        0;

    line-height:
        1;
}


.gw-header__points-label {

    display:
        block;

    color:
        var(--gw-text-light);

    font-size:
        8px;

    line-height:
        11px;

    white-space:
        nowrap;
}


.gw-header__points-value {

    display:
        block;

    color:
        var(--gw-primary);

    font-size:
        12px;

    font-weight:
        800;

    line-height:
        14px;

    white-space:
        nowrap;
}


/* Points quick menu: positioned against the trigger, never the whole header. */
.gw-header__points-wrap {
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
}

.gw-header__points {
    position: relative;
    border: 0;
    font: inherit;
}

.gw-header__points-task-count {
    position: absolute;
    top: 2px;
    right: 1px;
    display: grid;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    place-items: center;
    border: 2px solid #fff;
    border-radius: 999px;
    background: var(--gw-primary);
    color: #fff;
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
}

.gw-header__points-menu {
    position: absolute;
    z-index: 9200;
    top: calc(100% - 2px);
    right: 0;
    display: none;
    width: 196px;
    padding: 7px;
    border: 1px solid rgba(35, 29, 61, .12);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 16px 38px rgba(29, 24, 61, .18);
}

.gw-header__points-wrap.is-open .gw-header__points-menu {
    display: block;
    animation: gwHeaderPointsMenuIn .16s ease-out;
}

.gw-header__points-menu-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 1px 3px 6px;
    padding: 0 0 8px;
    border-bottom: 1px solid var(--gw-border-light);
    color: var(--gw-text-muted);
    font-size: 11px;
}

.gw-header__points-menu-summary strong {
    color: var(--gw-heading);
    font-size: 12px;
}

.gw-header__points-menu a {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 0 8px;
    border-radius: 6px;
    color: var(--gw-text-secondary);
    font-size: 12px;
    font-weight: 650;
    text-decoration: none;
}

.gw-header__points-menu a:hover,
.gw-header__points-menu a:focus-visible {
    background: var(--gw-primary-soft);
    color: var(--gw-primary);
}

.gw-header__points-menu .gw-header__task-count {
    margin-left: auto;
}

@keyframes gwHeaderPointsMenuIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}


/* =========================================================
   Notification
   ========================================================= */

.gw-header__notification {

    position:
        relative;
}


.gw-header__notification-dot {

    position:
        absolute;

    top:
        7px;

    right:
        8px;

    width:
        7px;

    height:
        7px;

    background:
        var(--gw-danger);

    border:
        2px solid #fff;

    border-radius:
        50%;
}


.gw-header__notification-dot[hidden] {
    display:
        none !important;
}


/* =========================================================
   User Wrapper
   ========================================================= */

.gw-header__user-wrap {

    position:
        relative;

    display:
        flex;

    align-items:
        center;

    flex:
        0 0 auto;

    height:
        var(--gw-header-height);
}


/* =========================================================
   User Button
   ========================================================= */

.gw-header__user {

    position:
        relative;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        7px;

    width:
        auto;

    min-width:
        44px;

    height:
        44px;

    margin:
        0;

    padding:
        0 8px 0 5px;

    color:
        var(--gw-text);

    background:
        transparent;

    border:
        1px solid transparent;

    border-radius:
        12px;

    font:
        inherit;

    line-height:
        1;

    text-decoration:
        none;

    cursor:
        pointer;

    touch-action:
        manipulation;

    -webkit-appearance:
        none;

    appearance:
        none;

    -webkit-tap-highlight-color:
        transparent;

    transition:
        background .18s ease,
        border-color .18s ease,
        color .18s ease;
}


.gw-header__user:hover,
.gw-header__user-wrap.is-open .gw-header__user {

    color:
        var(--gw-text);

    background:
        rgba(124, 92, 255, .055);

    border-color:
        rgba(124, 92, 255, .07);
}


.gw-header__avatar {

    display:
        block;

    width:
        34px;

    height:
        34px;

    flex:
        0 0 34px;

    overflow:
        hidden;

    background:
        #f1f2f5;

    border-radius:
        50%;
}


.gw-header__avatar-image {

    display:
        block;

    width:
        100% !important;

    height:
        100% !important;

    max-width:
        none !important;

    margin:
        0 !important;

    padding:
        0 !important;

    object-fit:
        cover;

    border:
        0 !important;

    border-radius:
        50% !important;
}


.gw-header__username {

    max-width:
        90px;

    overflow:
        hidden;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;

    color:
        var(--gw-text);

    font-size:
        11px;

    font-weight:
        650;
}


/* =========================================================
   User Arrow
   ========================================================= */

.gw-header__user-arrow {

    position:
        relative;

    display:
        block;

    width:
        7px;

    height:
        7px;

    margin:
        -3px 0 0 1px;

    flex:
        0 0 7px;

    border-right:
        1.5px solid currentColor;

    border-bottom:
        1.5px solid currentColor;

    transform:
        rotate(45deg);

    transition:
        transform .18s ease;
}


.gw-header__user-wrap.is-open
.gw-header__user-arrow {

    transform:
        rotate(225deg)
        translate(-1px, -1px);
}


/* =========================================================
   User Dropdown
   ========================================================= */

.gw-header__user-dropdown {

    position:
        absolute;

    top:
        calc(100% - 5px);

    right:
        0;

    width:
        190px;

    padding:
        8px;

    background:
        rgba(255, 255, 255, .98);

    border:
        1px solid var(--gw-border);

    border-radius:
        16px;

    box-shadow:
        0 18px 45px rgba(20, 24, 40, .14);

    backdrop-filter:
        blur(18px);

    -webkit-backdrop-filter:
        blur(18px);

    opacity:
        0;

    visibility:
        hidden;

    pointer-events:
        none;

    transform:
        translate3d(0, 8px, 0)
        scale(.98);

    transform-origin:
        top right;

    z-index:
        9300;

    transition:
        opacity .18s ease,
        visibility .18s ease,
        transform .18s ease;
}


.gw-header__user-wrap.is-open
.gw-header__user-dropdown {

    opacity:
        1;

    visibility:
        visible;

    pointer-events:
        auto;

    transform:
        translate3d(0, 0, 0)
        scale(1);
}


/* 用户菜单项目 */

.gw-header__user-item {

    display:
        flex;

    align-items:
        center;

    gap:
        9px;

    width:
        100%;

    min-height:
        41px;

    margin:
        0;

    padding:
        0 11px;

    color:
        var(--gw-text-secondary);

    background:
        transparent;

    border-radius:
        9px;

    font-size:
        12px;

    line-height:
        1;

    text-decoration:
        none;

    cursor:
        pointer;

    transition:
        background .18s ease,
        color .18s ease;
}


.gw-header__user-item:hover {

    color:
        var(--gw-primary);

    background:
        var(--gw-primary-soft);
}


.gw-header__user-item .gw-icon {

    width:
        17px;

    height:
        17px;

    flex:
        0 0 17px;
}


/* 注释链接 */

.gw-header__user-item[data-placeholder="true"] {

    opacity:
        .92;
}


/* 退出 */

.gw-header__user-item--logout {

    color:
        var(--gw-danger);
}


.gw-header__user-item--logout:hover {

    color:
        #fff;

    background:
        var(--gw-danger);
}


/* 分割线 */

.gw-header__user-divider {

    width:
        100%;

    height:
        1px;

    margin:
        6px 0;

    background:
        var(--gw-border-light);
}


/* =========================================================
   Submit / Login
   ========================================================= */

.gw-header__submit,
.gw-header__login {

    min-height:
        34px;

    margin:
        0 0 0 4px;

    padding:
        0 14px;

    border-radius:
        999px;

    font-size:
        11px;
}

.gw-header__login {
    margin-left: auto;
}


.gw-header__submit {

    box-shadow:
        0 5px 14px rgba(124, 92, 255, .16);
}


.gw-header__submit:hover {

    box-shadow:
        0 8px 20px rgba(124, 92, 255, .24);
}


.gw-header__submit .gw-icon,
.gw-header__login .gw-icon {

    width:
        15px;

    height:
        15px;
}


/* =========================================================
   Mobile Defaults
   ========================================================= */

.gw-header__mobile-left,
.gw-mobile-search-toggle,
.gw-mobile-search,
.gw-mobile-menu,
.gw-mobile-menu-mask {

    display:
        none;
}


/* =========================================================
   Tablet
   ========================================================= */

@media (max-width: 1180px) {

    .gw-header__container {

        width:
            min(
                calc(100% - 24px),
                var(--gw-container-width)
            );

    }


    .gw-header__logo {

        margin-right:
            11px;

    }


    .gw-header__logo-link {

        max-width:
            155px;

    }


    .gw-header__logo-image {

        max-width:
            150px;

        height:
            31px;

    }


    .gw-header__menu {

        gap:
            2px;

    }


    .gw-header__menu > li > a {

        padding-left:
            9px;

        padding-right:
            9px;

        font-size:
            12px;

    }


    .gw-header__search {

        margin-left:
            10px;

        margin-right:
            8px;

    }


    .gw-header__action {

        min-width:
            37px;

    }


    .gw-header__action-label {

        font-size:
            8px;

    }


    .gw-header__username {

        display:
            none;

    }


    .gw-header__user {

        padding-left:
            5px;

        padding-right:
            5px;

    }


    .gw-header__user-arrow {

        display:
            none;

    }


    .gw-header__submit,
    .gw-header__login {

        padding-left:
            10px;

        padding-right:
            10px;

    }

}


/* =========================================================
   WordPress Admin Bar
   ========================================================= */

body.admin-bar {

    padding-top:
        calc(
            var(--gw-header-height)
            +
            var(--gw-wp-adminbar-height, 32px)
        );

}


/*
 * Admin Bar 本身放在最高层。
 */

#wpadminbar {

    z-index:
        99999 !important;

}


/*
 * Header 自动跟随 Admin Bar。
 */

body.admin-bar .gw-header {

    top:
        var(--gw-wp-adminbar-height, 32px);

}


/* =========================================================
   Mobile
   ========================================================= */

@media (max-width: 900px) {

    /*
     * 移动端 Header 高度。
     */

    body {

        padding-top:
            var(--gw-header-height-mobile);

    }


    body.admin-bar {

        padding-top:
            calc(
                var(--gw-header-height-mobile)
                +
                var(--gw-wp-adminbar-height, 46px)
            );

    }


    .gw-header {

        height:
            var(--gw-header-height-mobile);

    }


    /*
     * Admin Bar 存在时 Header 自动下移。
     */

    body.admin-bar .gw-header {

        top:
            var(--gw-wp-adminbar-height, 46px);

    }


    .gw-header__container {

        width:
            100%;

        height:
            var(--gw-header-height-mobile);

        padding:
            0 6px;

        justify-content:
            center;

    }


    /* =====================================================
       Mobile Menu Button
       ===================================================== */

    .gw-header__mobile-left {

        position:
            absolute;

        top:
            0;

        left:
            4px;

        display:
            flex;

        align-items:
            center;

        height:
            var(--gw-header-height-mobile);

        z-index:
            9100;

    }


    .gw-header__icon-button {

        position:
            relative;

        display:
            inline-flex;

        align-items:
            center;

        justify-content:
            center;

        width:
            42px;

        height:
            42px;

        margin:
            0;

        padding:
            0;

        color:
            #555c66;

        background:
            transparent;

        border:
            0;

        border-radius:
            50%;

        cursor:
            pointer;

        pointer-events:
            auto;

        touch-action:
            manipulation;

        -webkit-tap-highlight-color:
            transparent;

        -webkit-appearance:
            none;

        appearance:
            none;

        transition:
            color .18s ease,
            background .18s ease,
            transform .18s ease;

        z-index:
            9101;

    }


    .gw-header__icon-button:hover {

        color:
            var(--gw-primary);

        background:
            rgba(124, 92, 255, .07);

    }


    .gw-header__icon-button:active {

        color:
            var(--gw-primary);

        background:
            rgba(124, 92, 255, .12);

        transform:
            scale(.94);

    }


    /* =====================================================
       Mobile Logo
       ===================================================== */

    .gw-header__logo {

        position:
            absolute;

        top:
            0;

        left:
            50%;

        display:
            flex;

        align-items:
            center;

        height:
            var(--gw-header-height-mobile);

        margin:
            0;

        transform:
            translateX(-50%);

        z-index:
            9050;

    }


    .gw-header__logo-link {

        height:
            var(--gw-header-height-mobile);

        max-width:
            150px;

    }


    .gw-header__logo-image {

        height:
            28px;

        max-width:
            145px;

    }


    .gw-header__logo-text {

        max-width:
            150px;

        font-size:
            17px;

        font-weight:
            800;

    }


    /* =====================================================
       Hide Desktop
       ===================================================== */

    .gw-header__nav,
    .gw-header__search {

        display:
            none !important;

    }


    /* =====================================================
       Mobile Search Button
       ===================================================== */

    .gw-mobile-search-toggle {

        position:
            absolute;

        top:
            8px;

        right:
            4px;

        display:
            inline-flex;

        z-index:
            9100;

    }


    /* =====================================================
       Mobile Actions
       ===================================================== */

    .gw-header__actions {

        position:
            absolute;

        top:
            0;

        right:
            46px;

        display:
            flex;

        align-items:
            center;

        height:
            var(--gw-header-height-mobile);

        z-index:
            9070;

    }


    /*
     * 移动端隐藏 PC 的积分/任务/网盘等顶部项目。
     */

    .gw-header__actions .gw-header__action,
    .gw-header__actions .gw-header__points,
    .gw-header__actions .gw-header__submit {

        display:
            none !important;

    }

    .gw-header__points-wrap,
    .gw-header__points-menu {
        display: none !important;
    }


    /* =====================================================
       Mobile User
       ===================================================== */

    .gw-header__user-wrap {

        display:
            flex;

        align-items:
            center;

        height:
            var(--gw-header-height-mobile);

    }


    .gw-header__user {

        display:
            inline-flex;

        align-items:
            center;

        justify-content:
            center;

        width:
            42px;

        min-width:
            42px;

        height:
            var(--gw-header-height-mobile);

        margin:
            0;

        padding:
            0;

        border:
            0;

        border-radius:
            50%;

    }


    .gw-header__avatar {

        width:
            31px;

        height:
            31px;

        flex-basis:
            31px;

    }


    .gw-header__username,
    .gw-header__user-arrow,
    .gw-header__user-dropdown {

        display:
            none !important;

    }


    /*
     * 移动端不要让点击头像被认为是桌面下拉。
     */

    .gw-header__user {

        pointer-events:
            auto;

    }


    /* =====================================================
       Mobile Login
       ===================================================== */

    .gw-header__actions:has(.gw-header__login) {

        display:
            flex;

    }


    .gw-header__actions:has(.gw-header__login)
    .gw-header__login {

        display:
            inline-flex;

        min-height:
            31px;

        margin:
            0;

        padding:
            0 10px;

        border-radius:
            999px;

        font-size:
            10px;

        pointer-events:
            auto;

    }


    /* =====================================================
       Mobile Search Layer
       ===================================================== */

    .gw-mobile-search {

        /*
         * 这个元素在 .gw-header 内部，
         * 所以这里不能再叠加 Admin Bar 高度。
         */

        position:
            absolute;

        top:
            var(--gw-header-height-mobile);

        left:
            0;

        display:
            block;

        width:
            100%;

        padding:
            9px 10px 11px;

        background:
            rgba(255, 255, 255, .97);

        border-bottom:
            1px solid var(--gw-border);

        box-shadow:
            0 12px 28px rgba(20, 24, 40, .08);

        backdrop-filter:
            blur(15px);

        -webkit-backdrop-filter:
            blur(15px);

        opacity:
            0;

        visibility:
            hidden;

        pointer-events:
            none;

        transform:
            translate3d(0, -8px, 0);

        z-index:
            8990;

        transition:
            opacity .20s ease,
            visibility .20s ease,
            transform .20s ease;

    }


    .gw-mobile-search.is-open {

        opacity:
            1;

        visibility:
            visible;

        pointer-events:
            auto;

        transform:
            translate3d(0, 0, 0);

    }


    .gw-search--mobile {

        height:
            41px;

        margin:
            0;

    }


    /*
     * 移动搜索输入框。
     */

    .gw-search--mobile .gw-search__input {

        font-size:
            13px;

    }


    /* =====================================================
       Mobile Menu Mask
       ===================================================== */

    .gw-mobile-menu-mask {

        position:
            fixed;

        inset:
            0;

        display:
            block;

        width:
            100%;

        height:
            100%;

        background:
            rgba(12, 15, 25, .42);

        opacity:
            0;

        visibility:
            hidden;

        pointer-events:
            none;

        z-index:
            9400;

        transition:
            opacity .25s ease,
            visibility .25s ease;

    }


    .gw-mobile-menu-mask.is-open {

        opacity:
            1;

        visibility:
            visible;

        pointer-events:
            auto;

    }


    /* =====================================================
       Mobile Menu
       ===================================================== */

    .gw-mobile-menu {

        position:
            fixed;

        top:
            var(--gw-wp-adminbar-height, 0px);

        left:
            0;

        display:
            block;

        width:
            min(
                340px,
                86vw
            );

        height:
            calc(
                100vh
                -
                var(--gw-wp-adminbar-height, 0px)
            );

        height:
            calc(
                100dvh
                -
                var(--gw-wp-adminbar-height, 0px)
            );

        margin:
            0;

        padding:
            0;

        overflow-x:
            hidden;

        overflow-y:
            auto;

        overscroll-behavior:
            contain;

        -webkit-overflow-scrolling:
            touch;

        background:
            rgba(255, 255, 255, .985);

        box-shadow:
            16px 0 45px rgba(0, 0, 0, .15);

        visibility:
            hidden;

        pointer-events:
            none;

        opacity:
            1;

        transform:
            translate3d(-105%, 0, 0);

        z-index:
            9600;

        transition:
            transform .34s cubic-bezier(.22, .61, .36, 1),
            visibility .34s ease;

    }


    .gw-mobile-menu.is-open {

        visibility:
            visible;

        pointer-events:
            auto;

        transform:
            translate3d(0, 0, 0);

    }


    /* =====================================================
       Mobile Menu Header
       ===================================================== */

    .gw-mobile-menu__header {

        position:
            sticky;

        top:
            0;

        display:
            flex;

        align-items:
            center;

        justify-content:
            space-between;

        width:
            100%;

        height:
            62px;

        padding:
            0 14px;

        background:
            rgba(255, 255, 255, .94);

        border-bottom:
            1px solid var(--gw-border-light);

        backdrop-filter:
            blur(14px);

        -webkit-backdrop-filter:
            blur(14px);

        z-index:
            5;

    }


    .gw-mobile-menu__brand {

        display:
            flex;

        align-items:
            center;

        min-width:
            0;

        max-width:
            225px;

        overflow:
            hidden;

        color:
            var(--gw-heading);

        font-size:
            16px;

        font-weight:
            800;

    }


    .gw-mobile-menu__logo {

        display:
            block;

        width:
            auto;

        height:
            28px;

        max-width:
            175px;

        object-fit:
            contain;

    }


    .gw-mobile-menu__close {

        position:
            relative;

        display:
            inline-flex;

        align-items:
            center;

        justify-content:
            center;

        flex:
            0 0 auto;

        width:
            40px;

        height:
            40px;

        margin:
            0;

        padding:
            0;

        color:
            #666d78;

        background:
            transparent;

        border:
            0;

        border-radius:
            50%;

        cursor:
            pointer;

        pointer-events:
            auto;

        touch-action:
            manipulation;

        -webkit-tap-highlight-color:
            transparent;

        -webkit-appearance:
            none;

        appearance:
            none;

        z-index:
            6;

    }


    .gw-mobile-menu__close:hover,
    .gw-mobile-menu__close:active {

        color:
            var(--gw-primary);

        background:
            var(--gw-primary-soft);

    }


    /* =====================================================
       Mobile User Card
       ===================================================== */

    .gw-mobile-menu__user {

        margin:
            14px 12px 10px;

        background:
            linear-gradient(
                135deg,
                #fbfaff,
                #f4f1ff
            );

        border:
            1px solid rgba(124, 92, 255, .10);

        border-radius:
            17px;

        box-shadow:
            0 8px 25px rgba(124, 92, 255, .06);

    }


    .gw-mobile-menu__user-link {

        display:
            flex;

        align-items:
            center;

        gap:
            12px;

        padding:
            15px;

        color:
            var(--gw-text);

        text-decoration:
            none;

        -webkit-tap-highlight-color:
            transparent;

    }


    .gw-mobile-menu__avatar {

        flex:
            0 0 52px;

        width:
            52px;

        height:
            52px;

        overflow:
            hidden;

        background:
            #eee;

        border-radius:
            50%;

        box-shadow:
            0 4px 12px rgba(0, 0, 0, .08);

    }


    .gw-mobile-menu__avatar img {

        display:
            block;

        width:
            100%;

        height:
            100%;

        object-fit:
            cover;

        border-radius:
            50%;

    }


    .gw-mobile-menu__user-info {

        min-width:
            0;

        flex:
            1 1 auto;

    }


    .gw-mobile-menu__username {

        overflow:
            hidden;

        text-overflow:
            ellipsis;

        white-space:
            nowrap;

        color:
            var(--gw-heading);

        font-size:
            15px;

        font-weight:
            750;

    }


    /*
     * Erphpdown money-left
     */

    .gw-mobile-menu__points,
    .gw-mobile-menu__points.money-left {

        display:
            block;

        margin-top:
            5px;

        color:
            var(--gw-text-muted);

        font-size:
            10px;

        line-height:
            17px;

        word-break:
            keep-all;

    }


    .gw-mobile-menu__points strong {

        color:
            var(--gw-primary);

        font-size:
            12px;

    }


    /* =====================================================
       Mobile Login
       ===================================================== */

    .gw-mobile-menu__login {

        padding:
            15px 14px 6px;

    }


    .gw-mobile-menu__login .gw-button {

        width:
            100%;

    }


    /* =====================================================
       Mobile Navigation
       ===================================================== */

    .gw-mobile-menu__nav {

        width:
            100%;

        padding:
            0;

    }


    .gw-mobile-menu__list {

        margin:
            0;

        padding:
            8px 10px 12px;

        list-style:
            none;

    }


    .gw-mobile-menu__list li {

        position:
            relative;

        width:
            100%;

        margin:
            0;

        padding:
            0;

        list-style:
            none;

    }


    .gw-mobile-menu__list > li > a {

        display:
            flex;

        align-items:
            center;

        width:
            100%;

        min-height:
            49px;

        padding:
            0 13px;

        color:
            var(--gw-text);

        background:
            transparent;

        border:
            1px solid transparent;

        border-radius:
            11px;

        font-size:
            14px;

        font-weight:
            600;

        text-decoration:
            none;

        -webkit-tap-highlight-color:
            transparent;

        transition:
            color .18s ease,
            background .18s ease,
            transform .18s ease;

    }


    .gw-mobile-menu__list > li > a:hover {

        color:
            var(--gw-primary);

        background:
            var(--gw-primary-soft);

        border-color:
            rgba(124, 92, 255, .08);

    }


    .gw-mobile-menu__list > li > a:active {

        transform:
            scale(.985);

    }


    /* =====================================================
       Mobile Submenu
       ===================================================== */

    .gw-mobile-menu__list .sub-menu {

        margin:
            2px 0 6px;

        padding:
            3px 0 3px 14px;

        background:
            #fafafd;

        border-left:
            2px solid rgba(124, 92, 255, .10);

        border-radius:
            0 9px 9px 0;

    }


    .gw-mobile-menu__list .sub-menu li a {

        display:
            flex;

        align-items:
            center;

        width:
            100%;

        min-height:
            41px;

        padding:
            0 11px;

        color:
            var(--gw-text-secondary);

        border-radius:
            8px;

        font-size:
            12px;

        text-decoration:
            none;

        -webkit-tap-highlight-color:
            transparent;

    }


    .gw-mobile-menu__list .sub-menu li a:hover {

        color:
            var(--gw-primary);

        background:
            rgba(124, 92, 255, .05);

    }


    /* =====================================================
       Mobile Tools
       ===================================================== */

    .gw-mobile-menu__tools {

        display:
            grid;

        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            8px;

        margin:
            6px 12px 28px;

        padding:
            14px 0 0;

        border-top:
            1px solid var(--gw-border-light);

    }


    .gw-mobile-menu__tool {

        position:
            relative;

        display:
            flex;

        align-items:
            center;

        gap:
            8px;

        min-height:
            45px;

        padding:
            0 11px;

        color:
            var(--gw-text-secondary);

        background:
            #fafafd;

        border:
            1px solid var(--gw-border-light);

        border-radius:
            11px;

        font-size:
            11px;

        text-decoration:
            none;

        -webkit-tap-highlight-color:
            transparent;

        transition:
            background .18s ease,
            color .18s ease,
            border-color .18s ease,
            transform .18s ease;

    }


    .gw-mobile-menu__tool:hover {

        color:
            var(--gw-primary);

        background:
            var(--gw-primary-soft);

        border-color:
            rgba(124, 92, 255, .13);

    }


    .gw-mobile-menu__tool:active {

        transform:
            scale(.98);

        color:
            var(--gw-primary);

        background:
            var(--gw-primary-soft);

        border-color:
            rgba(124, 92, 255, .13);

    }


    .gw-mobile-menu__tool .gw-icon {

        width:
            17px;

        height:
            17px;

        flex:
            0 0 17px;

    }


    .gw-mobile-menu__tool--submit {

        grid-column:
            1 / -1;

        justify-content:
            center;

        background:
            var(--gw-primary);

        border-color:
            var(--gw-primary);

        color:
            #fff;

        box-shadow:
            0 6px 16px rgba(124, 92, 255, .16);

    }


    .gw-mobile-menu__tool--submit:hover,
    .gw-mobile-menu__tool--submit:active {

        background:
            var(--gw-primary-hover);

        border-color:
            var(--gw-primary-hover);

        color:
            #fff;

    }


    /* =====================================================
       Mobile Logout
       ===================================================== */

    .gw-mobile-menu__tool--logout {

        color:
            var(--gw-danger);

        background:
            rgba(228, 87, 87, .035);

        border-color:
            rgba(228, 87, 87, .10);

    }


    .gw-mobile-menu__tool--logout:hover,
    .gw-mobile-menu__tool--logout:active {

        color:
            #fff;

        background:
            var(--gw-danger);

        border-color:
            var(--gw-danger);

    }


    /* =====================================================
       Notification
       ===================================================== */

    .gw-mobile-menu__notification-dot {

        position:
            absolute;

        top:
            9px;

        right:
            10px;

        width:
            7px;

        height:
            7px;

        background:
            var(--gw-danger);

        border:
            2px solid #fafafd;

        border-radius:
            50%;

    }


    .gw-mobile-menu__notification-dot[hidden] {

        display:
            none !important;

    }


    /* =====================================================
       Body Lock
       ===================================================== */

    body.gw-mobile-menu-open {

        overflow:
            hidden;

        overscroll-behavior:
            none;

    }

}


/* =========================================================
   25. Small Mobile
   ========================================================= */

@media (max-width: 480px) {

    .gw-header__container {

        padding:
            0 4px;

    }


    .gw-header__mobile-left {

        left:
            2px;

    }


    .gw-mobile-search-toggle {

        right:
            2px;

    }


    .gw-header__icon-button {

        width:
            39px;

        height:
            39px;

    }


    .gw-header__logo-image {

        max-width:
            125px;

        height:
            26px;

    }


    .gw-header__logo-text {

        max-width:
            125px;

        font-size:
            16px;

    }


    .gw-mobile-menu {

        width:
            min(
                320px,
                88vw
            );

    }


    .gw-search-hot__item {

        min-height:
            31px;

    }


    .gw-search-hot__name {

        font-size:
            11px;

    }

}


/* =========================================================
   26. Very Small Mobile
   ========================================================= */

@media (max-width: 360px) {

    .gw-header__logo-image {

        max-width:
            108px;

    }


    .gw-header__logo-text {

        font-size:
            15px;

    }


    .gw-header__icon-button {

        width:
            37px;

        height:
            37px;

    }


    .gw-mobile-menu__tools {

        grid-template-columns:
            minmax(0, 1fr);

    }


    .gw-mobile-menu__tool--submit {

        grid-column:
            auto;

    }


    .gw-mobile-menu__tool--logout {

        grid-column:
            auto;

    }


    .gw-search-hot {

        grid-template-columns:
            minmax(0, 1fr);

    }

}


/* =========================================================
   GalWiki Article Detail
   Notification-center visual alignment & mobile refinement
   ========================================================= */

.gw-wiki-single {
    --gw-article-primary: #6c63ff;
    --gw-article-primary-dark: #5548f5;
    --gw-article-surface: #ffffff;
    --gw-article-border: #eceef3;
    --gw-article-muted: #747b8b;
    --gw-article-shadow: 0 14px 40px rgba(45, 49, 73, .07);
    background:
        radial-gradient(circle at 100% 0, rgba(108, 99, 255, .09), transparent 31rem),
        #f7f8fc;
}

.gw-wiki-single .gw-container {
    position: relative;
}

.gw-wiki-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    padding: 25px 4px 0;
    color: var(--gw-article-muted);
    font-size: 12px;
    line-height: 1.5;
}

.gw-wiki-breadcrumb a {
    color: var(--gw-article-primary);
    text-decoration: none;
    transition: color .2s ease;
}

.gw-wiki-breadcrumb a:hover,
.gw-wiki-breadcrumb a:focus-visible {
    color: var(--gw-article-primary-dark);
}

.gw-wiki-breadcrumb span:last-child {
    min-width: 0;
    overflow: hidden;
    color: #a1a7b4;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gw-wiki-single .gw-wiki-hero-card,
.gw-wiki-single .gw-wiki-content,
.gw-wiki-single .gw-author-card {
    border-color: var(--gw-article-border);
    box-shadow: var(--gw-article-shadow);
}

.gw-wiki-single .gw-wiki-hero-card {
    position: relative;
    overflow: hidden;
    margin-top: 16px;
    border-radius: 22px;
}

.gw-wiki-single .gw-wiki-hero-card::after {
    position: absolute;
    top: -90px;
    right: -65px;
    width: 210px;
    height: 210px;
    border-radius: 50%;
    background: rgba(108, 99, 255, .055);
    content: '';
    pointer-events: none;
}

.gw-wiki-single .gw-wiki-hero__cover,
.gw-wiki-single .gw-wiki-hero__info {
    position: relative;
    z-index: 1;
}

.gw-wiki-single .gw-wiki-hero__cover {
    box-shadow: 0 10px 24px rgba(48, 43, 116, .14);
}

.gw-wiki-single .gw-wiki-hero__image {
    transition: transform .45s ease;
}

.gw-wiki-single .gw-wiki-hero-card:hover .gw-wiki-hero__image {
    transform: scale(1.035);
}

.gw-wiki-single .gw-wiki-content {
    border-radius: 20px;
}

.gw-wiki-single .gw-wiki-content__topline {
    padding-top: 20px;
}

.gw-wiki-single .gw-wiki-content__body h2 {
    scroll-margin-top: 90px;
}

.gw-wiki-single .gw-wiki-content__body img {
    box-shadow: 0 10px 25px rgba(32, 36, 45, .1);
}

/* Keep article titles readable without allowing long text to disturb the hero layout. */
.gw-wiki-single .gw-wiki-hero__title {
    font-size: 36px;
    letter-spacing: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.gw-wiki-single .gw-wiki-hero__title-rating {
    display: inline-flex;
    margin-top: 6px;
    margin-left: 0;
}

.gw-wiki-single .gw-wiki-action:focus-visible,
.gw-wiki-single .gw-wiki-tag:focus-visible,
.gw-wiki-single .gw-recommend-card a:focus-visible {
    outline: 3px solid rgba(108, 99, 255, .3);
    outline-offset: 3px;
}

@media (max-width: 900px) {
    .gw-wiki-single .gw-wiki-author-sidebar {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 720px) {
    .gw-wiki-single {
        padding-bottom: 32px;
    }

    .gw-wiki-breadcrumb {
        gap: 6px;
        padding: 18px 2px 0;
        font-size: 11px;
    }

    .gw-wiki-single .gw-wiki-hero-card {
        grid-template-columns: 1fr;
        gap: 18px;
        margin-top: 12px;
        margin-bottom: 18px;
        padding: 14px;
        border-radius: 18px;
    }

    .gw-wiki-single .gw-wiki-hero__cover {
        width: 100%;
        max-height: 230px;
        aspect-ratio: 16 / 9;
        border-radius: 14px;
    }

    .gw-wiki-single .gw-wiki-hero__title {
        font-size: 28px;
        letter-spacing: 0;
    }

    .gw-wiki-single .gw-wiki-hero__contributor {
        margin-top: 14px;
    }

    .gw-wiki-single .gw-wiki-hero__actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        margin-top: 16px;
    }

    .gw-wiki-single .gw-wiki-action {
        width: 100%;
        min-height: 42px;
        padding: 0 10px;
        font-size: 11px;
    }

    .gw-wiki-single .gw-wiki-content {
        border-radius: 17px;
    }

    .gw-wiki-single .gw-wiki-content__topline {
        padding: 16px 19px 0;
    }

    .gw-wiki-single .gw-wiki-content__body {
        padding: 22px 19px 28px;
        font-size: 15px;
        line-height: 1.85;
    }

    .gw-wiki-single .gw-wiki-content__body h2 {
        margin-top: 34px;
        font-size: 22px;
    }

    .gw-wiki-single .gw-wiki-content__body h3 {
        font-size: 18px;
    }

    .gw-wiki-single .gw-wiki-content__body pre {
        margin-right: -3px;
        margin-left: -3px;
        padding: 14px;
        border-radius: 12px;
        font-size: 12px;
    }

    .gw-wiki-single .gw-wiki-content__body table {
        display: block;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .gw-wiki-single .gw-wiki-tags,
    .gw-wiki-single .gw-wiki-pagination {
        margin-right: 19px;
        margin-left: 19px;
    }
}

@media (max-width: 440px) {
    .gw-wiki-single .gw-wiki-hero__actions {
        grid-template-columns: 1fr;
    }

    .gw-wiki-single .gw-wiki-hero__meta {
        gap: 5px;
        font-size: 10px;
    }

    .gw-wiki-single .gw-wiki-content__body {
        padding-right: 16px;
        padding-left: 16px;
    }

    .gw-wiki-single .gw-wiki-tags,
    .gw-wiki-single .gw-wiki-pagination {
        margin-right: 16px;
        margin-left: 16px;
    }
}


/* =========================================================
   27. Desktop Isolation
   ========================================================= */

@media (min-width: 901px) {

    .gw-header__mobile-left,
    .gw-mobile-search-toggle,
    .gw-mobile-search,
    .gw-mobile-menu,
    .gw-mobile-menu-mask {

        display:
            none !important;

        visibility:
            hidden !important;

        opacity:
            0 !important;

        pointer-events:
            none !important;

    }

}


/* =========================================================
   28. Reduce Motion
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .gw-header,
    .gw-mobile-menu,
    .gw-mobile-menu-mask,
    .gw-mobile-search,
    .gw-search-panel,
    .gw-header__menu > li > a,
    .gw-header__action,
    .gw-header__user,
    .gw-header__user-dropdown,
    .gw-mobile-menu__tool {

        transition:
            none !important;

    }

}


/* =========================================================
   29. GalWiki Home
   Modern Light Knowledge Portal
   ========================================================= */


/* =========================================================
   Root
   ========================================================= */

.gw-front-page,
.gw-front-page * {
    box-sizing: border-box;
}


.gw-front-page {
    --home-primary: #7567ff;
    --home-primary-dark: #6256dc;

    --home-blue: #4f8cf7;
    --home-green: #35ad87;
    --home-orange: #efaa29;
    --home-pink: #df6291;
    --home-red: #e35b61;
    --home-cyan: #16a9bd;

    --home-heading: #202634;
    --home-text: #4c5667;
    --home-muted: #6f7989;

    --home-border: #e6eaf0;
    --home-border-light: #eef1f5;

    overflow-x: clip;
}


.gw-front-page a {
    text-decoration: none;
}


/* =========================================================
   Hero
   ========================================================= */

.gw-home-hero {
    position: relative;

    min-height: 630px;

    overflow: hidden;

    background: #eaf6ff;

    isolation: isolate;
}


.gw-home-hero__background {
    position: absolute;

    inset: 0;

    z-index: 0;

    background-image:
        var(--gw-home-hero-image);

    background-position:
        center center;

    background-size:
        cover;

    background-repeat:
        no-repeat;

    transform:
        scale(1.015);
}


/*
 * 白色渐变层：
 *
 * 左侧负责文字可读性
 * 右边保留人物和花海
 */

.gw-home-hero__wash {
    position: absolute;

    inset: 0;

    z-index: 1;

    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,.97) 0%,
            rgba(255,255,255,.93) 27%,
            rgba(255,255,255,.68) 48%,
            rgba(255,255,255,.12) 73%,
            rgba(255,255,255,.02) 100%
        );
}


/* 下方渐变 */

.gw-home-hero__wash::after {
    content: "";

    position: absolute;

    left: 0;
    right: 0;

    bottom: 0;

    height: 150px;

    background:
        linear-gradient(
            to bottom,
            transparent,
            rgba(247,250,255,.85)
        );
}


/* 浅蓝柔光 */

.gw-home-hero__light {
    position: absolute;

    width: 500px;
    height: 500px;

    left: -180px;
    top: -180px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(111,160,255,.22),
            transparent 70%
        );

    filter: blur(5px);

    z-index: 2;

    pointer-events: none;
}


/* 很淡的点状纹理 */

.gw-home-hero__particles {
    position: absolute;

    inset: 0;

    z-index: 2;

    pointer-events: none;

    opacity: .55;

    background-image:
        radial-gradient(
            circle,
            rgba(91,117,190,.15) 0 1px,
            transparent 1.5px
        );

    background-size:
        72px 72px;

    mask-image:
        linear-gradient(
            to bottom,
            #000,
            transparent 92%
        );
}


/* =========================================================
   Hero Container
   ========================================================= */

.gw-home-hero__container {
    position: relative;

    z-index: 5;

    padding-top: 26px;
    padding-bottom: 22px;
}


/* =========================================================
   Hero Top
   ========================================================= */

.gw-home-hero__top {
    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;
}


.gw-home-hero__brand-state {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    color: #697386;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 1.7px;
}


.gw-home-hero__state-dot {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: #55c89c;

    box-shadow:
        0 0 0 4px
        rgba(85,200,156,.10);
}


.gw-home-hero__edition {
    color: #8c95a4;

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.4px;
}


/* =========================================================
   Hero Content
   ========================================================= */

.gw-home-hero__content {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        330px;

    align-items: center;

    gap: 40px;

    min-height: 515px;

    padding-top: 35px;
}


/* =========================================================
   Hero Copy
   ========================================================= */

.gw-home-hero__copy {
    max-width: 680px;
}


.gw-home-hero__eyebrow {
    display: inline-flex;

    align-items: center;

    min-height: 29px;

    padding: 0 12px;

    border:
        1px solid
        rgba(117,103,255,.13);

    border-radius: 999px;

    background:
        rgba(255,255,255,.68);

    color:
        #7669df;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 1.7px;

    box-shadow:
        0 6px 20px
        rgba(62,87,125,.05);

    backdrop-filter:
        blur(10px);
}


.gw-home-hero__title {
    margin:
        19px 0 13px;

    color:
        #1e2431;

    font-size:
        clamp(62px, 8vw, 100px);

    font-weight:
        900;

    line-height:
        .88;

    letter-spacing:
        -5px;
}


.gw-home-hero__title strong {
    font-weight:
        900;

    background:
        linear-gradient(
            135deg,
            #7367fa 0%,
            #4f8cf7 100%
        );

    -webkit-background-clip:
        text;

    background-clip:
        text;

    color:
        transparent;
}


.gw-home-hero__description {
    max-width: 610px;

    margin: 0 0 24px;

    color:
        #4b5565;

    font-size:
        14px;

    line-height:
        1.9;

    font-weight:
        500;
}


/* =========================================================
   Search
   ========================================================= */

.gw-home-search {
    display:
        flex;

    align-items:
        center;

    width:
        min(100%, 640px);

    height:
        58px;

    padding:
        6px;

    border:
        1px solid
        rgba(211,220,234,.95);

    border-radius:
        15px;

    background:
        rgba(255,255,255,.86);

    box-shadow:
        0 14px 35px
        rgba(38,53,86,.08);

    backdrop-filter:
        blur(12px);
}


.gw-home-search__icon {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        41px;

    height:
        41px;

    flex:
        0 0 auto;

    color:
        #8e97a6;
}


.gw-home-search__icon svg {
    width:
        19px;

    height:
        19px;
}


.gw-home-search input {
    flex:
        1;

    min-width:
        0;

    height:
        100%;

    border:
        0;

    outline:
        0;

    background:
        transparent;

    color:
        #293140;

    font-size:
        13px;

    font-weight:
        500;
}


.gw-home-search input::placeholder {
    color:
        #9ba4b2;
}


.gw-home-search button {
    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-width:
        72px;

    height:
        43px;

    border:
        0;

    border-radius:
        11px;

    background:
        linear-gradient(
            135deg,
            #8378ff,
            #675be4
        );

    color:
        #fff;

    font-size:
        10px;

    font-weight:
        700;

    cursor:
        pointer;

    box-shadow:
        0 8px 18px
        rgba(117,103,255,.22);

    transition:
        transform .18s ease,
        box-shadow .18s ease;
}


.gw-home-search button:hover {
    transform:
        translateY(-1px);

    box-shadow:
        0 12px 25px
        rgba(117,103,255,.30);
}


/* =========================================================
   Hot Keywords
   ========================================================= */

.gw-home-hero__hot {
    display:
        flex;

    align-items:
        center;

    flex-wrap:
        wrap;

    gap:
        7px;

    margin-top:
        10px;

    color:
        #8c95a3;

    font-size:
        9px;
}


.gw-home-hero__hot a {
    color:
        #6d7481;

    transition:
        color .18s ease;
}


.gw-home-hero__hot a:hover {
    color:
        #7567ff;
}


/* =========================================================
   Hero Info
   ========================================================= */

.gw-home-hero__info {
    padding:
        1px;
}


.gw-home-hero__info-inner {
    padding:
        25px 24px;

    border:
        1px solid
        rgba(255,255,255,.76);

    border-radius:
        20px;

    background:
        rgba(255,255,255,.64);

    box-shadow:
        0 22px 50px
        rgba(48,74,120,.10);

    backdrop-filter:
        blur(18px);
}


.gw-home-hero__info-label {
    display:
        block;

    margin-bottom:
        10px;

    color:
        #7b83ef;

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        1.5px;
}


.gw-home-hero__info-inner > strong {
    display:
        block;

    color:
        #232a38;

    font-size:
        21px;

    line-height:
        1.45;

    font-weight:
        800;
}


.gw-home-hero__info-inner > p {
    margin:
        12px 0 17px;

    color:
        #5c6675;

    font-size:
        11px;

    line-height:
        1.8;
}


/* Stats */

.gw-home-hero__stats {
    display:
        grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:
        7px;
}


.gw-home-hero__stats > div {
    padding:
        10px 7px;

    border:
        1px solid
        #eef1f5;

    border-radius:
        10px;

    background:
        rgba(255,255,255,.62);

    text-align:
        center;
}


.gw-home-hero__stats strong {
    display:
        block;

    color:
        #5962d6;

    font-size:
        17px;

    line-height:
        1.15;

    font-weight:
        850;
}


.gw-home-hero__stats span {
    display:
        block;

    margin-top:
        4px;

    color:
        #7e8795;

    font-size:
        8px;
}


.gw-home-hero__info-link {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    margin-top:
        13px;

    min-height:
        36px;

    padding:
        0 12px;

    border:
        1px solid
        rgba(117,103,255,.15);

    border-radius:
        9px;

    background:
        #f5f3ff;

    color:
        #6e63d9;

    font-size:
        9px;

    font-weight:
        700;

    transition:
        background .18s ease,
        transform .18s ease;
}


.gw-home-hero__info-link:hover {
    color:
        #6659da;

    background:
        #eeebff;

    transform:
        translateX(2px);
}


/* =========================================================
   Hero Bottom
   ========================================================= */

.gw-home-hero__bottom {
    display:
        flex;

    align-items:
        center;

    gap:
        9px;

    color:
        #8791a0;

    font-size:
        7px;

    font-weight:
        800;

    letter-spacing:
        1.5px;
}


.gw-home-hero__bottom span {
    width:
        25px;

    height:
        1px;

    background:
        rgba(124,135,152,.22);
}


.gw-home-hero__edge {
    position:
        absolute;

    left:
        0;

    right:
        0;

    bottom:
        -1px;

    height:
        90px;

    z-index:
        4;

    pointer-events:
        none;

    background:
        linear-gradient(
            to bottom,
            transparent,
            #f7f9fc
        );
}


/* =========================================================
   Quick Navigation
   ========================================================= */

.gw-home-quick {
    position:
        relative;

    z-index:
        10;

    margin-top:
        -26px;
}


.gw-home-quick__inner {
    display:
        grid;

    grid-template-columns:
        repeat(6,minmax(0,1fr));

    gap:
        9px;

    padding:
        9px;

    border:
        1px solid
        rgba(224,229,237,.95);

    border-radius:
        15px;

    background:
        rgba(255,255,255,.96);

    box-shadow:
        0 15px 42px
        rgba(40,52,82,.08);

    backdrop-filter:
        blur(18px);
}


.gw-home-quick__item {
    display:
        flex;

    align-items:
        center;

    gap:
        8px;

    min-height:
        54px;

    padding:
        0 10px;

    border:
        1px solid
        #edf0f4;

    border-radius:
        11px;

    color:
        #596273;

    background:
        #fff;

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}


.gw-home-quick__item:hover {
    transform:
        translateY(-2px);

    box-shadow:
        0 9px 22px
        rgba(45,54,80,.07);

    color:
        #2a303c;
}


.gw-home-quick__icon {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        31px;

    height:
        31px;

    flex:
        0 0 auto;

    border-radius:
        9px;

    font-size:
        10px;

    font-weight:
        800;
}


.gw-home-quick__item--purple
.gw-home-quick__icon {
    background:
        #f0edff;

    color:
        #7567ff;
}


.gw-home-quick__item--blue
.gw-home-quick__icon {
    background:
        #edf4ff;

    color:
        #4f8cf7;
}


.gw-home-quick__item--green
.gw-home-quick__icon {
    background:
        #eaf8f3;

    color:
        #35ad87;
}


.gw-home-quick__item--orange
.gw-home-quick__icon {
    background:
        #fff5e5;

    color:
        #efaa29;
}


.gw-home-quick__item--red
.gw-home-quick__icon {
    background:
        #fff0f0;

    color:
        #e35b61;
}


.gw-home-quick__item--pink
.gw-home-quick__icon {
    background:
        #fff0f6;

    color:
        #df6291;
}


.gw-home-quick__item > span:not(
    .gw-home-quick__icon
) {
    display:
        flex;

    flex-direction:
        column;

    min-width:
        0;
}


.gw-home-quick__item strong {
    color:
        #303746;

    font-size:
        10px;
}


.gw-home-quick__item small {
    margin-top:
        2px;

    color:
        #a1a9b5;

    font-size:
        7px;
}


.gw-home-quick__item b {
    margin-left:
        auto;

    color:
        #c5cad2;

    font-size:
        12px;
}


/* =========================================================
   Home Section
   ========================================================= */

.gw-home-section {
    margin-top:
        58px;
}


.gw-home-section__header {
    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        space-between;

    gap:
        20px;

    margin-bottom:
        18px;
}


.gw-home-section__label {
    display:
        block;

    margin-bottom:
        6px;

    color:
        #7567ff;

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        1.8px;
}


.gw-home-section__header h2 {
    margin:
        0;

    color:
        #202634;

    font-size:
        26px;

    line-height:
        1.25;

    font-weight:
        800;
}


.gw-home-section__header p {
    margin:
        5px 0 0;

    color:
        #657083;

    font-size:
        10px;

    line-height:
        1.65;
}


.gw-home-section__more {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        5px;

    color:
        #647083;

    font-size:
        10px;

    font-weight:
        600;

    white-space:
        nowrap;
}


.gw-home-section__more:hover {
    color:
        #7567ff;
}


/* =========================================================
   Knowledge Map
   ========================================================= */

.gw-home-knowledge {
    margin-top:
        50px;
}


.gw-home-knowledge-map {
    display:
        grid;

    grid-template-columns:
        repeat(4,minmax(0,1fr));

    gap:
        1px;

    overflow:
        hidden;

    border:
        1px solid
        #e8ebf0;

    border-radius:
        16px;

    background:
        #e8ebf0;

    box-shadow:
        0 7px 26px
        rgba(29,37,61,.035);
}


.gw-home-knowledge-card {
    --knowledge-color:
        #7567ff;

    min-height:
        188px;

    padding:
        17px;

    background:
        #fff;

    transition:
        background .18s ease;
}


.gw-home-knowledge-card:hover {
    background:
        #fcfcff;
}


.gw-home-knowledge-card--blue {
    --knowledge-color:
        #4f8cf7;
}


.gw-home-knowledge-card--orange {
    --knowledge-color:
        #efaa29;
}


.gw-home-knowledge-card--purple {
    --knowledge-color:
        #8b6ce0;
}


.gw-home-knowledge-card--cyan {
    --knowledge-color:
        #16a9bd;
}


.gw-home-knowledge-card--pink {
    --knowledge-color:
        #df6291;
}


.gw-home-knowledge-card--red {
    --knowledge-color:
        #e35b61;
}


.gw-home-knowledge-card--green {
    --knowledge-color:
        #35ad87;
}


.gw-home-knowledge-card--indigo {
    --knowledge-color:
        #6171d7;
}


.gw-home-knowledge-card::before {
    content:
        "";

    display:
        block;

    width:
        25px;

    height:
        3px;

    margin-bottom:
        12px;

    border-radius:
        99px;

    background:
        var(--knowledge-color);
}


.gw-home-knowledge-card__number {
    color:
        #bec5ce;

    font-size:
        8px;

    font-family:
        "SFMono-Regular",
        Consolas,
        monospace;

    font-weight:
        700;
}


.gw-home-knowledge-card__english {
    display:
        block;

    margin-top:
        3px;

    color:
        var(--knowledge-color);

    font-size:
        7px;

    font-weight:
        800;

    letter-spacing:
        1.2px;
}


.gw-home-knowledge-card h3 {
    margin:
        5px 0 0;

    color:
        #252a37;

    font-size:
        16px;

    line-height:
        1.35;

    font-weight:
        800;
}

.gw-home-knowledge-card h3 a {
    color: inherit;
    text-decoration: none;
}

.gw-home-knowledge-card h3 a:hover {
    color: var(--knowledge-color);
}

.gw-home-knowledge-card h3 a:focus-visible {
    outline: 2px solid var(--knowledge-color);
    outline-offset: 3px;
    border-radius: 3px;
}


.gw-home-knowledge-card p {
    margin:
        6px 0 11px;

    color:
        #637083;

    font-size:
        9px;

    line-height:
        1.65;
}


.gw-home-knowledge-card__links {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        5px;
}


.gw-home-knowledge-card__links a {
    display:
        inline-flex;

    align-items:
        center;

    min-height:
        23px;

    padding:
        0 7px;

    border:
        1px solid
        #e7ebf0;

    border-radius:
        6px;

    color:
        #5c6675;

    background:
        #fafbfc;

    font-size:
        8px;
}


.gw-home-knowledge-card__links a:hover {
    color:
        #fff;

    border-color:
        var(--knowledge-color);

    background:
        var(--knowledge-color);
}


/* =========================================================
   Games
   ========================================================= */

.gw-home-games {
    margin-top:
        62px;
}


.gw-home-games__grid {
    display:
        grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:
        12px;
}


.gw-home-game-card {
    display:
        grid;

    grid-template-columns:
        190px
        minmax(0,1fr);

    min-width:
        0;

    overflow:
        hidden;

    border:
        1px solid
        #e7ebf0;

    border-radius:
        14px;

    background:
        #fff;

    box-shadow:
        0 6px 22px
        rgba(26,34,56,.035);

    transition:
        transform .22s ease,
        box-shadow .22s ease;
}


.gw-home-game-card:hover {
    transform:
        translateY(-3px);

    box-shadow:
        0 13px 30px
        rgba(26,34,56,.09);
}


.gw-home-game-card__image {
    position:
        relative;

    display:
        block;

    min-width:
        0;

    overflow:
        hidden;

    background:
        #f0f3f7;

    min-height:
        140px;
}


.gw-home-game-card__image img {
    display:
        block;

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    transition:
        transform .4s ease;
}


.gw-home-game-card:hover
.gw-home-game-card__image img {
    transform:
        scale(1.045);
}


.gw-home-game-card__shine {
    position:
        absolute;

    inset:
        0;

    background:
        linear-gradient(
            115deg,
            transparent 30%,
            rgba(255,255,255,.32) 50%,
            transparent 70%
        );

    transform:
        translateX(-130%);

    transition:
        transform .7s ease;
}


.gw-home-game-card:hover
.gw-home-game-card__shine {
    transform:
        translateX(130%);
}


.gw-home-game-card__empty {
    display:
        flex;

    flex-direction:
        column;

    align-items:
        center;

    justify-content:
        center;

    width:
        100%;

    height:
        100%;

    min-height:
        140px;

    background:
        linear-gradient(
            135deg,
            #eef1ff,
            #f8f9ff
        );

    color:
        #7770df;
}


.gw-home-game-card__empty strong {
    font-size:
        29px;

    line-height:
        1;
}


.gw-home-game-card__empty span {
    margin-top:
        5px;

    font-size:
        7px;

    letter-spacing:
        1.7px;
}


.gw-home-game-card__open {
    position:
        absolute;

    left:
        12px;

    bottom:
        10px;

    padding:
        5px 8px;

    border:
        1px solid
        rgba(255,255,255,.55);

    border-radius:
        999px;

    background:
        rgba(20,26,42,.28);

    color:
        #fff;

    font-size:
        8px;

    backdrop-filter:
        blur(7px);

    opacity:
        0;

    transform:
        translateY(4px);

    transition:
        opacity .22s ease,
        transform .22s ease;
}


.gw-home-game-card:hover
.gw-home-game-card__open {
    opacity:
        1;

    transform:
        translateY(0);
}


.gw-home-game-card__body {
    min-width:
        0;

    display:
        flex;

    flex-direction:
        column;

    padding:
        15px;
}


.gw-home-game-card__meta {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        10px;

    color:
        #9ba4b1;

    font-size:
        7px;
}


.gw-home-game-card__meta span {
    color:
        #7567ff;

    font-weight:
        800;

    letter-spacing:
        .7px;
}


.gw-home-game-card__body h3 {
    margin:
        8px 0 6px;

    font-size:
        14px;

    line-height:
        1.4;
}


.gw-home-game-card__body h3 a {
    color:
        #252b38;
}


.gw-home-game-card__body h3 a:hover {
    color:
        #7567ff;
}


.gw-home-game-card__body p {
    display:
        -webkit-box;

    margin:
        0;

    color:
        #627083;

    font-size:
        9px;

    line-height:
        1.7;

    overflow:
        hidden;

    -webkit-box-orient:
        vertical;

    -webkit-line-clamp:
        3;
}


/* =========================================================
   Wiki / Article
   ========================================================= */

.gw-home-content-grid {
    display:
        grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap:
        18px;
}


.gw-home-list-card {
    min-width:
        0;

    overflow:
        hidden;

    border:
        1px solid
        #e7ebf0;

    border-radius:
        16px;

    background:
        #fff;

    box-shadow:
        0 7px 25px
        rgba(28,36,56,.03);
}


.gw-home-list-card__header {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        14px;

    min-height:
        72px;

    padding:
        13px 17px;

    border-bottom:
        1px solid
        #eef1f5;

    background:
        #fcfdff;
}


.gw-home-list-card__header > div > span {
    display:
        block;

    color:
        #7567ff;

    font-size:
        7px;

    font-weight:
        800;

    letter-spacing:
        1.3px;
}


.gw-home-list-card__header h2 {
    margin:
        4px 0 0;

    color:
        #252a37;

    font-size:
        18px;

    font-weight:
        800;
}


.gw-home-list-card__header > a {
    color:
        #667286;

    font-size:
        9px;

    font-weight:
        600;
}


.gw-home-list-card__header > a:hover {
    color:
        #7567ff;
}


.gw-home-list-card__body {
    padding:
        0 16px;
}


/*
 * Wiki / Article 统一卡片结构
 */

.gw-home-content-item {
    display:
        grid;

    grid-template-columns:
        86px
        minmax(0,1fr)
        28px;

    align-items:
        center;

    gap:
        11px;

    padding:
        13px 0;

    border-bottom:
        1px solid
        #eef1f5;
}


.gw-home-content-item:last-child {
    border-bottom:
        0;
}


.gw-home-content-item__thumb {
    display:
        block;

    aspect-ratio:
        16 / 10;

    overflow:
        hidden;

    border-radius:
        9px;

    background:
        linear-gradient(
            135deg,
            #eef1ff,
            #f7f8fb
        );
}


.gw-home-content-item__thumb img {
    display:
        block;

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    transition:
        transform .35s ease;
}


.gw-home-content-item:hover
.gw-home-content-item__thumb img {
    transform:
        scale(1.045);
}


.gw-home-content-item__thumb > span {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        100%;

    height:
        100%;

    color:
        #7771df;

    font-size:
        18px;

    font-weight:
        900;
}


.gw-home-content-item__main {
    min-width:
        0;
}


.gw-home-content-item__type {
    display:
        inline-block;

    color:
        #7567ff;

    font-size:
        7px;

    font-weight:
        800;

    letter-spacing:
        1px;
}


.gw-home-content-item__main h3 {
    margin:
        4px 0 4px;

    overflow:
        hidden;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;

    font-size:
        12px;
}


.gw-home-content-item__main h3 a {
    color:
        #28303d;
}


.gw-home-content-item__main h3 a:hover {
    color:
        #7567ff;
}


.gw-home-content-item__main p {
    display:
        -webkit-box;

    margin:
        0;

    overflow:
        hidden;

    color:
        #637083;

    font-size:
        8px;

    line-height:
        1.55;

    -webkit-box-orient:
        vertical;

    -webkit-line-clamp:
        1;
}


.gw-home-content-item__meta {
    display:
        flex;

    align-items:
        center;

    gap:
        6px;

    margin-top:
        5px;

    color:
        #8b95a4;

    font-size:
        7px;
}


.gw-home-content-item__meta i {
    width:
        3px;

    height:
        3px;

    border-radius:
        50%;

    background:
        #cdd2da;
}


.gw-home-content-item__arrow {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        28px;

    height:
        28px;

    border-radius:
        8px;

    background:
        #f7f8fa;

    color:
        #a2aab6;

    font-size:
        12px;
}


.gw-home-content-item:hover
.gw-home-content-item__arrow {
    color:
        #7567ff;

    background:
        #f0edff;
}


/* =========================================================
   Tutorial
   ========================================================= */

.gw-home-tutorial-grid {
    display:
        grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:
        11px;
}


.gw-home-tutorial-card {
    display:
        grid;

    grid-template-columns:
        40px
        minmax(0,1fr);

    gap:
        10px;

    min-height:
        125px;

    padding:
        13px;

    border:
        1px solid
        #e8ebf0;

    border-radius:
        13px;

    background:
        #fff;

    transition:
        transform .18s ease,
        box-shadow .18s ease;
}


.gw-home-tutorial-card:hover {
    transform:
        translateY(-3px);

    box-shadow:
        0 10px 25px
        rgba(32,39,60,.07);
}


.gw-home-tutorial-card__number {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        36px;

    height:
        36px;

    border-radius:
        10px;

    background:
        #fff6e7;

    color:
        #e8a126;

    font-family:
        "SFMono-Regular",
        Consolas,
        monospace;

    font-size:
        9px;

    font-weight:
        800;
}


.gw-home-tutorial-card__body {
    min-width:
        0;
}


.gw-home-tutorial-card__body > span {
    color:
        #e8a126;

    font-size:
        7px;

    font-weight:
        800;

    letter-spacing:
        1px;
}


.gw-home-tutorial-card h3 {
    margin:
        4px 0;

    font-size:
        12px;

    line-height:
        1.4;
}


.gw-home-tutorial-card h3 a {
    color:
        #29303d;
}


.gw-home-tutorial-card h3 a:hover {
    color:
        #df9a19;
}


.gw-home-tutorial-card p {
    display:
        -webkit-box;

    margin:
        0;

    color:
        #637083;

    font-size:
        8px;

    line-height:
        1.55;

    overflow:
        hidden;

    -webkit-box-orient:
        vertical;

    -webkit-line-clamp:
        2;
}


.gw-home-tutorial-card__meta {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    margin-top:
        8px;

    color:
        #a2aab5;

    font-size:
        7px;
}


/* =========================================================
   Community
   ========================================================= */

.gw-home-community {
    position:
        relative;

    display:
        grid;

    grid-template-columns:
        minmax(0,1fr)
        390px;

    min-height:
        270px;

    overflow:
        hidden;

    border:
        1px solid
        #e4e7ef;

    border-radius:
        19px;

    background:
        linear-gradient(
            120deg,
            #f7f8ff,
            #fff
        );
}


.gw-home-community__copy {
    position:
        relative;

    z-index:
        3;

    padding:
        38px;
}


.gw-home-community__copy h2 {
    margin:
        0 0 11px;

    color:
        #202634;

    font-size:
        28px;

    font-weight:
        850;
}


.gw-home-community__copy p {
    max-width:
        500px;

    margin:
        0 0 18px;

    color:
        #5f6b7d;

    font-size:
        11px;

    line-height:
        1.8;
}


.gw-home-community__buttons {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        8px;
}


.gw-home-button {
    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        38px;

    padding:
        0 15px;

    border:
        1px solid
        #7567ff;

    border-radius:
        9px;

    background:
        #7567ff;

    color:
        #fff;

    font-size:
        9px;

    font-weight:
        700;

    transition:
        transform .18s ease,
        background .18s ease;
}


.gw-home-button:hover {
    color:
        #fff;

    background:
        #8377ff;

    transform:
        translateY(-2px);
}


.gw-home-button--secondary {
    border-color:
        #e1e4eb;

    background:
        #fff;

    color:
        #596474;
}


.gw-home-button--secondary:hover {
    color:
        #7567ff;

    background:
        #faf9ff;
}


.gw-home-community__visual {
    position:
        relative;

    overflow:
        hidden;
}


.gw-community-grid {
    position:
        absolute;

    inset:
        -50px;

    background-image:
        linear-gradient(
            rgba(117,103,255,.07) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(117,103,255,.07) 1px,
            transparent 1px
        );

    background-size:
        28px 28px;

    transform:
        perspective(500px)
        rotateY(-8deg)
        rotateX(5deg);
}


.gw-community-orb {
    position:
        absolute;

    left:
        50%;

    top:
        50%;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        125px;

    height:
        125px;

    border:
        1px solid
        rgba(117,103,255,.20);

    border-radius:
        50%;

    background:
        radial-gradient(
            circle,
            rgba(117,103,255,.23),
            rgba(117,103,255,.04) 70%
        );

    color:
        #7567ff;

    font-size:
        31px;

    font-weight:
        900;

    transform:
        translate(-50%,-50%);

    box-shadow:
        0 0 70px
        rgba(117,103,255,.17);

    animation:
        gw-home-orb
        6s
        ease-in-out
        infinite;
}


@keyframes gw-home-orb {

    0%,
    100% {
        transform:
            translate(-50%,-50%);
    }

    50% {
        transform:
            translate(-50%,-55%);
    }

}


.gw-community-tag {
    position:
        absolute;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        25px;

    padding:
        0 8px;

    border:
        1px solid
        #dfddf7;

    border-radius:
        999px;

    background:
        rgba(255,255,255,.76);

    color:
        #7669e5;

    font-size:
        7px;

    font-weight:
        800;

    box-shadow:
        0 6px 14px
        rgba(44,54,82,.05);

    backdrop-filter:
        blur(8px);
}


.gw-community-tag--one {
    left:
        15%;

    top:
        23%;
}


.gw-community-tag--two {
    right:
        14%;

    top:
        18%;
}


.gw-community-tag--three {
    right:
        11%;

    bottom:
        22%;
}


/* =========================================================
   Empty
   ========================================================= */

.gw-home-empty {
    padding:
        38px 18px;

    color:
        #758092;

    font-size:
        10px;

    text-align:
        center;
}


/* =========================================================
   Tablet
   ========================================================= */

@media (max-width: 1200px) {

    .gw-home-hero__content {
        grid-template-columns:
            minmax(0,1fr)
            300px;
    }


    .gw-home-knowledge-map {
        grid-template-columns:
            repeat(4,minmax(0,1fr));
    }


    .gw-home-games__grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .gw-home-tutorial-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}


/* =========================================================
   Mobile / Tablet
   ========================================================= */

@media (max-width: 900px) {

    .gw-home-hero {
        min-height:
            auto;
    }


    .gw-home-hero__background {
        background-position:
            63% center;
    }


    .gw-home-hero__wash {
        background:
            linear-gradient(
                180deg,
                rgba(255,255,255,.96) 0%,
                rgba(255,255,255,.89) 40%,
                rgba(255,255,255,.67) 67%,
                rgba(247,250,255,.93) 100%
            );
    }


    .gw-home-hero__content {
        grid-template-columns:
            1fr;

        min-height:
            auto;

        gap:
            25px;

        padding-top:
            42px;

        padding-bottom:
            26px;
    }


    .gw-home-hero__copy {
        max-width:
            none;

        text-align:
            center;
    }


    .gw-home-hero__title {
        font-size:
            74px;

        letter-spacing:
            -3.5px;
    }


    .gw-home-hero__description {
        margin-left:
            auto;

        margin-right:
            auto;

        color:
            #4a5566;
    }


    .gw-home-search {
        margin-left:
            auto;

        margin-right:
            auto;

        text-align:
            left;
    }


    .gw-home-hero__hot {
        justify-content:
            center;
    }


    .gw-home-hero__info {
        width:
            min(100%, 450px);

        margin:
            0 auto;
    }


    .gw-home-hero__info-inner {
        padding:
            19px;
    }


    .gw-home-hero__bottom {
        justify-content:
            center;

        padding-bottom:
            4px;
    }


    .gw-home-quick__inner {
        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }


    .gw-home-knowledge-map {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .gw-home-games__grid {
        grid-template-columns:
            1fr;
    }


    .gw-home-content-grid {
        grid-template-columns:
            1fr;
    }


    .gw-home-tutorial-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .gw-home-community {
        grid-template-columns:
            1fr;
    }


    .gw-home-community__visual {
        display:
            none;
    }

}


/* =========================================================
   Mobile
   ========================================================= */

@media (max-width: 640px) {

    .gw-home-hero__top {
        padding:
            0 3px;
    }


    .gw-home-hero__edition {
        display:
            none;
    }


    .gw-home-hero__content {
        padding-top:
            34px;
    }


    .gw-home-hero__title {
        font-size:
            60px;

        line-height:
            .92;

        letter-spacing:
            -3px;
    }


    .gw-home-hero__description {
        font-size:
            12px;

        line-height:
            1.8;
    }


    .gw-home-search {
        height:
            52px;

        border-radius:
            13px;
    }


    .gw-home-search__icon {
        width:
            35px;
    }


    .gw-home-search input {
        font-size:
            11px;
    }


    .gw-home-search button {
        min-width:
            58px;

        height:
            39px;
    }


    .gw-home-hero__info-inner {
        border-radius:
            16px;
    }


    .gw-home-hero__info-inner > strong {
        font-size:
            18px;
    }


    .gw-home-quick__inner {
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap:
            7px;

        padding:
            7px;

        border-radius:
            13px;
    }


    .gw-home-quick__item {
        min-height:
            49px;

        padding:
            0 8px;
    }


    .gw-home-section {
        margin-top:
            44px;
    }


    .gw-home-section__header {
        align-items:
            center;
    }


    .gw-home-section__header h2 {
        font-size:
            22px;
    }


    .gw-home-section__header p {
        font-size:
            9px;
    }


    .gw-home-section__more {
        font-size:
            9px;
    }


    .gw-home-knowledge-map {
        grid-template-columns:
            1fr;
    }


    .gw-home-knowledge-card {
        min-height:
            auto;

        padding:
            16px;
    }


    .gw-home-game-card {
        grid-template-columns:
            138px
            minmax(0,1fr);
    }


    .gw-home-game-card__image {
        min-height:
            120px;
    }


    .gw-home-game-card__body {
        padding:
            12px;
    }


    .gw-home-game-card__body h3 {
        font-size:
            12px;
    }


    .gw-home-game-card__body p {
        font-size:
            8px;

        -webkit-line-clamp:
            4;
    }


    .gw-home-content-item {
        grid-template-columns:
            76px
            minmax(0,1fr)
            25px;

        gap:
            9px;
    }


    .gw-home-content-item__main p {
        display:
            none;
    }


    .gw-home-content-item__main h3 {
        font-size:
            11px;
    }


    .gw-home-tutorial-grid {
        grid-template-columns:
            1fr;
    }


    .gw-home-community__copy {
        padding:
            28px 22px;
    }


    .gw-home-community__copy h2 {
        font-size:
            24px;
    }

}


/* =========================================================
   Small Mobile
   ========================================================= */

@media (max-width: 420px) {

    .gw-home-hero__background {
        background-position:
            61% center;
    }


    .gw-home-hero__title {
        font-size:
            52px;
    }


    .gw-home-hero__description br {
        display:
            none;
    }


    .gw-home-quick__item > span:not(
        .gw-home-quick__icon
    ) small {
        display:
            none;
    }


    .gw-home-game-card {
        grid-template-columns:
            118px
            minmax(0,1fr);
    }


    .gw-home-content-item {
        grid-template-columns:
            69px
            minmax(0,1fr)
            23px;
    }


    .gw-home-content-item__meta {
        display:
            none;
    }

}


/* =========================================================
   Reduced Motion
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .gw-front-page *,
    .gw-front-page *::before,
    .gw-front-page *::after {
        animation-duration:
            .01ms !important;

        animation-iteration-count:
            1 !important;

        transition-duration:
            .01ms !important;
    }

}
/* =========================================================
   30. Footer
   ========================================================= */

.gw-footer {
    position: relative;
    margin-top: 70px;
    background: #fff;
    border-top: 1px solid var(--gw-border);
    color: var(--gw-text-secondary);
}


/* =========================================================
   Footer Container
   ========================================================= */

.gw-footer__container {
    padding-top: 50px;
    padding-bottom: 25px;
}


/* =========================================================
   Footer Main
   ========================================================= */

.gw-footer__main {
    display: grid;
    grid-template-columns: minmax(280px, 2fr) repeat(3, minmax(120px, 1fr));
    gap: 50px;
}


/* =========================================================
   Brand
   ========================================================= */

.gw-footer__brand {
    max-width: 430px;
}


.gw-footer__logo {
    display: inline-flex;
    align-items: center;
    margin-bottom: 15px;
    color: var(--gw-heading);
    text-decoration: none;
}


.gw-footer__logo-image {
    display: block;
    width: auto;
    height: 34px;
    max-width: 190px;
    object-fit: contain;
}


.gw-footer__logo-text {
    color: var(--gw-heading);
    font-size: 23px;
    font-weight: 850;
    letter-spacing: -.6px;
}


.gw-footer__description {
    max-width: 410px;
    margin: 0 0 15px;
    color: var(--gw-text-muted);
    font-size: 13px;
    line-height: 1.85;
}


.gw-footer__brand-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    color: var(--gw-text-light);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.2px;
}


/* =========================================================
   Footer Columns
   ========================================================= */

.gw-footer__column {
    min-width: 0;
}


.gw-footer__title {
    margin: 0 0 16px;
    color: var(--gw-heading);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
}


.gw-footer__links {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}


    .gw-footer__links a {
        display: inline-flex;
        align-items: center;
        width: fit-content;
        color: var(--gw-text-muted);
        font-size: 12px;
        line-height: 1.5;
        text-decoration: none;
        transition: color var(--gw-transition-fast), transform var(--gw-transition-fast);
    }


        .gw-footer__links a:hover {
            color: var(--gw-primary);
            transform: translateX(3px);
        }


/* =========================================================
   Divider
   ========================================================= */

.gw-footer__divider {
    width: 100%;
    height: 1px;
    margin: 38px 0 20px;
    background: var(--gw-border-light);
}


/* =========================================================
   Bottom
   ========================================================= */

.gw-footer__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}


.gw-footer__copyright {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    color: var(--gw-text-light);
    font-size: 10px;
    line-height: 1.6;
}


.gw-footer__dot {
    color: var(--gw-border);
}


.gw-footer__bottom-links {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px;
}


    .gw-footer__bottom-links a {
        color: var(--gw-text-light);
        font-size: 10px;
        text-decoration: none;
        transition: color var(--gw-transition-fast);
    }


        .gw-footer__bottom-links a:hover {
            color: var(--gw-primary);
        }


/* =========================================================
   Footer Mobile
   ========================================================= */

@media (max-width: 900px) {

    .gw-footer {
        margin-top: 50px;
    }


    .gw-footer__container {
        width: min( calc(100% - 28px), var(--gw-container-width) );
        padding-top: 38px;
        padding-bottom: 22px;
    }


    .gw-footer__main {
        grid-template-columns: 1fr 1fr;
        gap: 32px 25px;
    }


    .gw-footer__brand {
        grid-column: 1 / -1;
        max-width: none;
    }


    .gw-footer__description {
        max-width: 100%;
        font-size: 12px;
    }


    .gw-footer__column {
        min-width: 0;
    }


    .gw-footer__title {
        margin-bottom: 12px;
        font-size: 13px;
    }


    .gw-footer__links {
        gap: 8px;
    }


        .gw-footer__links a {
            font-size: 11px;
        }


    .gw-footer__divider {
        margin: 30px 0 18px;
    }


    .gw-footer__bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 13px;
    }


    .gw-footer__bottom-links {
        gap: 14px;
    }
}


@media (max-width: 480px) {

    .gw-footer__main {
        grid-template-columns: 1fr 1fr;
        gap: 28px 18px;
    }


    .gw-footer__logo-image {
        height: 30px;
        max-width: 160px;
    }


    .gw-footer__logo-text {
        font-size: 20px;
    }


    .gw-footer__brand-meta {
        font-size: 8px;
        letter-spacing: .8px;
    }


    .gw-footer__copyright {
        font-size: 9px;
    }


    .gw-footer__bottom-links {
        gap: 12px;
    }
}


@media (max-width: 340px) {

    .gw-footer__main {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   Mobile bottom navigation
   ========================================================= */

.gw-mobile-bottom-nav {
    display: none;
}

.gw-icon-fallback { display: inline; }
.gw-mobile-bottom-nav__icon > i { display: none; width: 18px; height: 18px; }
.gw-mobile-bottom-nav__icon > i svg { width: 100%; height: 100%; stroke-width: 2; }
.gw-icons-ready .gw-icon-fallback { display: none; }
.gw-icons-ready .gw-mobile-bottom-nav__icon > i { display: inline-flex; align-items: center; justify-content: center; }
.gw-icons-ready .gw-mobile-bottom-nav__icon > svg { display: block; width: 18px; height: 18px; stroke-width: 2; }

@media (max-width: 720px) {
    body {
        padding-bottom: calc(70px + env(safe-area-inset-bottom));
    }

    .gw-mobile-bottom-nav {
        position: fixed;
        z-index: 999;
        right: 0;
        bottom: 0;
        left: 0;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        min-height: 62px;
        padding: 6px 8px calc(6px + env(safe-area-inset-bottom));
        border-top: 1px solid rgba(229, 232, 241, .9);
        background: rgba(255, 255, 255, .92);
        box-shadow: 0 -8px 28px rgba(33, 37, 57, .08);
        backdrop-filter: blur(16px);
        -webkit-backdrop-filter: blur(16px);
    }

    .gw-mobile-bottom-nav__item {
        position: relative;
        display: flex;
        flex-direction: column;
        min-width: 0;
        min-height: 50px;
        align-items: center;
        justify-content: center;
        gap: 2px;
        color: #858b9a;
        font-size: 10px;
        font-weight: 650;
        line-height: 1.2;
        text-decoration: none;
        transition: color .2s ease, transform .2s ease;
    }

    .gw-mobile-bottom-nav__icon {
        display: grid;
        width: 24px;
        height: 24px;
        place-items: center;
        border-radius: 9px;
        font-size: 17px;
        font-weight: 700;
        line-height: 1;
    }

    .gw-mobile-bottom-nav__item--wiki {
        color: #9b92ff;
        cursor: pointer;
    }

    .gw-mobile-bottom-nav__item--wiki .gw-mobile-bottom-nav__icon {
        width: 38px;
        height: 38px;
        margin-top: -17px;
        border: 4px solid #f7f8fb;
        border-radius: 14px;
        background: linear-gradient(135deg, #8a7cff, #6757e8);
        box-shadow: 0 7px 17px rgba(108, 99, 255, .3);
        color: #fff;
        font-size: 14px;
        letter-spacing: -.4px;
    }

    .gw-mobile-bottom-nav__badge {
        position: absolute;
        top: 5px;
        right: calc(50% - 18px);
    }

    .gw-mobile-bottom-nav__item:focus-visible {
        outline: 3px solid rgba(108, 99, 255, .35);
        outline-offset: -3px;
    }

    .gw-wiki-single .gw-wiki-author-sidebar {
        display: none;
    }

    #galwiki-comments-scope .gw-sticker__panel {
        bottom: calc(76px + env(safe-area-inset-bottom)) !important;
    }
}



/* =========================================================
   Wiki Single
   ========================================================= */

.gw-wiki-single {
    padding-bottom: 70px;
}

.gw-wiki-entry {
    width: 100%;
}


/* =========================================================
   01. Wiki Hero
   ========================================================= */

.gw-wiki-hero-card {
    display: grid;

    grid-template-columns:
        310px minmax(0, 1fr);

    gap: 30px;

    margin-top: 30px;
    margin-bottom: 30px;

    padding: 24px;

    background: #fff;

    border: 1px solid var(--gw-border);

    border-radius: 20px;

    box-shadow:
        0 8px 30px rgba(20,24,40,.055);
}


/* Cover */

.gw-wiki-hero__cover {
    width: 310px;

    height: 194px;

    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            #f0edff,
            #e6e1ff
        );

    border-radius: 15px;
}

.gw-wiki-hero__image {
    display: block;

    width: 100%;

    height: 100%;

    object-fit: cover;
}

.gw-wiki-hero__empty {
    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    width: 100%;

    height: 100%;

    color:
        rgba(124,92,255,.42);
}

.gw-wiki-hero__empty strong {
    font-size: 58px;

    line-height: 1;

    font-weight: 900;
}

.gw-wiki-hero__empty span {
    margin-top: 7px;

    font-size: 10px;

    letter-spacing: 2px;
}


/* Info */

.gw-wiki-hero__info {
    min-width: 0;

    display: flex;

    flex-direction: column;

    justify-content: center;
}

.gw-wiki-hero__category {
    display: inline-flex;

    align-items: center;

    width: fit-content;

    min-height: 27px;

    padding: 0 10px;

    margin-bottom: 9px;

    background:
        var(--gw-primary-soft);

    border-radius: 999px;

    color:
        var(--gw-primary);

    font-size: 10px;

    font-weight: 700;

    text-decoration: none;
}

.gw-wiki-hero__category:hover {
    color:
        var(--gw-primary-hover);
}

.gw-wiki-hero__title {
    margin: 0;

    color:
        var(--gw-heading);

    font-size:
        clamp(30px, 4vw, 44px);

    line-height: 1.28;

    font-weight: 850;

    letter-spacing: -.8px;
}

.gw-wiki-hero__meta {
    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 7px;

    margin-top: 10px;

    color:
        var(--gw-text-muted);

    font-size: 11px;
}


/* =========================================================
   02. Contributor
   ========================================================= */

.gw-wiki-hero__contributor {
    display: flex;

    align-items: center;

    gap: 10px;

    margin-top: 18px;
}

.gw-wiki-hero__contributor-label {
    color:
        var(--gw-text-light);

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 1.2px;
}

.gw-wiki-contributor {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    color:
        var(--gw-text);

    text-decoration: none;
}

.gw-wiki-contributor:hover {
    color:
        var(--gw-primary);
}

.gw-wiki-contributor__avatar {
    display: block;

    width: 34px;

    height: 34px;

    overflow: hidden;

    border-radius: 50%;
}

.gw-wiki-contributor__avatar img {
    display: block;

    width: 100% !important;

    height: 100% !important;

    object-fit: cover;

    border-radius: 50%;
}

.gw-wiki-contributor__name {
    max-width: 180px;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    font-size: 12px;

    font-weight: 600;
}

.gw-wiki-contributor__more { position: relative; font-size: 12px; color: var(--gw-text-light); }
.gw-wiki-contributor__more summary { cursor: pointer; color: var(--gw-primary); font-weight: 700; }
.gw-wiki-contributor__more > div { position: absolute; z-index: 4; top: 22px; left: 0; min-width: 150px; max-width: 240px; padding: 8px 10px; background: #fff; border: 1px solid var(--gw-border); border-radius: 5px; box-shadow: 0 8px 20px rgba(25,30,38,.12); }
.gw-wiki-contributor__more a { display: block; padding: 4px 0; color: var(--gw-text); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gw-wiki-contributor__more a:hover { color: var(--gw-primary); }


/* =========================================================
   03. Hero Actions
   ========================================================= */

.gw-wiki-hero__actions {
    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 8px;

    margin-top: 20px;
}

.gw-wiki-action {
    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 6px;

    min-height: 37px;

    padding: 0 14px;

    border-radius: 9px;

    font-size: 12px;

    font-weight: 600;

    text-decoration: none;

    transition:
        transform .2s ease,
        background .2s ease,
        color .2s ease,
        box-shadow .2s ease;
}

.gw-wiki-action:hover {
    transform: translateY(-1px);
}

.gw-wiki-action--official {
    background:
        #f7f8fa;

    border:
        1px solid var(--gw-border);

    color:
        var(--gw-text-secondary);
}

.gw-wiki-action--official:hover {
    color:
        var(--gw-primary);

    border-color:
        rgba(124,92,255,.18);

    background:
        var(--gw-primary-soft);
}

.gw-wiki-action--primary {
    background:
        var(--gw-primary);

    border:
        1px solid var(--gw-primary);

    color:
        #fff;

    box-shadow:
        0 4px 14px rgba(124,92,255,.16);
}

.gw-wiki-action--primary:hover {
    background:
        var(--gw-primary-hover);

    color:
        #fff;
}

.gw-wiki-action--secondary {
    background:
        var(--gw-primary-soft);

    border:
        1px solid rgba(124,92,255,.12);

    color:
        var(--gw-primary);
}

.gw-wiki-action--resource-limited {
    opacity: .52;
}

.gw-wiki-action--resource-limited:hover {
    transform: none;
}

.gw-wiki-action--favorite {
    border: 1px solid rgba(124, 92, 255, .16);
    background: #fff;
    color: var(--gw-text-secondary);
    cursor: pointer;
}

.gw-wiki-action--favorite:hover,
.gw-wiki-action--favorite.is-favorited {
    border-color: rgba(124, 92, 255, .24);
    background: var(--gw-primary-soft);
    color: var(--gw-primary);
}

.gw-wiki-action--favorite:disabled {
    cursor: wait;
    opacity: .65;
}


/* =========================================================
   04. Main Layout
   ========================================================= */

.gw-wiki-main-layout {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        250px;

    gap: 28px;

    align-items: start;
}

.gw-wiki-main {
    min-width: 0;
}


/* =========================================================
   05. Wiki Content
   ========================================================= */

.gw-wiki-content {
    background:
        #fff;

    border:
        1px solid var(--gw-border);

    border-radius:
        18px;

    overflow:
        hidden;
}

.gw-wiki-content__topline {
    display: flex;

    align-items: center;

    gap: 7px;

    padding:
        15px 35px 0;

    color:
        var(--gw-text-light);

    font-size:
        9px;

    font-weight:
        700;

    letter-spacing:
        1px;
}

.gw-wiki-content__body {
    padding:
        30px 35px 38px;

    color:
        #30343a;

    font-size:
        16px;

    line-height:
        1.95;

    overflow-wrap:
        break-word;
}

.gw-single-ad {
    max-width: 100%;
    margin: 0 0 24px;
    padding: 12px;
    overflow: hidden;
    border: 1px solid #e4dfd4;
    border-radius: 8px;
    background: #fffcf5;
    overflow-wrap: anywhere;
}

.gw-single-ad__label {
    display: inline-flex;
    min-height: 22px;
    align-items: center;
    margin: 0 0 10px;
    padding: 0 8px;
    border-radius: 999px;
    background: #6c5a34;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
}

.gw-single-ad__content {
    max-width: 100%;
    overflow-x: auto;
}

.gw-single-ad__content > * {
    max-width: 100%;
}

.gw-single-ad__content iframe,
.gw-single-ad__content img {
    max-width: 100%;
}

@media (max-width: 640px) {
    .gw-single-ad { margin-bottom: 20px; padding: 10px; }
}


/* =========================================================
   Wiki Typography
   ========================================================= */

.gw-wiki-content__body > *:first-child {
    margin-top:
        0;
}

.gw-wiki-content__body p {
    margin:
        0 0 19px;
}

.gw-wiki-content__body h2 {
    position: relative;

    margin:
        42px 0 18px;

    padding-left:
        14px;

    color:
        var(--gw-heading);

    font-size:
        25px;

    line-height:
        1.45;

    font-weight:
        800;
}

.gw-wiki-content__body h2::before {
    content: "";

    position: absolute;

    left: 0;

    top: 4px;

    width: 4px;

    height:
        calc(100% - 8px);

    background:
        var(--gw-primary);

    border-radius:
        99px;
}

.gw-wiki-content__body h3 {
    margin:
        30px 0 13px;

    color:
        var(--gw-heading);

    font-size:
        20px;

    line-height:
        1.5;
}

.gw-wiki-content__body h4 {
    margin:
        25px 0 11px;

    color:
        var(--gw-heading);

    font-size:
        17px;
}

.gw-wiki-content__body strong {
    color:
        var(--gw-heading);

    font-weight:
        700;
}

.gw-wiki-content__body a {
    color:
        var(--gw-primary);

    text-decoration:
        none;

    border-bottom:
        1px solid rgba(124,92,255,.18);
}

.gw-wiki-content__body a:hover {
    color:
        var(--gw-primary-hover);

    border-color:
        var(--gw-primary-hover);
}


/* Lists */

.gw-wiki-content__body ul,
.gw-wiki-content__body ol {
    margin:
        18px 0;

    padding-left:
        28px;
}

.gw-wiki-content__body ul {
    list-style:
        disc;
}

.gw-wiki-content__body ol {
    list-style:
        decimal;
}

.gw-wiki-content__body li {
    margin-bottom:
        8px;
}


/* Blockquote */

.gw-wiki-content__body blockquote {
    margin:
        24px 0;

    padding:
        16px 20px;

    background:
        #fafafe;

    border-left:
        4px solid var(--gw-primary);

    border-radius:
        0 10px 10px 0;

    color:
        var(--gw-text-secondary);
}


/* Image */

.gw-wiki-content__body img {
    display:
        block;

    max-width:
        100%;

    height:
        auto;

    margin:
        24px auto;

    border-radius:
        10px;
}


/* Table */

.gw-wiki-content__body table {
    width:
        100%;

    margin:
        24px 0;

    border-collapse:
        collapse;

    background:
        #fff;

    font-size:
        13px;
}

.gw-wiki-content__body th,
.gw-wiki-content__body td {
    padding:
        11px 13px;

    border:
        1px solid var(--gw-border);

    vertical-align:
        top;

    text-align:
        left;
}

.gw-wiki-content__body th {
    background:
        #fafafd;

    color:
        var(--gw-heading);

    font-weight:
        700;
}


/* Code */

.gw-wiki-content__body pre {
    overflow-x:
        auto;

    margin:
        24px 0;

    padding:
        18px;

    background:
        #1d2028;

    color:
        #eef0f5;

    border-radius:
        10px;

    font-size:
        13px;

    line-height:
        1.75;
}

.gw-wiki-content__body code {
    font-family:
        "SFMono-Regular",
        Consolas,
        monospace;
}

.gw-wiki-content__body :not(pre) > code {
    padding:
        2px 5px;

    background:
        #f0f1f3;

    border-radius:
        4px;

    color:
        #9b4269;

    font-size:
        .9em;
}


/* =========================================================
   06. Tags
   ========================================================= */

.gw-wiki-tags {
    display:
        flex;

    align-items:
        center;

    flex-wrap:
        wrap;

    gap:
        10px;

    padding:
        18px 35px;

    border-top:
        1px solid var(--gw-border);
}

.gw-wiki-tags__label {
    color:
        var(--gw-text-muted);

    font-size:
        11px;

    font-weight:
        700;
}

.gw-wiki-tags__list {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        6px;
}

.gw-wiki-tag {
    display:
        inline-flex;

    align-items:
        center;

    min-height:
        28px;

    padding:
        0 9px;

    background:
        #fafafa;

    border:
        1px solid var(--gw-border);

    border-radius:
        999px;

    color:
        var(--gw-text-secondary);

    font-size:
        10px;

    text-decoration:
        none;
}

.gw-wiki-tag:hover {
    color:
        var(--gw-primary);

    background:
        var(--gw-primary-soft);

    border-color:
        rgba(124,92,255,.15);
}


/* =========================================================
   07. Previous / Next
   ========================================================= */

.gw-wiki-pagination {
    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        10px;

    padding:
        0 35px 30px;
}

.gw-wiki-pagination__item {
    min-width:
        0;

    padding:
        14px;

    background:
        #fafafa;

    border:
        1px solid var(--gw-border);

    border-radius:
        10px;
}

.gw-wiki-pagination__item--next {
    text-align:
        right;
}

.gw-wiki-pagination__item span {
    display:
        block;

    margin-bottom:
        4px;

    color:
        var(--gw-text-light);

    font-size:
        9px;
}

.gw-wiki-pagination__item a,
.gw-wiki-pagination__item strong {
    display:
        block;

    overflow:
        hidden;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;

    color:
        var(--gw-text);

    font-size:
        11px;
}

.gw-wiki-pagination__item a:hover {
    color:
        var(--gw-primary);
}


/* =========================================================
   08. Author Sidebar
   ========================================================= */

.gw-wiki-author-sidebar {
    position:
        sticky;

    top:
        88px;
}

.gw-author-card {
    padding:
        20px;

    background:
        #fff;

    border:
        1px solid var(--gw-border);

    border-radius:
        17px;

    box-shadow:
        0 5px 20px rgba(20,24,40,.04);
}


/* top */

.gw-author-card__top {
    margin-bottom:
        16px;

    padding-bottom:
        12px;

    border-bottom:
        1px solid var(--gw-border-light);
}

.gw-author-card__label {
    color:
        var(--gw-primary);

    font-size:
        10px;

    font-weight:
        800;

    letter-spacing:
        1.5px;
}


/* identity */

.gw-author-card__identity {
    display:
        flex;

    flex-direction:
        column;

    align-items:
        center;

    text-align:
        center;
}

.gw-author-card__avatar {
    display:
        block;

    width:
        74px;

    height:
        74px;

    overflow:
        hidden;

    margin-bottom:
        10px;

    border-radius:
        50%;
}

.gw-author-card__avatar img {
    width:
        100% !important;

    height:
        100% !important;

    object-fit:
        cover;

    border-radius:
        50%;
}

.gw-author-card__name {
    color:
        var(--gw-heading);

    font-size:
        15px;

    font-weight:
        750;

    text-decoration:
        none;
}

.gw-author-card__name:hover {
    color:
        var(--gw-primary);
}

.gw-author-card__username {
    margin-top:
        2px;

    color:
        var(--gw-text-light);

    font-size:
        10px;
}


/* stats */

.gw-author-card__stats {
    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0,1fr));

    gap:
        8px;

    margin-top:
        18px;
}

.gw-author-card__stats > div {
    padding:
        10px 5px;

    background:
        #fafafd;

    border-radius:
        9px;

    text-align:
        center;
}

.gw-author-card__stats strong {
    display:
        block;

    color:
        var(--gw-primary);

    font-size:
        16px;

    line-height:
        18px;
}

.gw-author-card__stats span {
    display:
        block;

    margin-top:
        3px;

    color:
        var(--gw-text-light);

    font-size:
        9px;
}


/* signature */

.gw-author-card__signature {
    margin-top:
        17px;

    padding-top:
        15px;

    border-top:
        1px solid var(--gw-border-light);
}

.gw-author-card__signature > span {
    display:
        block;

    margin-bottom:
        6px;

    color:
        var(--gw-text-light);

    font-size:
        9px;

    font-weight:
        700;
}

.gw-author-card__signature p {
    margin:
        0;

    color:
        var(--gw-text-secondary);

    font-size:
        11px;

    line-height:
        1.75;
}


/* social */

.gw-author-card__social {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        7px;

    margin-top:
        17px;

    padding-top:
        15px;

    border-top:
        1px solid var(--gw-border-light);
}

.gw-author-card__social a {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        31px;

    height:
        31px;

    background:
        #fafafa;

    border:
        1px solid var(--gw-border);

    border-radius:
        50%;

    color:
        var(--gw-text-secondary);

    font-size:
        10px;

    font-weight:
        700;

    text-decoration:
        none;

    transition:
        color .2s ease,
        background .2s ease,
        border-color .2s ease;
}

.gw-author-card__social a:hover {
    color:
        #fff;

    background:
        var(--gw-primary);

    border-color:
        var(--gw-primary);
}


/* =========================================================
   09. Wiki Recommended + Comments + Responsive
   ========================================================= */


/* =========================================================
   01. Wiki Main Layout
   ========================================================= */

.gw-wiki-single .gw-wiki-main-layout {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        250px;

    align-items: start;

    gap: 28px;

    width: 100%;
    max-width: 100%;
    min-width: 0;

    box-sizing: border-box;
}


/*
 * Grid 子项绝对不允许把父 Grid 撑宽
 */

.gw-wiki-single .gw-wiki-main-layout > * {
    min-width: 0;
    max-width: 100%;
}


/*
 * Wiki 正文
 */

.gw-wiki-single .gw-wiki-main {
    width: 100%;
    max-width: 100%;
    min-width: 0;

    box-sizing: border-box;
}


/*
 * 作者栏
 */

.gw-wiki-single .gw-wiki-author-sidebar {
    position: sticky;

    top: 88px;

    align-self: start;

    width: 100%;
    max-width: 250px;
    min-width: 0;

    box-sizing: border-box;
}


/* =========================================================
   02. Recommended
   ========================================================= */

.gw-wiki-recommend {
    width: 100%;
    max-width: 100%;
    min-width: 0;

    margin: 38px 0 0;
    padding: 0;

    box-sizing: border-box;
}


/*
 * Header
 */

.gw-wiki-recommend__header {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 15px;

    margin: 0 0 17px;
    padding: 0;

    box-sizing: border-box;
}


.gw-wiki-recommend__header h2 {
    margin: 0;
    padding: 0;

    color: var(--gw-heading);

    font-size: 24px;
    font-weight: 750;
    line-height: 1.35;
}


/*
 * Recommended Grid
 */

.gw-wiki-recommend__grid {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 14px;

    width: 100%;
    max-width: 100%;
    min-width: 0;

    box-sizing: border-box;
}


/*
 * Recommendation Card
 */

.gw-recommend-card {
    display: block;

    width: 100%;
    max-width: 100%;
    min-width: 0;

    overflow: hidden;

    background: #fff;

    border: 1px solid var(--gw-border);
    border-radius: 13px;

    box-sizing: border-box;

    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease;
}


.gw-recommend-card:hover {
    transform: translateY(-3px);

    border-color:
        rgba(124, 92, 255, .16);

    box-shadow:
        var(--gw-shadow-sm);
}


/*
 * Cover
 */

.gw-recommend-card__cover {
    position: relative;

    display: block;

    width: 100%;
    max-width: 100%;

    aspect-ratio: 16 / 9;

    overflow: hidden;

    background:
        var(--gw-primary-soft);

    text-decoration: none;

    box-sizing: border-box;
}


.gw-recommend-card__cover img {
    display: block;

    width: 100%;
    max-width: 100%;

    height: 100%;

    margin: 0;
    padding: 0;

    object-fit: cover;

    transition:
        transform .35s ease;
}


.gw-recommend-card:hover
.gw-recommend-card__cover img {
    transform:
        scale(1.045);
}


/*
 * 无封面
 */

.gw-recommend-card__cover span {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 100%;
    height: 100%;

    color:
        rgba(124, 92, 255, .4);

    font-size: 14px;
    font-weight: 800;
}


/*
 * Card Body
 */

.gw-recommend-card__body {
    width: 100%;
    max-width: 100%;
    min-width: 0;

    padding: 13px;

    box-sizing: border-box;
}


/*
 * Category
 */

.gw-recommend-card__category {
    display: block;

    margin: 0 0 5px;
    padding: 0;

    color: var(--gw-primary);

    font-size: 9px;
    font-weight: 700;
    line-height: 1.4;

    overflow: hidden;

    text-overflow: ellipsis;
    white-space: nowrap;
}


/*
 * Title
 */

.gw-recommend-card__body h3 {
    width: 100%;
    max-width: 100%;
    min-width: 0;

    margin: 0;
    padding: 0;

    font-size: 13px;
    line-height: 1.55;
}


.gw-recommend-card__body h3 a {
    display: -webkit-box;

    overflow: hidden;

    color: var(--gw-heading);

    text-decoration: none;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;

    overflow-wrap: anywhere;
    word-break: break-word;

    transition:
        color .18s ease;
}


.gw-recommend-card__body h3 a:hover {
    color:
        var(--gw-primary);
}


/*
 * Date
 */

.gw-recommend-card__date {
    margin: 7px 0 0;
    padding: 0;

    color: var(--gw-text-light);

    font-size: 9px;
    line-height: 1.4;
}


/* =========================================================
   03. Comments Root
   ========================================================= */

#galwiki-comments-scope {
    display: block;

    width: 100%;
    max-width: 100%;
    min-width: 0;

    margin: 42px 0 0;
    padding: 0;

    clear: both;

    color: var(--gw-text);

    font-family: var(--gw-font);

    box-sizing: border-box;

    overflow: visible;
}


#galwiki-comments-scope,
#galwiki-comments-scope * {
    box-sizing: border-box;
}


/*
 * 防止评论内部任何元素反向撑开布局
 */

#galwiki-comments-scope img,
#galwiki-comments-scope iframe,
#galwiki-comments-scope video,
#galwiki-comments-scope table,
#galwiki-comments-scope pre {
    max-width: 100%;
}


/* =========================================================
   04. Comment Header
   ========================================================= */

#galwiki-comments-scope .gw-comments__header {
    display: block;

    width: 100%;
    max-width: 100%;
    min-width: 0;

    margin: 0 0 18px;
    padding: 0;
}


#galwiki-comments-scope .gw-section-label {
    display: block;

    margin: 0 0 5px;
}


#galwiki-comments-scope .gw-comments__title {
    display: flex;

    align-items: center;

    gap: 8px;

    margin: 0;
    padding: 0;

    color: var(--gw-heading);

    font-size: 24px;
    font-weight: 750;
    line-height: 1.35;
}


#galwiki-comments-scope .gw-comments__count {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    flex: 0 0 auto;

    min-width: 25px;
    height: 22px;

    padding: 0 7px;

    background:
        var(--gw-primary-soft);

    border-radius: 999px;

    color:
        var(--gw-primary);

    font-size: 10px;
    font-weight: 600;
    line-height: 1;
}


#galwiki-comments-scope
.gw-comments__count[hidden] {
    display: none !important;
}


/* =========================================================
   05. Login
   ========================================================= */

#galwiki-comments-scope .gw-comments-login {
    display: flex;

    align-items: center;

    width: 100%;
    max-width: 100%;
    min-width: 0;

    gap: 15px;

    margin: 0;
    padding: 20px;

    background: #fff;

    border:
        1px solid var(--gw-border);

    border-radius: 15px;

    box-sizing: border-box;
}


#galwiki-comments-scope
.gw-comments-login__icon {
    display: flex;

    align-items: center;
    justify-content: center;

    flex: 0 0 45px;

    width: 45px;
    height: 45px;

    background:
        var(--gw-primary-soft);

    border-radius: 12px;

    color:
        var(--gw-primary);

    font-size: 18px;
}


#galwiki-comments-scope
.gw-comments-login__content {
    flex: 1 1 auto;

    width: 0;
    min-width: 0;
}


#galwiki-comments-scope
.gw-comments-login__content h3 {
    margin: 0 0 4px;
    padding: 0;

    color:
        var(--gw-heading);

    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
}


#galwiki-comments-scope
.gw-comments-login__content p {
    margin: 0;
    padding: 0;

    color:
        var(--gw-text-muted);

    font-size: 11px;
    line-height: 1.7;
}


#galwiki-comments-scope
.gw-comments-login__button {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    flex: 0 0 auto;

    min-width: 70px;
    height: 35px;

    padding: 0 16px;

    background:
        var(--gw-primary);

    border:
        1px solid var(--gw-primary);

    border-radius: 9px;

    color: #fff;

    font-size: 12px;
    font-weight: 600;

    line-height: 1;

    text-decoration: none;

    transition:
        transform .2s ease,
        background .2s ease,
        border-color .2s ease;
}


#galwiki-comments-scope
.gw-comments-login__button:hover {
    background:
        var(--gw-primary-hover);

    border-color:
        var(--gw-primary-hover);

    color: #fff;

    transform:
        translateY(-1px);
}


/* =========================================================
   06. Comment Form
   ========================================================= */

#galwiki-comments-scope .gw-comment-form {
    display: block;

    width: 100%;
    max-width: 100%;
    min-width: 0;

    margin: 0 0 24px;
    padding: 20px;

    background: #fff;

    border:
        1px solid var(--gw-border);

    border-radius: 15px;

    overflow: visible;
}


/*
 * Form isolation
 */

#galwiki-comments-scope
.gw-comment-native-form,
#galwiki-comments-scope
.gw-comment-native-form * {
    max-width: 100%;
}


#galwiki-comments-scope
.gw-comment-native-form {
    width: 100%;
    min-width: 0;

    margin: 0;
    padding: 0;

    box-sizing: border-box;
}


#galwiki-comments-scope
.gw-comment-native-form
input,
#galwiki-comments-scope
.gw-comment-native-form
textarea,
#galwiki-comments-scope
.gw-comment-native-form
button {
    font-family:
        var(--gw-font);
}


/* =========================================================
   07. Current User
   ========================================================= */

#galwiki-comments-scope .gw-comment-user {
    display: flex;

    align-items: center;

    width: 100%;
    min-width: 0;

    gap: 9px;

    margin: 0 0 14px;
}


#galwiki-comments-scope
.gw-comment-user__avatar {
    flex: 0 0 38px;

    width: 38px;
    height: 38px;

    overflow: hidden;

    border-radius: 50%;
}


#galwiki-comments-scope
.gw-comment-user__avatar img {
    display: block;

    width: 100% !important;
    max-width: none !important;

    height: 100% !important;

    object-fit: cover;

    border: 0 !important;
    border-radius: 50% !important;

    box-shadow: none !important;
}


#galwiki-comments-scope
.gw-comment-user__info {
    display: flex;

    flex-direction: column;

    flex: 1 1 auto;

    width: 0;
    min-width: 0;
}


#galwiki-comments-scope
.gw-comment-user__info strong {
    margin: 0;

    color:
        var(--gw-heading);

    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
}


#galwiki-comments-scope
.gw-comment-user__info span {
    margin-top: 2px;

    color:
        var(--gw-text-light);

    font-size: 9px;
    line-height: 1.4;
}


/* =========================================================
   08. Reply State
   ========================================================= */

#galwiki-comments-scope .gw-comment-replying {
    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 7px;

    width: 100%;
    max-width: 100%;

    margin: 0 0 12px;
    padding: 10px 12px;

    background:
        var(--gw-primary-soft);

    border:
        1px solid rgba(124,92,255,.10);

    border-radius: 10px;
}


#galwiki-comments-scope
.gw-comment-replying[hidden] {
    display: none !important;
}


#galwiki-comments-scope
.gw-comment-replying__cancel {
    margin-left: auto;

    padding: 0;

    background: transparent;

    border: 0;

    color:
        var(--gw-text-muted);

    font-size: 11px;

    cursor: pointer;

    appearance: none;
}


#galwiki-comments-scope
.gw-comment-replying__cancel:hover {
    color:
        var(--gw-primary);
}


/* =========================================================
   09. Editor
   ========================================================= */

#galwiki-comments-scope
.gw-comment-editor {
    display: block;

    width: 100%;
    max-width: 100%;
    min-width: 0;

    margin: 0;
    padding: 0;

    overflow: visible;
}


#galwiki-comments-scope
.gw-comment-textarea {
    display: block;

    width: 100%;
    max-width: 100%;
    min-width: 0;

    min-height: 145px;

    margin: 0;
    padding: 14px 15px;

    background: #fafafd;

    border:
        1px solid var(--gw-border);

    border-radius: 11px;

    outline: none;

    resize: vertical;

    color:
        var(--gw-text);

    font-size: 13px;
    line-height: 1.8;

    box-shadow: none;

    appearance: none;

    transition:
        background .2s ease,
        border-color .2s ease,
        box-shadow .2s ease;
}


#galwiki-comments-scope
.gw-comment-textarea:focus {
    background: #fff;

    border-color:
        rgba(124,92,255,.35);

    box-shadow:
        0 0 0 3px rgba(124,92,255,.08);
}


#galwiki-comments-scope
.gw-comment-textarea::placeholder {
    color:
        var(--gw-text-light);

    opacity: 1;
}


/* =========================================================
   10. Toolbar
   ========================================================= */

#galwiki-comments-scope
.gw-comment-toolbar {
    display: flex;

    align-items: center;
    justify-content: space-between;

    width: 100%;
    min-width: 0;

    gap: 10px;

    margin: 9px 0 0;
}


#galwiki-comments-scope
.gw-comment-toolbar__left,
#galwiki-comments-scope
.gw-comment-toolbar__right {
    display: flex;

    align-items: center;

    min-width: 0;

    gap: 8px;
}


#galwiki-comments-scope
.gw-comment-limit {
    color:
        var(--gw-text-light);

    font-size: 9px;
    line-height: 1.4;
}


/* =========================================================
   11. Submit Button
   ========================================================= */

#galwiki-comments-scope
.gw-comment-submit-wrap {
    display: flex;

    justify-content: flex-end;

    width: 100%;

    margin: 12px 0 0;
}


#galwiki-comments-scope
.gw-comment-submit {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    min-width: 100px;
    height: 36px;

    padding: 0 17px;

    background:
        var(--gw-primary);

    border:
        1px solid var(--gw-primary);

    border-radius: 9px;

    color: #fff;

    font-size: 12px;
    font-weight: 600;

    cursor: pointer;

    appearance: none;

    transition:
        transform .2s ease,
        background .2s ease,
        border-color .2s ease;
}


#galwiki-comments-scope
.gw-comment-submit:hover {
    background:
        var(--gw-primary-hover);

    border-color:
        var(--gw-primary-hover);

    transform:
        translateY(-1px);
}


#galwiki-comments-scope
.gw-comment-submit:disabled {
    opacity: .55;

    cursor: not-allowed;

    transform: none;
}


/* =========================================================
   12. Sticker
   ========================================================= */

#galwiki-comments-scope
.gw-sticker {
    position: relative;

    display: inline-block;

    width: auto;
    max-width: 100%;

    margin: 0;
}


#galwiki-comments-scope
.gw-sticker__button {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 5px;

    min-width: 0;
    height: 31px;

    padding: 0 10px;

    background:
        #f7f7fa;

    border:
        1px solid var(--gw-border);

    border-radius: 8px;

    color:
        var(--gw-text-secondary);

    font-size: 11px;

    cursor: pointer;

    appearance: none;
}


#galwiki-comments-scope
.gw-sticker__button:hover {
    background:
        var(--gw-primary-soft);

    border-color:
        rgba(124,92,255,.15);

    color:
        var(--gw-primary);
}


#galwiki-comments-scope
.gw-sticker__panel {
    position: absolute;

    left: 0;
    bottom: 42px;

    z-index: 99999;

    width: 365px;
    max-width: min(365px, calc(100vw - 30px));

    max-height: 310px;

    overflow: hidden;

    background:
        #fff;

    border:
        1px solid var(--gw-border);

    border-radius: 13px;

    box-shadow:
        0 15px 40px rgba(20,24,40,.14);
}


#galwiki-comments-scope
.gw-sticker__panel[hidden] {
    display: none !important;
}


#galwiki-comments-scope
.gw-sticker__header {
    display: flex;

    align-items: center;
    justify-content: space-between;

    padding: 11px 13px;

    border-bottom:
        1px solid var(--gw-border-light);
}


#galwiki-comments-scope
.gw-sticker__header strong {
    color:
        var(--gw-heading);

    font-size: 12px;
}


#galwiki-comments-scope
.gw-sticker__close {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 26px;
    height: 26px;

    padding: 0;

    background: transparent;

    border: 0;

    color:
        var(--gw-text-muted);

    font-size: 18px;

    cursor: pointer;
}


#galwiki-comments-scope
.gw-sticker__grid {
    display: grid;

    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 7px;

    max-height: 250px;

    padding: 12px;

    overflow-x: hidden;
    overflow-y: auto;
}


#galwiki-comments-scope
.gw-sticker__item {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 100%;

    aspect-ratio: 1 / 1;

    padding: 4px;

    background:
        #fafafa;

    border:
        1px solid transparent;

    border-radius: 8px;

    cursor: pointer;

    appearance: none;

    transition:
        transform .15s ease,
        background .15s ease,
        border-color .15s ease;
}


#galwiki-comments-scope
.gw-sticker__item:hover {
    background:
        var(--gw-primary-soft);

    border-color:
        rgba(124,92,255,.18);

    transform:
        scale(1.05);
}


#galwiki-comments-scope
.gw-sticker__item img {
    display: block;

    width: 100%;
    height: 100%;

    margin: 0;

    object-fit: contain;

    border: 0;

    border-radius: 4px;

    box-shadow: none;
}


/* =========================================================
   13. Comment List
   ========================================================= */

#galwiki-comments-scope
.gw-comments__list {
    display: block;

    width: 100%;
    max-width: 100%;
    min-width: 0;

    margin: 0;
    padding: 0;

    background:
        #fff;

    border:
        1px solid var(--gw-border);

    border-radius: 15px;

    overflow: hidden;
}


/*
 * WordPress 原生评论树
 */

#galwiki-comments-scope
.comment-list,
#galwiki-comments-scope
.children {
    width: 100%;
    max-width: 100%;
    min-width: 0;

    margin: 0;
    padding: 0;

    list-style: none;
}


#galwiki-comments-scope
.comment-list > li {
    width: 100%;
    max-width: 100%;
    min-width: 0;

    margin: 0;
    padding: 0;
}


/*
 * 子评论
 */

#galwiki-comments-scope
.children {
    margin-left: 30px;

    width:
        calc(100% - 30px);

    max-width:
        calc(100% - 30px);
}


#galwiki-comments-scope
.children .children {
    margin-left: 24px;

    width:
        calc(100% - 24px);

    max-width:
        calc(100% - 24px);
}


/* =========================================================
   14. Comment Item
   ========================================================= */

#galwiki-comments-scope
.gw-comment {
    position: relative;

    width: 100%;
    max-width: 100%;
    min-width: 0;

    margin: 0;
    padding: 20px;

    background:
        #fff;

    border-bottom:
        1px solid var(--gw-border-light);

    overflow: hidden;
}


#galwiki-comments-scope
.comment-list > li:last-child
> .gw-comment {
    border-bottom: 0;
}


#galwiki-comments-scope
.gw-comment__inner {
    display: flex;

    align-items: flex-start;

    width: 100%;
    max-width: 100%;
    min-width: 0;

    gap: 13px;
}


/* =========================================================
   15. Comment Avatar
   ========================================================= */

#galwiki-comments-scope
.gw-comment__avatar {
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    min-width: 42px;

    overflow: hidden;

    border-radius: 50%;
}


#galwiki-comments-scope
.gw-comment__avatar-image {
    display: block;

    width: 100% !important;
    max-width: none !important;

    height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    object-fit: cover !important;

    border: 0 !important;
    border-radius: 50% !important;

    box-shadow: none !important;
}


/* =========================================================
   16. Comment Main
   ========================================================= */

#galwiki-comments-scope
.gw-comment__main {
    flex: 1 1 auto;

    width: 0;
    max-width: 100%;
    min-width: 0;

    overflow: hidden;
}


/* =========================================================
   17. Comment Header
   ========================================================= */

#galwiki-comments-scope
.gw-comment__header {
    display: flex;

    align-items: center;
    justify-content: space-between;

    width: 100%;
    max-width: 100%;
    min-width: 0;

    gap: 10px;

    margin: 0 0 7px;
}


#galwiki-comments-scope
.gw-comment__author {
    display: flex;

    align-items: center;

    min-width: 0;

    gap: 6px;

    overflow: hidden;

    color:
        var(--gw-heading);

    font-size: 12px;
    font-weight: 700;

    line-height: 1.4;

    text-overflow: ellipsis;
    white-space: nowrap;
}


#galwiki-comments-scope
.gw-comment__self {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    flex: 0 0 auto;

    height: 18px;

    padding: 0 5px;

    background:
        var(--gw-primary-soft);

    border-radius: 5px;

    color:
        var(--gw-primary);

    font-size: 8px;
    font-weight: 600;
}


#galwiki-comments-scope
.gw-comment__date {
    flex: 0 0 auto;

    color:
        var(--gw-text-light);

    font-size: 9px;

    line-height: 1.4;

    white-space: nowrap;
}


/* =========================================================
   18. Comment Content
   ========================================================= */

#galwiki-comments-scope
.gw-comment__content {
    display: block;

    width: 100%;
    max-width: 100%;
    min-width: 0;

    margin: 0;
    padding: 0;

    color:
        var(--gw-text-secondary);

    font-size: 13px;

    line-height: 1.8;

    overflow-wrap: anywhere;
    word-break: break-word;

    white-space: normal;
}


/*
 * @用户名
 */

#galwiki-comments-scope
.gw-comment__mention {
    display: inline;

    margin-right: 5px;

    color:
        var(--gw-primary);

    font-weight: 700;

    overflow-wrap: anywhere;
    word-break: break-word;
}


/*
 * Content P
 */

#galwiki-comments-scope
.gw-comment__content p {
    margin: 0 0 8px;
    padding: 0;

    color: inherit;

    font-size: inherit;
    line-height: inherit;
}


#galwiki-comments-scope
.gw-comment__content p:last-child {
    margin-bottom: 0;
}


/*
 * Images
 */

#galwiki-comments-scope
.gw-comment__content img {
    display: inline-block;

    max-width: 100%;
    height: auto;

    margin: 3px 2px;

    border: 0;

    border-radius: 6px;

    vertical-align: middle;
}


/*
 * Sticker
 */

#galwiki-comments-scope
.gw-comment-sticker,
#galwiki-comments-scope
.gw-comment__content
img.gw-comment-sticker {
    display: inline-block !important;

    width: 58px !important;
    max-width: 58px !important;

    height: 58px !important;
    max-height: 58px !important;

    margin: 3px 2px !important;

    object-fit: contain !important;

    vertical-align: middle !important;

    border: 0 !important;
    border-radius: 7px !important;

    box-shadow: none !important;
}


/*
 * 防止代码/长链接撑开
 */

#galwiki-comments-scope
.gw-comment__content pre {
    max-width: 100%;

    overflow-x: auto;
}


#galwiki-comments-scope
.gw-comment__content a {
    overflow-wrap: anywhere;
    word-break: break-word;
}


/* =========================================================
   19. Comment Footer
   ========================================================= */

#galwiki-comments-scope
.gw-comment__footer {
    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 12px;

    margin: 9px 0 0;
}


#galwiki-comments-scope
.gw-comment__footer a,
#galwiki-comments-scope
.gw-comment__footer button {
    display: inline-flex;

    align-items: center;

    width: auto;

    margin: 0;
    padding: 0;

    background: transparent;

    border: 0;

    color:
        var(--gw-text-light);

    font-size: 10px;

    line-height: 1.4;

    text-decoration: none;

    cursor: pointer;
}


#galwiki-comments-scope
.gw-comment__footer a:hover,
#galwiki-comments-scope
.gw-comment__footer button:hover {
    background: transparent;

    color:
        var(--gw-primary);
}


/* =========================================================
   20. Reply Hierarchy
   ========================================================= */

/*
 * 第一层回复
 */

#galwiki-comments-scope
.gw-comment--reply {
    background:
        #fcfcff;

    border-radius: 10px;
}


/*
 * 子评论视觉引导线
 */

#galwiki-comments-scope
.children {
    position: relative;
}


#galwiki-comments-scope
.children::before {
    content: "";

    position: absolute;

    left: 9px;
    top: 4px;
    bottom: 4px;

    width: 1px;

    background:
        var(--gw-border-light);

    pointer-events: none;
}


/* =========================================================
   21. Empty
   ========================================================= */

#galwiki-comments-scope
.gw-comments__empty {
    display: block;

    width: 100%;

    padding: 35px 20px;

    background:
        #fff;

    border:
        1px solid var(--gw-border);

    border-radius: 15px;

    color:
        var(--gw-text-muted);

    font-size: 12px;
    line-height: 1.7;

    text-align: center;
}


/* =========================================================
   22. Pagination
   ========================================================= */

#galwiki-comments-scope
.gw-comments__pagination {
    display: flex;

    align-items: center;
    justify-content: center;

    flex-wrap: wrap;

    gap: 6px;

    width: 100%;

    margin: 18px 0 0;
    padding: 0;

    overflow-x: auto;
}


#galwiki-comments-scope
.gw-comments__pagination .page-numbers {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    flex: 0 0 auto;

    min-width: 32px;
    height: 32px;

    padding: 0 8px;

    background:
        #fff;

    border:
        1px solid var(--gw-border);

    border-radius: 8px;

    color:
        var(--gw-text-secondary);

    font-size: 10px;

    line-height: 1;

    text-decoration: none;

    transition:
        background .18s ease,
        border-color .18s ease,
        color .18s ease;
}


#galwiki-comments-scope
.gw-comments__pagination .page-numbers:hover {
    background:
        var(--gw-primary-soft);

    border-color:
        rgba(124,92,255,.15);

    color:
        var(--gw-primary);
}


#galwiki-comments-scope
.gw-comments__pagination .page-numbers.current {
    background:
        var(--gw-primary);

    border-color:
        var(--gw-primary);

    color:
        #fff;
}


/* =========================================================
   23. AJAX Message
   ========================================================= */

#galwiki-comments-scope
.gw-comments__message {
    display: none;

    width: 100%;

    margin: 10px 0 14px;
    padding: 10px 13px;

    border-radius: 9px;

    font-size: 11px;

    line-height: 1.6;
}


#galwiki-comments-scope
.gw-comments__message:empty {
    display: none;
}


#galwiki-comments-scope
.gw-comments__message.is-loading {
    display: block;

    color:
        var(--gw-text-muted);
}


#galwiki-comments-scope
.gw-comments__message.is-success {
    display: block;

    color: #26734d;

    background:
        #f0faf4;

    border:
        1px solid #d7f0df;
}


#galwiki-comments-scope
.gw-comments__message.is-error {
    display: block;

    color: #a33a3a;

    background:
        #fff5f5;

    border:
        1px solid #f3dada;
}


/* =========================================================
   24. New Comment
   ========================================================= */

.gw-comment--new {
    animation:
        gwCommentNew .8s ease;
}


@keyframes gwCommentNew {

    0% {
        background:
            rgba(124,92,255,.10);
    }

    100% {
        background:
            transparent;
    }

}


/* =========================================================
   25. Responsive 1050
   ========================================================= */

@media (max-width: 1050px) {

    .gw-wiki-main-layout {
        grid-template-columns:
            minmax(0, 1fr)
            220px;
    }


    .gw-wiki-recommend__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/* =========================================================
   26. Responsive 900
   ========================================================= */

@media (max-width: 900px) {

    .gw-wiki-main-layout {
        grid-template-columns:
            1fr;
    }


    .gw-wiki-author-sidebar {
        position: static;

        width: 100%;
        max-width: 100%;
    }


    .gw-wiki-recommend__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }


    #galwiki-comments-scope
    .gw-comment__inner {
        gap: 10px;
    }


    #galwiki-comments-scope
    .children {
        margin-left: 18px;

        width:
            calc(100% - 18px);

        max-width:
            calc(100% - 18px);
    }


    #galwiki-comments-scope
    .children .children {
        margin-left: 14px;

        width:
            calc(100% - 14px);

        max-width:
            calc(100% - 14px);
    }

}


/* =========================================================
   27. Responsive 620
   ========================================================= */

@media (max-width: 620px) {

    /*
     * Recommend
     */

    .gw-wiki-recommend {
        margin-top: 30px;
    }


    .gw-wiki-recommend__header {
        margin-bottom: 13px;
    }


    .gw-wiki-recommend__header h2 {
        font-size: 21px;
    }


    .gw-wiki-recommend__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 10px;
    }


    .gw-recommend-card__body {
        padding: 11px;
    }


    .gw-recommend-card__body h3 {
        font-size: 12px;
    }


    /*
     * Comments
     */

    #galwiki-comments-scope {
        margin-top: 34px;
    }


    #galwiki-comments-scope
    .gw-comments__title {
        font-size: 21px;
    }


    #galwiki-comments-scope
    .gw-comments-login {
        align-items: flex-start;

        flex-wrap: wrap;

        gap: 12px;

        padding: 16px;
    }


    #galwiki-comments-scope
    .gw-comments-login__content {
        width:
            calc(100% - 57px);
    }


    #galwiki-comments-scope
    .gw-comments-login__button {
        flex: 0 0 100%;

        width: 100%;
    }


    #galwiki-comments-scope
    .gw-comment-form {
        padding: 15px;
    }


    #galwiki-comments-scope
    .gw-comment-toolbar {
        align-items: flex-start;

        flex-direction: column;
    }


    #galwiki-comments-scope
    .gw-comment-toolbar__left,
    #galwiki-comments-scope
    .gw-comment-toolbar__right {
        width: 100%;
    }


    #galwiki-comments-scope
    .gw-comment-toolbar__right {
        justify-content: flex-end;
    }


    #galwiki-comments-scope
    .gw-comment-submit-wrap {
        justify-content: stretch;
    }


    #galwiki-comments-scope
    .gw-comment-submit {
        width: 100%;
    }


    /*
     * 评论卡片
     */

    #galwiki-comments-scope
    .gw-comment {
        padding: 15px;
    }


    #galwiki-comments-scope
    .gw-comment__avatar {
        flex-basis: 36px;

        width: 36px;
        height: 36px;

        min-width: 36px;
    }


    #galwiki-comments-scope
    .gw-comment__header {
        align-items: flex-start;

        flex-direction: column;

        gap: 3px;
    }


    #galwiki-comments-scope
    .gw-comment__date {
        white-space: normal;
    }


    /*
     * Sticker 手机端改成底部浮层
     */

    #galwiki-comments-scope
    .gw-sticker__panel {
        position: fixed;

        left: 12px;
        right: 12px;
        bottom: 12px;

        width: auto;
        max-width: none;

        max-height: 65vh;

        border-radius: 14px;
    }


    #galwiki-comments-scope
    .gw-sticker__grid {
        max-height:
            calc(65vh - 60px);
    }

}


/* =========================================================
   28. Responsive 400
   ========================================================= */

@media (max-width: 400px) {

    .gw-wiki-recommend__grid {
        grid-template-columns:
            1fr;
    }


    #galwiki-comments-scope
    .gw-comments__list {
        border-radius: 12px;
    }


    #galwiki-comments-scope
    .gw-comment {
        padding: 13px;
    }


    #galwiki-comments-scope
    .gw-comment__avatar {
        flex-basis: 34px;

        width: 34px;
        height: 34px;

        min-width: 34px;
    }


    #galwiki-comments-scope
    .gw-comment__author {
        font-size: 11px;
    }


    #galwiki-comments-scope
    .gw-comment__content {
        font-size: 12px;
    }


    #galwiki-comments-scope
    .gw-sticker__grid {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));
    }

}




/* =========================================================
   GalWiki Category Archive
   Modern Unified UI
   ---------------------------------------------------------
   保留现有功能：
   1. 分类标题
   2. 子分类筛选
   3. 标签筛选
   4. 排序 / 评分
   5. Wiki / Article 双模式
   6. Wiki 卡片
   7. Article 卡片
   8. 分页
   9. 空状态
   10. 移动端
   11. 旧版 class 兼容
   ========================================================= */


/* =========================================================
   00. Global
   ========================================================= */

.gw-category-page,
.gw-category-page * {
    box-sizing: border-box;
}

.gw-category-page {
    width: 100%;
    max-width: 100%;
    min-width: 0;

    color: var(--gw-text);

    overflow: visible;
}

.gw-category-container {
    width: 100%;
    max-width: 100%;
    min-width: 0;

    margin: 0 auto;
}


/* 防止文章内容 / 图片撑破分类页 */

.gw-category-page img,
.gw-category-page video,
.gw-category-page iframe {
    max-width: 100%;
}
/* =========================================================
   GalWiki Category Archive
   Modern Unified UI
   ---------------------------------------------------------
   保留现有功能：
   1. 分类标题
   2. 子分类筛选
   3. 标签筛选
   4. 排序 / 评分
   5. Wiki / Article 双模式
   6. Wiki 卡片
   7. Article 卡片
   8. 分页
   9. 空状态
   10. 移动端
   11. 旧版 class 兼容
   ========================================================= */


/* =========================================================
   00. Global
   ========================================================= */

.gw-category-page,
.gw-category-page * {
    box-sizing: border-box;
}

.gw-category-page {
    width: 100%;
    max-width: 100%;
    min-width: 0;

    color: var(--gw-text);

    overflow: visible;
}

.gw-category-container {
    width: 100%;
    max-width: 100%;
    min-width: 0;

    margin: 0 auto;
}


/* 防止文章内容 / 图片撑破分类页 */

.gw-category-page img,
.gw-category-page video,
.gw-category-page iframe {
    max-width: 100%;
}


/* =========================================================
   01. Header
   ========================================================= */

.gw-category-header {
    position: relative;

    width: 100%;
    max-width: 920px;

    margin: 0 auto;

    padding:
        52px
        28px
        28px;

    text-align: center;
}


/* 顶部细节线 */

.gw-category-header::before {
    content: "";

    display: block;

    width: 42px;
    height: 4px;

    margin: 0 auto 18px;

    background:
        linear-gradient(
            90deg,
            var(--gw-primary),
            rgba(124,92,255,.3)
        );

    border-radius: 999px;
}


/* Main */

.gw-category-header__main {
    display: flex;

    flex-direction: column;

    align-items: center;

    width: 100%;

    min-width: 0;
}


/* Label */

.gw-category-header__eyebrow,
.gw-category-header .gw-section-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    margin: 0 0 7px;

    color: var(--gw-primary);

    font-size: 10px;
    font-weight: 800;

    line-height: 1.2;

    letter-spacing: .18em;
}


/* Title */

.gw-category-header h1,
.gw-category-header__title {
    margin: 0;

    color: var(--gw-heading);

    font-size: 38px;
    font-weight: 850;

    line-height: 1.2;

    letter-spacing: -.035em;
}


/* Description */

.gw-category-header__description {
    width: 100%;
    max-width: 720px;

    margin:
        13px auto
        0;

    color: var(--gw-text-muted);

    font-size: 13px;

    line-height: 1.85;
}

.gw-category-header__description p {
    margin: 0 0 7px;
}

.gw-category-header__description p:last-child {
    margin-bottom: 0;
}


/* Count */

.gw-category-header__count {
    display: inline-flex;

    align-items: baseline;

    justify-content: center;

    gap: 6px;

    margin-top: 14px;

    color: var(--gw-text-light);

    font-size: 10px;

    white-space: nowrap;
}

.gw-category-header__count strong {
    color: var(--gw-primary);

    font-size: 20px;
    font-weight: 800;
}


/* =========================================================
   02. View Switch
   ========================================================= */

.gw-category-view-switch {
    display: inline-flex;

    align-items: center;

    gap: 3px;

    margin-top: 18px;

    padding: 4px;

    background:
        rgba(245,245,248,.8);

    border: 1px solid var(--gw-border);

    border-radius: 11px;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.9);
}

.gw-category-view-switch__item {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    min-width: 76px;
    height: 34px;

    padding: 0 13px;

    border-radius: 8px;

    color: var(--gw-text-light);

    font-size: 10px;
    font-weight: 700;

    line-height: 1;

    text-decoration: none;

    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

.gw-category-view-switch__item:hover {
    color: var(--gw-heading);
}

.gw-category-view-switch__item.is-active {
    background: #fff;

    color: var(--gw-primary);

    box-shadow:
        0 3px 10px rgba(20,24,40,.08);
}


/* =========================================================
   03. Filter
   ========================================================= */

.gw-category-filter {
    width: 100%;
    max-width: 1040px;

    margin:
        0 auto 28px;

    padding:
        0;

    background: #fff;

    border:
        1px solid var(--gw-border);

    border-radius: 17px;

    box-shadow:
        0 4px 18px rgba(20,24,40,.035);

    overflow: hidden;
}


/* Header */

.gw-category-filter__top {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 20px;

    padding:
        17px 20px;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fafafd 100%
        );

    border-bottom:
        1px solid var(--gw-border-light);
}

.gw-category-filter__top > div:first-child {
    display: flex;

    flex-direction: column;

    gap: 3px;

    min-width: 0;
}

.gw-category-filter__top strong {
    color: var(--gw-heading);

    font-size: 13px;
    font-weight: 800;
}

.gw-category-filter__top span {
    color: var(--gw-text-light);

    font-size: 9px;

    line-height: 1.5;
}


/* Rows */

.gw-category-filter__row {
    display: flex;

    align-items: flex-start;

    width: 100%;
    min-width: 0;

    gap: 20px;

    padding:
        15px 20px;

    background: #fff;
}

.gw-category-filter__row + .gw-category-filter__row {
    border-top:
        1px solid var(--gw-border-light);
}
.gw-category-filter__row--root-category { position: relative; z-index: 2; background: #fff; }
.gw-category-filter__row--category { margin-top: 6px; padding-top: 10px; border-top: 1px dashed var(--gw-border); background: var(--gw-bg-soft); }


/* Label */

.gw-category-filter__label {
    flex: 0 0 52px;

    padding-top: 6px;

    color: var(--gw-text-muted);

    font-size: 10px;
    font-weight: 800;

    line-height: 1.4;

    white-space: nowrap;
}


/* Options */

.gw-category-filter__options,
.gw-category-filter__chips {
    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 7px;

    flex: 1 1 auto;

    min-width: 0;
}


/* Chips */

.gw-category-filter__option,
.gw-category-chip {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    min-height: 31px;

    padding: 0 12px;

    background:
        #fafafd;

    border:
        1px solid var(--gw-border-light);

    border-radius: 9px;

    color:
        var(--gw-text-secondary);

    font-size: 10px;
    font-weight: 600;

    line-height: 1;

    text-decoration: none;

    white-space: nowrap;

    transition:
        background .18s ease,
        color .18s ease,
        border-color .18s ease,
        transform .18s ease,
        box-shadow .18s ease;
}

.gw-category-filter__option:hover,
.gw-category-chip:hover {
    background:
        #fff;

    border-color:
        rgba(124,92,255,.22);

    color:
        var(--gw-primary);

    transform:
        translateY(-1px);

    box-shadow:
        0 4px 10px rgba(124,92,255,.07);
}

.gw-category-filter__option.is-active,
.gw-category-chip.is-active {
    background:
        var(--gw-primary);

    border-color:
        var(--gw-primary);

    color:
        #fff;

    box-shadow:
        0 5px 14px rgba(124,92,255,.18);
}

.gw-category-filter__option.is-active:hover,
.gw-category-chip.is-active:hover {
    background:
        var(--gw-primary-hover);

    border-color:
        var(--gw-primary-hover);

    color:
        #fff;
}

.gw-category-chip small {
    margin-left: 5px;

    opacity: .65;

    font-size: 8px;
}


/* =========================================================
   04. Filter Controls
   ========================================================= */

.gw-category-filter__controls {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 15px;

    padding:
        14px 20px;

    background:
        #fafafd;

    border-top:
        1px solid var(--gw-border-light);
}


/* Sort */

.gw-category-sort {
    display: flex;

    align-items: center;

    gap: 8px;
}

.gw-category-sort label {
    color: var(--gw-text-muted);

    font-size: 10px;
    font-weight: 600;
}


/* Select */

.gw-category-select {
    min-width: 145px;
    height: 34px;

    padding:
        0 32px 0 11px;

    background:
        #fff;

    border:
        1px solid var(--gw-border);

    border-radius:
        9px;

    color:
        var(--gw-text-secondary);

    font-family:
        var(--gw-font);

    font-size:
        10px;

    outline: none;

    cursor: pointer;

    transition:
        border-color .18s ease,
        box-shadow .18s ease;
}

.gw-category-select:hover {
    border-color:
        rgba(124,92,255,.2);
}

.gw-category-select:focus {
    border-color:
        rgba(124,92,255,.38);

    box-shadow:
        0 0 0 3px rgba(124,92,255,.07);
}


/* =========================================================
   05. Results Header
   ========================================================= */

.gw-category-results-head,
.gw-category-content__top {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 15px;

    width: 100%;

    margin:
        0 0 15px;

    padding:
        0 2px;
}

.gw-category-results-head > div,
.gw-category-content__top > div {
    display: flex;

    align-items: baseline;

    gap: 6px;

    min-width: 0;
}

.gw-category-results-head strong {
    color: var(--gw-heading);

    font-size: 13px;
    font-weight: 800;
}

.gw-category-results-head span,
.gw-category-content__count {
    color: var(--gw-text-light);

    font-size: 10px;
}

.gw-category-results-mode,
.gw-category-content__mode {
    color: var(--gw-primary);

    font-size: 9px;
    font-weight: 800;

    letter-spacing: .12em;

    white-space: nowrap;
}


/* =========================================================
   06. Wiki List
   ========================================================= */

.gw-category-list--wiki,
.gw-category-wiki-list {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0,1fr));

    gap: 16px;

    width: 100%;
    min-width: 0;
}


/* Wiki Card */

.gw-category-wiki-item,
.gw-category-wiki-card {
    position: relative;

    display: flex;

    min-width: 0;

    overflow: hidden;

    background:
        #fff;

    border:
        1px solid var(--gw-border);

    border-radius:
        15px;

    box-shadow:
        0 2px 8px rgba(20,24,40,.025);

    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease;
}

.gw-category-wiki-item:hover,
.gw-category-wiki-card:hover {
    transform:
        translateY(-3px);

    border-color:
        rgba(124,92,255,.18);

    box-shadow:
        0 12px 28px rgba(20,24,40,.065);
}


/* Wiki Mark */

.gw-category-wiki-item__mark {
    display: flex;

    align-items: center;
    justify-content: center;

    flex: 0 0 43px;

    width: 43px;
    height: 23px;

    margin:
        15px 0 0 15px;

    background:
        var(--gw-primary-soft);

    border-radius:
        6px;

    color:
        var(--gw-primary);

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        .08em;
}


/* Wiki Cover */

.gw-category-wiki-card__cover,
.gw-category-wiki-item__cover {
    display: block;

    overflow: hidden;

    background:
        var(--gw-primary-soft);

    text-decoration: none;
}

.gw-category-wiki-card__cover {
    flex:
        0 0 145px;

    width:
        145px;

    min-height:
        145px;
}

.gw-category-wiki-item__cover {
    flex:
        0 0 190px;

    width:
        190px;

    min-height:
        140px;

    margin:
        15px 0 15px 15px;

    aspect-ratio:
        16 / 10;

    border-radius:
        10px;
}

.gw-category-wiki-card__cover img,
.gw-category-wiki-item__cover img {
    display: block;

    width: 100%;
    height: 100%;

    max-width: none;

    margin: 0;
    padding: 0;

    object-fit: cover;

    transition:
        transform .35s ease;
}

.gw-category-wiki-card:hover
.gw-category-wiki-card__cover img,
.gw-category-wiki-item:hover
.gw-category-wiki-item__cover img {
    transform:
        scale(1.05);
}

.gw-category-wiki-card__cover span,
.gw-category-wiki-item__cover span {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 100%;
    height: 100%;

    color:
        rgba(124,92,255,.34);

    font-size:
        24px;

    font-weight:
        800;
}


/* Wiki Body */

.gw-category-wiki-card__body,
.gw-category-wiki-item__body,
.gw-category-wiki-item__main {
    display: flex;

    flex-direction: column;

    flex:
        1 1 auto;

    min-width: 0;

    padding:
        15px;
}

.gw-category-wiki-item__body {
    padding-left: 0;
}


/* Meta */

.gw-category-wiki-card__meta,
.gw-category-wiki-item__meta {
    display: flex;

    align-items: center;
    flex-wrap: wrap;

    gap:
        6px;

    margin-bottom:
        6px;

    color:
        var(--gw-text-light);

    font-size:
        9px;
}

.gw-category-wiki-card__category,
.gw-category-wiki-item__category,
.gw-category-wiki-item__meta span:first-child {
    color:
        var(--gw-primary);

    font-weight:
        700;
}


/* Title */

.gw-category-wiki-card__title,
.gw-category-wiki-item h2 {
    margin:
        0;

    color:
        var(--gw-heading);

    font-size:
        16px;

    font-weight:
        750;

    line-height:
        1.5;
}

.gw-category-wiki-item h2 {
    font-size:
        18px;
}

.gw-category-wiki-card__title a,
.gw-category-wiki-item h2 a {
    color:
        var(--gw-heading);

    text-decoration:
        none;
}

.gw-category-wiki-card__title a {
    display:
        -webkit-box;

    overflow:
        hidden;

    -webkit-box-orient:
        vertical;

    -webkit-line-clamp:
        2;
}

.gw-category-wiki-card__title a:hover,
.gw-category-wiki-item h2 a:hover {
    color:
        var(--gw-primary);
}


/* Excerpt */

.gw-category-wiki-card__excerpt,
.gw-category-wiki-item__excerpt,
.gw-category-wiki-item p {
    display:
        -webkit-box;

    overflow:
        hidden;

    margin:
        8px 0 0;

    color:
        var(--gw-text-secondary);

    font-size:
        11px;

    line-height:
        1.75;

    -webkit-box-orient:
        vertical;

    -webkit-line-clamp:
        3;
}

.gw-category-wiki-card__excerpt {
    margin-bottom:
        9px;
}


/* Footer */

.gw-category-wiki-card__footer,
.gw-category-wiki-item__footer {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        8px;

    margin-top:
        auto;

    padding-top:
        9px;

    color:
        var(--gw-text-light);

    font-size:
        9px;
}

.gw-category-wiki-item__meta {
    margin-top:
        auto;

    margin-bottom:
        0;
}

.gw-category-rating {
    color:
        #d2942d !important;

    font-weight:
        700;
}


/* Arrow */

.gw-category-wiki-item__arrow {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    flex:
        0 0 31px;

    width:
        31px;

    height:
        31px;

    margin:
        15px 14px 0 0;

    border-radius:
        8px;

    color:
        var(--gw-text-light);

    font-size:
        17px;

    text-decoration:
        none;

    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease;
}

.gw-category-wiki-item:hover
.gw-category-wiki-item__arrow {
    background:
        var(--gw-primary-soft);

    color:
        var(--gw-primary);

    transform:
        translateX(2px);
}


/* =========================================================
   07. Article Grid
   ========================================================= */

.gw-category-article-grid {
    display: grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:
        18px;

    width:
        100%;

    min-width:
        0;
}


/* Article Card */

.gw-category-article-card {
    display:
        flex;

    flex-direction:
        column;

    min-width:
        0;

    overflow:
        hidden;

    background:
        #fff;

    border:
        1px solid var(--gw-border);

    border-radius:
        15px;

    box-shadow:
        0 2px 8px rgba(20,24,40,.025);

    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease;
}

.gw-category-article-card:hover {
    transform:
        translateY(-4px);

    border-color:
        rgba(124,92,255,.17);

    box-shadow:
        0 14px 32px rgba(20,24,40,.08);
}


/* Cover */

.gw-category-article-card__cover,
.gw-category-article-card__image {
    position:
        relative;

    display:
        block;

    width:
        100%;

    aspect-ratio:
        16 / 9;

    overflow:
        hidden;

    background:
        var(--gw-primary-soft);

    text-decoration:
        none;
}

.gw-category-article-card__cover img,
.gw-category-article-card__image img {
    display:
        block;

    width:
        100% !important;

    max-width:
        none !important;

    height:
        100% !important;

    margin:
        0 !important;

    padding:
        0 !important;

    object-fit:
        cover;

    transition:
        transform .35s ease;
}

.gw-category-article-card:hover
.gw-category-article-card__cover img,
.gw-category-article-card:hover
.gw-category-article-card__image img {
    transform:
        scale(1.045);
}

.gw-category-article-card__cover span,
.gw-category-article-card__cover-placeholder,
.gw-category-article-card__image span {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        100%;

    height:
        100%;

    color:
        rgba(124,92,255,.38);

    font-size:
        12px;

    font-weight:
        800;

    letter-spacing:
        .12em;
}


/* Body */

.gw-category-article-card__body {
    display:
        flex;

    flex-direction:
        column;

    flex:
        1;

    min-width:
        0;

    padding:
        15px;
}


/* Meta */

.gw-category-article-card__eyebrow,
.gw-category-article-card__meta {
    display:
        flex;

    align-items:
        center;

    flex-wrap:
        wrap;

    gap:
        6px;

    margin-bottom:
        7px;

    color:
        var(--gw-primary);

    font-size:
        9px;

    font-weight:
        700;
}

.gw-category-article-card__meta {
    margin-bottom:
        0;

    color:
        var(--gw-text-light);

    font-weight:
        400;
}


/* Title */

.gw-category-article-card h2,
.gw-category-article-card__title {
    margin:
        0;

    color:
        var(--gw-heading);

    font-size:
        15px;

    font-weight:
        750;

    line-height:
        1.55;
}

.gw-category-article-card h2 a,
.gw-category-article-card__title a {
    display:
        -webkit-box;

    overflow:
        hidden;

    color:
        var(--gw-heading);

    text-decoration:
        none;

    -webkit-box-orient:
        vertical;

    -webkit-line-clamp:
        2;
}

.gw-category-article-card h2 a:hover,
.gw-category-article-card__title a:hover {
    color:
        var(--gw-primary);
}


/* Excerpt */

.gw-category-article-card__excerpt {
    display:
        -webkit-box;

    overflow:
        hidden;

    margin:
        8px 0 0;

    color:
        var(--gw-text-muted);

    font-size:
        10px;

    line-height:
        1.75;

    -webkit-box-orient:
        vertical;

    -webkit-line-clamp:
        3;
}


/* Footer */

.gw-category-article-card__footer {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        10px;

    margin-top:
        auto;

    padding-top:
        12px;

    color:
        var(--gw-text-light);

    font-size:
        9px;

    border-top:
        1px solid var(--gw-border-light);
}

.gw-category-article-card__author {
    color:
        var(--gw-text-secondary);

    font-weight:
        600;
}


/* =========================================================
   08. Empty
   ========================================================= */

.gw-category-empty {
    display:
        flex;

    flex-direction:
        column;

    align-items:
        center;

    justify-content:
        center;

    width:
        100%;

    min-height:
        280px;

    padding:
        55px 25px;

    text-align:
        center;

    background:
        #fff;

    border:
        1px solid var(--gw-border);

    border-radius:
        16px;

    box-shadow:
        0 2px 10px rgba(20,24,40,.025);
}

.gw-category-empty__icon {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        55px;

    height:
        55px;

    margin:
        0 auto 14px;

    background:
        var(--gw-primary-soft);

    border-radius:
        15px;

    color:
        var(--gw-primary);

    font-size:
        23px;
}

.gw-category-empty h2 {
    margin:
        0 0 6px;

    color:
        var(--gw-heading);

    font-size:
        18px;
}

.gw-category-empty p {
    max-width:
        430px;

    margin:
        0;

    color:
        var(--gw-text-light);

    font-size:
        11px;

    line-height:
        1.7;
}

.gw-category-empty .gw-button,
.gw-category-empty__button {
    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-width:
        92px;

    height:
        35px;

    margin-top:
        18px;

    padding:
        0 16px;

    background:
        var(--gw-primary);

    border-radius:
        9px;

    color:
        #fff;

    font-size:
        10px;

    font-weight:
        600;

    text-decoration:
        none;

    transition:
        transform .2s ease,
        background .2s ease;
}

.gw-category-empty .gw-button:hover,
.gw-category-empty__button:hover {
    background:
        var(--gw-primary-hover);

    color:
        #fff;

    transform:
        translateY(-1px);
}


/* =========================================================
   09. Pagination
   ========================================================= */

.gw-category-pagination {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    flex-wrap:
        wrap;

    gap:
        6px;

    width:
        100%;

    margin:
        26px 0 10px;
}

.gw-category-pagination .page-numbers {
    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-width:
        35px;

    height:
        35px;

    padding:
        0 10px;

    background:
        #fff;

    border:
        1px solid var(--gw-border);

    border-radius:
        9px;

    color:
        var(--gw-text-secondary);

    font-size:
        10px;

    line-height:
        1;

    text-decoration:
        none;

    transition:
        background .18s ease,
        border-color .18s ease,
        color .18s ease,
        transform .18s ease;
}

.gw-category-pagination .page-numbers:hover {
    background:
        var(--gw-primary-soft);

    border-color:
        rgba(124,92,255,.18);

    color:
        var(--gw-primary);

    transform:
        translateY(-1px);
}

.gw-category-pagination .page-numbers.current {
    background:
        var(--gw-primary);

    border-color:
        var(--gw-primary);

    color:
        #fff;

    box-shadow:
        0 5px 12px rgba(124,92,255,.16);
}


/* =========================================================
   10. Old Navigation Compatibility
   ========================================================= */

.gw-category-nav {
    width:
        100%;

    margin-bottom:
        20px;

    overflow:
        hidden;

    background:
        #fff;

    border:
        1px solid var(--gw-border);

    border-radius:
        12px;
}

.gw-category-nav__scroll {
    display:
        flex;

    align-items:
        center;

    gap:
        6px;

    width:
        100%;

    padding:
        7px;

    overflow-x:
        auto;

    scrollbar-width:
        none;
}

.gw-category-nav__scroll::-webkit-scrollbar {
    display:
        none;
}

.gw-category-nav__item {
    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    flex:
        0 0 auto;

    min-width:
        60px;

    height:
        32px;

    padding:
        0 12px;

    border-radius:
        8px;

    color:
        var(--gw-text-secondary);

    font-size:
        10px;

    font-weight:
        600;

    text-decoration:
        none;

    white-space:
        nowrap;
}

.gw-category-nav__item:hover {
    background:
        var(--gw-primary-soft);

    color:
        var(--gw-primary);
}

.gw-category-nav__item.is-current {
    background:
        var(--gw-primary);

    color:
        #fff;
}


/* =========================================================
   11. Layout Safety
   ========================================================= */

/*
 * 防止分类卡片把主题外层 Grid 撑坏。
 */

.gw-category-page,
.gw-category-container,
.gw-category-filter,
.gw-category-list--wiki,
.gw-category-wiki-list,
.gw-category-article-grid,
.gw-category-article-card,
.gw-category-wiki-item {
    min-width:
        0;
    max-width:
        100%;
}


/* 超长标题 / URL */

.gw-category-page h1,
.gw-category-page h2,
.gw-category-page h3,
.gw-category-page a,
.gw-category-page span {
    overflow-wrap:
        anywhere;
}


/* =========================================================
   12. Tablet
   ========================================================= */

@media (max-width: 1050px) {

    .gw-category-header {
        max-width:
            820px;
    }


    .gw-category-article-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .gw-category-list--wiki,
    .gw-category-wiki-list {
        grid-template-columns:
            1fr;
    }

}


/* =========================================================
   13. Tablet Small
   ========================================================= */

@media (max-width: 820px) {

    .gw-category-header {
        padding:
            42px 22px 24px;
    }


    .gw-category-header h1,
    .gw-category-header__title {
        font-size:
            32px;
    }


    .gw-category-filter__top {
        align-items:
            flex-start;

        flex-direction:
            column;

        gap:
            10px;
    }


    .gw-category-filter__controls {
        align-items:
            flex-start;

        flex-direction:
            column;
    }


    .gw-category-view-switch {
        margin-top:
            12px;
    }


    .gw-category-wiki-item {
        gap:
            13px;
    }

}


/* =========================================================
   14. Mobile
   ========================================================= */

@media (max-width: 620px) {

    .gw-category-header {
        padding:
            30px 15px 22px;
    }


    .gw-category-header::before {
        width:
            34px;

        height:
            3px;

        margin-bottom:
            15px;
    }


    .gw-category-header__eyebrow,
    .gw-category-header .gw-section-label {
        font-size:
            9px;
    }


    .gw-category-header h1,
    .gw-category-header__title {
        font-size:
            27px;
    }


    .gw-category-header__description {
        margin-top:
            10px;

        font-size:
            11px;
    }


    .gw-category-header__count {
        margin-top:
            11px;
    }


    .gw-category-view-switch {
        width:
            100%;

        margin-top:
            15px;
    }


    .gw-category-view-switch__item {
        flex:
            1 1 50%;

        min-width:
            0;
    }


    /* Filter */

    .gw-category-filter {
        margin-bottom:
            22px;

        border-radius:
            14px;
    }


    .gw-category-filter__top {
        padding:
            14px;
    }


    .gw-category-filter__row {
        flex-direction:
            column;

        gap:
            8px;

        padding:
            13px 14px;
    }


    .gw-category-filter__label {
        flex:
            none;

        padding-top:
            0;
    }


    .gw-category-filter__options,
    .gw-category-filter__chips {
        width:
            100%;
    }


    .gw-category-filter__controls {
        padding:
            13px 14px;
    }


    .gw-category-sort {
        width:
            100%;
    }


    .gw-category-select {
        flex:
            1;

        width:
            100%;
    }


    /* Results */

    .gw-category-results-head,
    .gw-category-content__top {
        align-items:
            flex-start;

        flex-direction:
            column;

        gap:
            5px;

        padding:
            0;
    }


    /* Wiki */

    .gw-category-list--wiki,
    .gw-category-wiki-list {
        grid-template-columns:
            1fr;
    }


    .gw-category-wiki-card {
        display:
            flex;
    }


    .gw-category-wiki-card__cover {
        flex:
            0 0 112px;

        width:
            112px;

        min-height:
            122px;
    }


    .gw-category-wiki-card__body {
        padding:
            12px;
    }


    .gw-category-wiki-card__title {
        font-size:
            14px;
    }


    .gw-category-wiki-card__excerpt {
        font-size:
            10px;

        -webkit-line-clamp:
            2;
    }


    .gw-category-wiki-item {
        display:
            flex;

        flex-direction:
            column;

        gap:
            0;

        padding:
            13px;
    }


    .gw-category-wiki-item__cover {
        width:
            100%;

        min-height:
            0;

        margin:
            0 0 12px;

        aspect-ratio:
            16 / 9;
    }


    .gw-category-wiki-item__body,
    .gw-category-wiki-item__main {
        padding:
            0;
    }


    .gw-category-wiki-item__mark {
        margin:
            0 0 7px;
    }


    .gw-category-wiki-item h2 {
        font-size:
            16px;
    }


    .gw-category-wiki-item__arrow {
        display:
            none;
    }


    /* Article */

    .gw-category-article-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap:
            12px;
    }


    .gw-category-article-card__body {
        padding:
            11px;
    }


    .gw-category-article-card h2,
    .gw-category-article-card__title {
        font-size:
            13px;
    }


    .gw-category-article-card__excerpt {
        font-size:
            9px;

        -webkit-line-clamp:
            2;
    }


    .gw-category-article-card__footer {
        padding-top:
            10px;

        font-size:
            8px;
    }


    /* Pagination */

    .gw-category-pagination {
        margin-top:
            20px;
    }

}


/* =========================================================
   15. Small Mobile
   ========================================================= */

@media (max-width: 420px) {

    .gw-category-header {
        padding-left:
            12px;

        padding-right:
            12px;
    }


    .gw-category-header h1,
    .gw-category-header__title {
        font-size:
            25px;
    }


    .gw-category-filter__option,
    .gw-category-chip {
        min-height:
            29px;

        padding:
            0 9px;

        font-size:
            9px;
    }


    .gw-category-article-grid {
        gap:
            10px;
    }


    .gw-category-article-card__body {
        padding:
            9px;
    }


    .gw-category-article-card h2,
    .gw-category-article-card__title {
        font-size:
            12px;
    }


    .gw-category-wiki-card__cover {
        flex-basis:
            100px;

        width:
            100px;

        min-height:
            112px;
    }


    .gw-category-wiki-card__footer {
        display:
            none;
    }

}


/* =========================================================
   16. Tiny Mobile
   ========================================================= */

@media (max-width: 360px) {

    .gw-category-header h1,
    .gw-category-header__title {
        font-size:
            23px;
    }


    .gw-category-article-grid {
        grid-template-columns:
            1fr;
    }


    .gw-category-filter__option,
    .gw-category-chip {
        padding:
            0 8px;

        font-size:
            9px;
    }

}


/* =========================================================
   Article Page Mobile Layout Repair
   Keep article cards fluid when legacy responsive rules overlap.
   ========================================================= */

@media (max-width: 767px) {

    .gw-wiki-single .gw-container {
        width: min(calc(100% - 24px), var(--gw-container-width));
    }

    .gw-wiki-single .gw-wiki-main-layout {
        display: block;
        width: 100%;
    }

    .gw-wiki-single .gw-wiki-main,
    .gw-wiki-single .gw-wiki-main-layout > * {
        width: 100%;
        min-width: 0;
        max-width: 100%;
    }

    .gw-wiki-single .gw-wiki-hero-card {
        display: flex;
        flex-direction: column;
        width: 100%;
        min-width: 0;
        max-width: 100%;
    }

    .gw-wiki-single .gw-wiki-hero__cover,
    .gw-wiki-single .gw-wiki-hero__info,
    .gw-wiki-single .gw-wiki-content,
    .gw-wiki-single .gw-wiki-recommend,
    .gw-wiki-single #galwiki-comments-scope {
        width: 100%;
        min-width: 0;
        max-width: 100%;
    }

    .gw-wiki-single .gw-wiki-hero__cover {
        height: auto;
        min-height: 0;
        max-height: none;
        aspect-ratio: 16 / 9;
    }

    .gw-wiki-single .gw-wiki-hero__image {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .gw-wiki-single .gw-wiki-content__body {
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .gw-wiki-single .gw-wiki-content__body img,
    .gw-wiki-single .gw-wiki-content__body iframe,
    .gw-wiki-single .gw-wiki-content__body video {
        width: auto;
        max-width: 100%;
        height: auto;
    }

    .gw-wiki-single .gw-wiki-author-sidebar {
        display: none;
    }
}

/* Galgame Rating plugin integration */
.gw-wiki-hero__rating,
.gw-category-rating,
#galwiki-comments-scope .gw-comment__rating {
    color: #d2942d;
    font-weight: 700;
    white-space: nowrap;
}

.gw-wiki-hero__rating small {
    color: var(--gw-text-muted);
    font-size: .9em;
    font-weight: 500;
}

.gw-wiki-hero__title-rating {
    display: inline-flex;
    vertical-align: middle;
    align-items: center;
    margin-left: 10px;
    padding: 3px 9px;
    border-radius: 999px;
    background: #fff4d7;
    color: #a56e0d;
    font-size: .42em;
    font-weight: 800;
    letter-spacing: 0;
    white-space: nowrap;
}

.gw-rating-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    color: #a56e0d;
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
}

.gw-home-game-card__rating { margin-top: 10px; }
.gw-home-content-item__rating { margin-left: 7px; font-size: 11px; }

/* Improve archive readability and keep the category index in three rows. */
.gw-search-page .gw-search-results,
.gw-category-page .gw-category-results { font-size: 16px; }
.gw-search-page .gw-category-wiki-item h2,
.gw-search-page .gw-category-article-card__title,
.gw-category-page .gw-category-wiki-item h2,
.gw-category-page .gw-category-article-card h2 { font-size: 20px; }
.gw-search-page .gw-category-wiki-item__excerpt,
.gw-search-page .gw-category-article-card__excerpt,
.gw-category-page .gw-category-wiki-item p { font-size: 14px; line-height: 1.75; }
.gw-category-filter__row--tags { display: none; }

.gw-wiki-action--rating {
    background: #fff8e8;
    border: 1px solid rgba(210, 148, 45, .28);
    color: #a56e0d;
}

.gw-wiki-action--rating:hover {
    background: #f8e6ba;
    color: #805207;
}

/* Release versions, calendar entry and spoiler notices. */
.gw-header__calendar-link{margin-left:13px;color:var(--gw-text-secondary);font-size:13px;font-weight:700;text-decoration:none;white-space:nowrap}.gw-header__calendar-link:hover,.gw-mobile-menu__calendar-link:hover{color:var(--gw-primary)}.gw-mobile-menu__calendar-link{display:block;margin:10px 0 0;padding:12px 14px;color:var(--gw-text-secondary);font-weight:700;text-decoration:none}.gw-release-list{margin:30px 0;padding:22px;background:#fbfcfd;border:1px solid var(--gw-border);border-radius:8px}.gw-release-list__heading{display:flex;align-items:end;justify-content:space-between;gap:14px;margin-bottom:15px}.gw-release-list__heading p{margin:0 0 4px;color:var(--gw-primary);font-size:11px;font-weight:800;letter-spacing:.12em}.gw-release-list__heading h2{margin:0;color:var(--gw-heading);font-size:21px}.gw-release-list__heading a{color:var(--gw-primary);font-size:13px;font-weight:700;text-decoration:none}.gw-release-list__rows{display:grid;gap:9px}.gw-release-row{display:grid;grid-template-columns:minmax(150px,.9fr) minmax(160px,1fr);gap:8px 16px;padding:15px;border:1px solid #e8ebef;border-radius:6px;background:#fff}.gw-release-row>div{display:flex;flex-direction:column;gap:5px}.gw-release-row strong{color:var(--gw-heading)}.gw-release-row span,.gw-release-row p{margin:0;color:var(--gw-text-muted);font-size:13px}.gw-release-row p,.gw-release-row__related{grid-column:1/-1}.gw-release-row__related{color:var(--gw-primary);font-size:13px;text-decoration:none}.gw-release-status{display:inline-flex;align-self:flex-start;padding:3px 7px;border-radius:999px;background:#eef1f5;color:#56606d;font-size:11px;font-weight:800}.gw-release-status.is-released{background:#e8f6ee;color:#297145}.gw-release-status.is-delayed{background:#fff2df;color:#a66211}.gw-release-status.is-cancelled{background:#fff0f1;color:#af4a55}.gw-spoiler{margin:15px 0;border:1px solid #e6d8aa;border-left:3px solid #c69a28;border-radius:6px;background:#fffaf0}.gw-spoiler--heavy{border-color:#e7c8cf;border-left-color:#b95867;background:#fff6f7}.gw-spoiler__notice{display:block;padding:10px 13px;color:#725719;font-size:13px;font-weight:800}.gw-spoiler--heavy .gw-spoiler__notice{color:#974452}.gw-spoiler__content{padding:0 13px 13px}.gw-spoiler summary{display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;list-style:none}.gw-spoiler summary::-webkit-details-marker{display:none}.gw-spoiler summary>span:last-child{padding:3px 7px;border-radius:4px;background:rgba(144,105,15,.09);font-size:11px}.gw-comment-spoiler-field{display:flex;align-items:center;gap:8px;margin-bottom:10px;color:var(--gw-text-muted);font-size:12px;font-weight:700}.gw-comment-spoiler-field select{padding:5px 7px;border:1px solid var(--gw-border);border-radius:5px;background:#fff;color:var(--gw-text-secondary);font:inherit}.gw-user-profile__preferences{display:grid;gap:10px;margin:20px 0;padding:16px;border:1px solid var(--gw-border);border-radius:7px}.gw-user-profile__preferences legend{padding:0 5px;color:var(--gw-heading);font-weight:800}.gw-user-profile__preferences p{margin:0;color:var(--gw-text-muted);font-size:13px}.gw-user-profile__preferences label{display:flex;align-items:center;gap:8px;margin:0;font-weight:500}
@media(max-width:860px){.gw-header__calendar-link{display:none}.gw-release-row{grid-template-columns:1fr}.gw-release-row p,.gw-release-row__related{grid-column:auto}}

/* Built-in rating page */
.gw-rating-page { padding: 54px 0 80px; }
.gw-rating-panel { max-width: 780px; margin: 0 auto; padding: 36px; background: #fff; border: 1px solid var(--gw-border); border-radius: 22px; box-shadow: 0 18px 55px rgba(31, 24, 53, .08); }
.gw-rating-back { color: var(--gw-text-muted); font-size: 13px; text-decoration: none; }
.gw-rating-back:hover { color: var(--gw-primary); }
.gw-rating-heading { margin: 30px 0 24px; }
.gw-rating-heading p { margin: 0 0 7px; color: var(--gw-primary); font-size: 11px; font-weight: 800; letter-spacing: .14em; }
.gw-rating-heading h1 { margin: 0; color: var(--gw-heading); font-size: clamp(25px, 4vw, 36px); line-height: 1.25; }
.gw-rating-overview { display: grid; grid-template-columns: 180px minmax(0,1fr); gap: 34px; align-items: center; margin-bottom: 28px; padding: 25px; background: linear-gradient(135deg, #fff9e9, #fbf8ff); border-radius: 16px; }
.gw-rating-score { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px; color: #a56e0d; }
.gw-rating-score strong { font-size: 54px; line-height: 1; letter-spacing: -.06em; }.gw-rating-score span { font-size: 16px; }.gw-rating-score small { width: 100%; color: var(--gw-text-muted); font-size: 12px; }
.gw-rating-dimensions { display: grid; gap: 10px; }.gw-rating-dimensions div { display: grid; grid-template-columns: 42px 1fr 32px; gap: 10px; align-items: center; font-size: 12px; }.gw-rating-dimensions i { height: 7px; overflow: hidden; background: rgba(124,92,255,.12); border-radius: 999px; }.gw-rating-dimensions b { display: block; height: 100%; background: linear-gradient(90deg, #f2b94b, #e28738); border-radius: inherit; }.gw-rating-dimensions em { color: var(--gw-text-muted); font-style: normal; text-align: right; }
.gw-rating-form { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; padding-top: 10px; }.gw-rating-form h2 { grid-column: 1 / -1; margin: 0 0 4px; font-size: 20px; }.gw-rating-field { display: flex; align-items: center; justify-content: space-between; padding: 13px 14px; border: 1px solid var(--gw-border); border-radius: 10px; font-size: 14px; }.gw-rating-field select { padding: 6px 7px; border: 0; background: transparent; color: var(--gw-heading); font: inherit; }.gw-rating-form button,.gw-rating-empty a { grid-column: 1 / -1; padding: 13px 18px; border: 0; border-radius: 10px; background: var(--gw-primary); color: #fff; font-weight: 700; text-align: center; text-decoration: none; cursor: pointer; }.gw-rating-form button:hover,.gw-rating-empty a:hover { background: var(--gw-primary-hover); }
.gw-rating-empty,.gw-rating-notice { padding: 17px 18px; border-radius: 12px; background: var(--gw-primary-soft); color: var(--gw-text-secondary); text-align: center; }.gw-rating-empty p { margin: 0 0 13px; }.gw-rating-empty a { display: inline-block; }.gw-rating-notice { margin-bottom: 18px; }.gw-rating-notice.is-error { background: #fff0ef; color: #b24b42; }
@media (max-width: 620px) { .gw-rating-page { padding: 22px 0 44px; }.gw-rating-panel { padding: 24px 18px; border-radius: 15px; }.gw-rating-overview { grid-template-columns: 1fr; gap: 20px; }.gw-rating-form { grid-template-columns: 1fr; } }

/* Header notification centre */
.gw-header__actions { position: relative; }
.gw-header__notification.is-active { background: var(--gw-primary-soft); color: var(--gw-primary); }
.gw-header__notification-count,
.gw-notification-badge { position: absolute; top: 4px; right: 4px; min-width: 17px; height: 17px; padding: 0 4px; border: 2px solid #fff; border-radius: 999px; background: #e95b65; color: #fff; font-size: 9px; font-weight: 800; line-height: 13px; text-align: center; }
.gw-header__tasks { gap: 5px; }.gw-header__task-count { display: grid; min-width: 19px; height: 19px; padding: 0 5px; place-items: center; border-radius: 999px; background: var(--gw-primary-soft); color: var(--gw-primary); font-size: 10px; font-weight: 800; }
.gw-mobile-menu__task-count { display: grid; min-width: 18px; height: 18px; margin-left: auto; padding: 0 5px; place-items: center; border-radius: 999px; background: var(--gw-primary-soft); color: var(--gw-primary); font-size: 10px; font-weight: 800; }
.gw-notification-panel { position: absolute; z-index: 200; top: calc(100% - 6px); right: 0; display: none; width: min(390px, calc(100vw - 24px)); overflow: hidden; border: 1px solid rgba(35, 29, 61, .12); border-radius: 16px; background: #fff; box-shadow: 0 18px 48px rgba(29, 24, 61, .2); }
.gw-notification-panel.is-open { display: block; animation: gwNotificationIn .18s ease-out; }
.gw-notification-panel__header { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 15px 16px; border-bottom: 1px solid var(--gw-border); background: linear-gradient(135deg, #fbfaff, #f6f3ff); }
.gw-notification-panel__title { display: flex; align-items: center; gap: 7px; color: var(--gw-heading); font-size: 14px; font-weight: 800; }.gw-notification-panel__unread { color: var(--gw-primary); font-size: 11px; font-weight: 700; }
.gw-notification-panel__actions { display: flex; gap: 5px; }.gw-notification-panel__actions button { padding: 4px 6px; border: 0; border-radius: 6px; background: transparent; color: var(--gw-text-muted); font-size: 11px; cursor: pointer; }.gw-notification-panel__actions button:hover { background: rgba(124,92,255,.1); color: var(--gw-primary); }
.gw-notification-panel__body { max-height: min(480px, calc(100vh - 140px)); overflow-y: auto; }.gw-notification-item { position: relative; display: flex; gap: 10px; padding: 13px 38px 13px 15px; border-bottom: 1px solid #f0eef6; cursor: pointer; transition: background .16s ease; }.gw-notification-item:hover { background: #faf9ff; }.gw-notification-item.is-unread { background: #f7f4ff; }.gw-notification-item.is-unread::before { position: absolute; top: 17px; left: 6px; width: 5px; height: 5px; border-radius: 50%; background: var(--gw-primary); content: ''; }.gw-notification-item__avatar { flex: 0 0 32px; width: 32px; height: 32px; overflow: hidden; border-radius: 50%; background: var(--gw-primary-soft); }.gw-notification-avatar { width: 100%; height: 100%; object-fit: cover; }.gw-notification-icon { display: block; width: 100%; height: 100%; }.gw-notification-item__main { min-width: 0; flex: 1; }.gw-notification-item__top { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }.gw-notification-item__title { overflow: hidden; color: var(--gw-heading); font-size: 13px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }.gw-notification-item__time { flex: 0 0 auto; color: var(--gw-text-muted); font-size: 10px; }.gw-notification-item__content { display: -webkit-box; margin-top: 4px; overflow: hidden; color: var(--gw-text-secondary); font-size: 12px; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }.gw-notification-delete { position: absolute; top: 10px; right: 10px; width: 22px; height: 22px; border: 0; border-radius: 6px; background: transparent; color: var(--gw-text-muted); cursor: pointer; opacity: 0; }.gw-notification-item:hover .gw-notification-delete { opacity: 1; }.gw-notification-delete:hover { background: #fff0ef; color: #d34e59; }.gw-notification-empty,.gw-notification-loading { padding: 42px 18px; color: var(--gw-text-muted); font-size: 13px; text-align: center; }
@keyframes gwNotificationIn { from { opacity: 0; transform: translateY(-7px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
@media (max-width: 720px) { .gw-notification-panel { position: fixed; top: 64px; right: 12px; left: 12px; width: auto; }.gw-notification-delete { opacity: 1; } }

/* Mobile footer: the grouped desktop links are intentionally hidden. */
@media (max-width: 768px) {
    .gw-footer { padding-bottom: 64px; }
    .gw-footer__column { display: none !important; }
    .gw-footer__main { display: block !important; }
    .gw-footer__brand { display: block !important; }

    .gw-mobile-bottom-nav__icon.gw-icon {
        width: 19px;
        height: 19px;
        background-color: currentColor;
    }

    .gw-mobile-bottom-nav__item--wiki .gw-mobile-bottom-nav__icon {
        font-family: Georgia, serif;
        font-weight: 800;
    }
}

/* Article reading surface, comment metadata and desktop table of contents. */
.gw-wiki-single .gw-wiki-content__body {
    color: #3d3a46;
    font-size: 16px;
    line-height: 1.95;
}

.gw-wiki-single .gw-wiki-content__body h2,
.gw-wiki-single .gw-wiki-content__body h3 {
    position: relative;
    scroll-margin-top: 104px;
    color: var(--gw-heading);
    line-height: 1.4;
}

.gw-wiki-single .gw-wiki-content__body h2 {
    margin-top: 42px;
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--gw-border-light);
    font-size: 24px;
}

.gw-wiki-single .gw-wiki-content__body h3 {
    margin-top: 30px;
    margin-bottom: 11px;
    font-size: 19px;
}

.gw-wiki-single .gw-wiki-content__body h2::before {
    position: absolute;
    top: 0;
    left: -18px;
    width: 3px;
    height: 1.4em;
    border-radius: 99px;
    background: var(--gw-primary);
    content: '';
}

.gw-wiki-single .gw-wiki-content__body blockquote {
    margin: 24px 0;
    padding: 14px 18px;
    border-left: 3px solid var(--gw-primary);
    border-radius: 0 8px 8px 0;
    background: #faf9ff;
    color: var(--gw-text-secondary);
}

.gw-wiki-single .gw-author-card {
    border-radius: 14px;
    box-shadow: 0 12px 34px rgba(35, 29, 61, .07);
}

.gw-article-toc {
    display: block;
    max-height: min(58vh, 520px);
    margin-top: 16px;
    padding: 18px 16px;
    overflow-y: auto;
    border: 1px solid var(--gw-border);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(35, 29, 61, .05);
}

.gw-article-toc[hidden] {
    display: none;
}

.gw-article-toc__heading {
    padding-bottom: 11px;
    border-bottom: 1px solid var(--gw-border-light);
}

.gw-article-toc__eyebrow {
    display: block;
    margin-bottom: 4px;
    color: var(--gw-primary);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .14em;
}

.gw-article-toc__heading h2 {
    margin: 0;
    color: var(--gw-heading);
    font-size: 17px;
    line-height: 1.4;
}

.gw-article-toc__list {
    display: grid;
    gap: 2px;
    margin: 12px 0 0;
    padding: 0;
    list-style: none;
}

.gw-article-toc__item a {
    display: block;
    padding: 7px 8px;
    overflow: hidden;
    border-radius: 6px;
    color: var(--gw-text-muted);
    font-size: 12px;
    line-height: 1.45;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: background .16s ease, color .16s ease;
}

.gw-article-toc__item--h3 a {
    padding-left: 22px;
    font-size: 11px;
}

.gw-article-toc__item--h4 a,
.gw-article-toc__item--h5 a,
.gw-article-toc__item--h6 a {
    padding-left: 34px;
    font-size: 11px;
}

.gw-article-toc__item a:hover,
.gw-article-toc__item a.is-active {
    background: var(--gw-primary-soft);
    color: var(--gw-primary);
    font-weight: 700;
}

#galwiki-comments-scope .gw-comment__level {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-height: 18px;
    padding: 0 6px;
    border: 1px solid rgba(124, 92, 255, .18);
    border-radius: 5px;
    background: #f5f2ff;
    color: var(--gw-primary);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .02em;
    line-height: 1;
}

#galwiki-comments-scope .gw-comment__level--4,
#galwiki-comments-scope .gw-comment__level--5 {
    border-color: rgba(190, 126, 31, .24);
    background: #fff7e8;
    color: #a66b13;
}

#galwiki-comments-scope .gw-comment__author {
    flex-wrap: wrap;
    row-gap: 4px;
}

#galwiki-comments-scope .gw-comment {
    transition: background .16s ease, box-shadow .16s ease;
}

#galwiki-comments-scope .gw-comment:hover {
    background: #fdfcff;
}

@media (max-width: 900px) {
    .gw-article-toc {
        display: none !important;
    }
}

/* Keep the secondary mobile header action anchored beside search. */
@media (max-width: 1180px) {
    .gw-header__actions {
        right: 50px;
        min-width: 42px;
        justify-content: center;
    }

    .gw-header__actions .gw-header__login {
        margin-left: 0;
        white-space: nowrap;
    }

    .gw-header__user-wrap {
        justify-content: center;
        width: 42px;
    }
}

@media (max-width: 480px) {
    .gw-header__actions {
        right: 46px;
    }
}

/* =========================================================
   Article overflow and mobile header stabilization
   ========================================================= */

.gw-wiki-single .gw-wiki-content__body {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    overflow-wrap: anywhere;
}

.gw-wiki-single .gw-wiki-content__body > * {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.gw-content-table-scroll {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 24px 0;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-inline: contain;
}

.gw-content-table-scroll table,
.gw-wiki-single .gw-wiki-content__body > table {
    width: max-content !important;
    min-width: 100%;
    max-width: none;
    margin: 0;
    white-space: nowrap;
    word-break: normal;
    overflow-wrap: normal;
}

.gw-content-table-scroll th,
.gw-content-table-scroll td,
.gw-wiki-single .gw-wiki-content__body > table th,
.gw-wiki-single .gw-wiki-content__body > table td {
    word-break: normal;
    overflow-wrap: normal;
}

@media (max-width: 900px) {
    .gw-wiki-single .gw-wiki-content__body {
        overflow-x: hidden;
        word-break: normal;
    }

    .gw-wiki-single .gw-wiki-content__body > :not(.gw-content-table-scroll) {
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .gw-content-table-scroll {
        margin-right: 0;
        margin-left: 0;
    }

    .gw-content-table-scroll table {
        display: table;
    }

    .gw-header__container {
        padding-right: 92px;
        padding-left: 48px;
        box-sizing: border-box;
    }

    .gw-header__logo {
        left: 50%;
        width: calc(100% - 148px);
        max-width: calc(100% - 148px);
        pointer-events: none;
    }

    .gw-header__logo-link {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        pointer-events: auto;
    }

    .gw-header__logo-text {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .gw-mobile-search-toggle {
        right: 4px;
        z-index: 9200;
    }

    .gw-header__actions {
        right: 46px;
        z-index: 9200;
    }

    .gw-header__user-wrap,
    .gw-header__user {
        flex: 0 0 42px;
        width: 42px;
        min-width: 42px;
    }

    .gw-mobile-menu,
    .gw-mobile-menu-mask {
        display: none;
    }

    .gw-mobile-menu.is-open,
    .gw-mobile-menu-mask.is-open {
        display: block;
    }
}

@media (max-width: 480px) {
    .gw-header__container {
        padding-right: 84px;
        padding-left: 44px;
    }

    .gw-header__logo {
        width: calc(100% - 136px);
        max-width: calc(100% - 136px);
    }

    .gw-header__actions {
        right: 42px;
    }

    .gw-header__user-wrap,
    .gw-header__user {
        flex-basis: 39px;
        width: 39px;
        min-width: 39px;
    }
}

@media (max-width: 360px) {
    .gw-header__container {
        padding-right: 78px;
        padding-left: 42px;
    }

    .gw-header__logo {
        width: calc(100% - 126px);
        max-width: calc(100% - 126px);
    }

    .gw-header__actions {
        right: 39px;
    }

    .gw-header__user-wrap,
    .gw-header__user {
        flex-basis: 36px;
        width: 36px;
        min-width: 36px;
    }
}

/* Final mobile header layout: menu | logo | search + account. */
@media (max-width: 900px) {
    .gw-header__container {
        display: grid;
        grid-template-columns: 44px minmax(0, 1fr) auto auto;
        align-items: center;
        width: 100%;
        height: var(--gw-header-height-mobile);
        padding: 0 8px;
        gap: 6px;
    }

    .gw-header__mobile-left,
    .gw-mobile-search-toggle,
    .gw-header__actions,
    .gw-header__logo {
        position: static;
        top: auto;
        right: auto;
        left: auto;
        height: var(--gw-header-height-mobile);
        transform: none;
    }

    .gw-header__mobile-left {
        grid-column: 1;
        justify-content: flex-start;
    }

    .gw-header__logo {
        grid-column: 2;
        justify-content: center;
        min-width: 0;
        width: auto;
        max-width: none;
        pointer-events: none;
        padding-top: 2px;
    }

    .gw-header__logo-link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: auto;
        height: 40px;
        max-width: min(100%, 170px);
        pointer-events: auto;
    }

    .gw-header__logo-text {
        max-width: 170px;
        text-align: center;
    }

    .gw-mobile-search-toggle {
        grid-column: 4;
        grid-row: 1;
        justify-self: end;
        align-self: center;
        width: 40px;
        height: 40px;
        z-index: 9100;
    }

    .gw-header__actions {
        grid-column: 3;
        grid-row: 1;
        justify-self: end;
        align-self: center;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        min-width: 0;
        margin: 0;
        padding: 0;
        z-index: 9100;
    }

    .gw-header__user-wrap,
    .gw-header__user {
        flex: 0 0 40px;
        width: 40px;
        min-width: 40px;
        height: 40px;
    }

    .gw-header__avatar {
        width: 31px;
        height: 31px;
        flex-basis: 31px;
    }

    .gw-header__actions:has(.gw-header__login) .gw-header__login {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 5px;
        min-height: 34px;
        height: 34px;
        margin: 0;
        padding: 0 11px;
        border-radius: 999px;
        font-size: 12px;
        line-height: 1;
        white-space: nowrap;
    }

    .gw-header__actions:has(.gw-header__login) .gw-header__login .gw-icon {
        width: 15px;
        height: 15px;
        margin: 0;
    }
}

@media (max-width: 420px) {
    .gw-header__container {
        grid-template-columns: 42px minmax(0, 1fr) auto auto;
        padding: 0 6px;
        gap: 4px;
    }

    .gw-header__logo-link,
    .gw-header__logo-text {
        max-width: 138px;
    }

    .gw-header__actions {
        margin-right: 0;
    }

    .gw-mobile-search-toggle,
    .gw-header__user-wrap,
    .gw-header__user {
        width: 38px;
        min-width: 38px;
        flex-basis: 38px;
    }

    .gw-header__actions:has(.gw-header__login) .gw-header__login {
        padding: 0 9px;
        font-size: 11px;
    }
}

/* Category page readability tuning. */
.gw-wiki-action--ai-search { border-color:rgba(124,92,255,.28); box-shadow:0 4px 16px rgba(124,92,255,.16); }.gw-wiki-action--ai-search.is-disabled { border-color:var(--gw-border); background:#f1f2f5; color:var(--gw-text-muted); box-shadow:none; cursor:not-allowed; }.gw-wiki-action--ai-search.is-disabled:hover { transform:none; }
.gw-task-card__action { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.gw-task-card__link { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 10px 15px; border-radius: 5px; background: #e8f5f0; color: #216b59; font-size: 13px; font-weight: 700; text-decoration: none; }
.gw-task-card__link:hover { background: #d9eee6; color: #216b59; }
.gw-search-results--article { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.gw-search-article-card { display: grid; grid-template-columns: 150px minmax(0, 1fr); min-width: 0; overflow: hidden; border: 1px solid var(--gw-border); border-radius: 8px; background: var(--gw-white); box-shadow: 0 6px 22px rgba(26, 34, 56, .035); }
.gw-search-article-card:hover { box-shadow: 0 13px 30px rgba(26, 34, 56, .09); transform: translateY(-2px); }.gw-search-article-card .gw-category-article-card__cover { min-height: 150px; border-radius: 0; }.gw-search-article-card .gw-category-article-card__cover img { width: 100%; height: 100%; object-fit: cover; }.gw-search-article-card .gw-category-article-card__body { min-width: 0; padding: 14px; }.gw-search-article-card .gw-category-article-card__footer { margin-top: 10px; }.gw-search-wiki-item { border-radius: 8px; box-shadow: 0 6px 22px rgba(26, 34, 56, .035); }.gw-search-wiki-item:hover { box-shadow: 0 13px 30px rgba(26, 34, 56, .09); }
@media (max-width: 760px) { .gw-task-card__action, .gw-task-card__action button, .gw-task-card__link { width: 100%; }.gw-search-results--article { grid-template-columns: 1fr; }.gw-search-article-card { grid-template-columns: 116px minmax(0, 1fr); }.gw-search-article-card .gw-category-article-card__cover { min-height: 132px; } }
.gw-category-header .gw-section-label,
.gw-category-header__count { font-size: 12px; }
.gw-category-header h1,
.gw-category-header__title { font-size: 44px; }
.gw-category-header__description { font-size: 16px; line-height: 1.9; }
.gw-category-wiki-card__title,
.gw-category-wiki-item h2,
.gw-category-article-card h2,
.gw-category-article-card__title { font-size: 22px; line-height: 1.45; }
.gw-category-wiki-card__excerpt,
.gw-category-wiki-item__excerpt,
.gw-category-wiki-item p,
.gw-category-article-card__excerpt { font-size: 15px; line-height: 1.8; }
.gw-category-view-switch,
.gw-category-view-switch__item,
.gw-category-filter__label,
.gw-category-filter__option,
.gw-category-filter__controls,
.gw-category-filter__top strong { font-size: 13px; }
.gw-category-filter__top span { font-size: 12px; line-height: 1.6; }
.gw-category-filter__row small { font-size: 11px; }

@media (max-width: 900px) {
    .gw-category-header h1,
    .gw-category-header__title { font-size: 36px; }
    .gw-category-header__description { font-size: 15px; }
    .gw-category-wiki-card__title,
    .gw-category-wiki-item h2,
    .gw-category-article-card h2,
    .gw-category-article-card__title { font-size: 19px; }
    .gw-category-wiki-card__excerpt,
    .gw-category-wiki-item__excerpt,
    .gw-category-wiki-item p,
    .gw-category-article-card__excerpt { font-size: 14px; }
    .gw-category-view-switch__item,
    .gw-category-filter__label,
    .gw-category-filter__option,
    .gw-category-filter__controls,
    .gw-category-filter__top strong,
    .gw-category-filter__top span { font-size: 12px; }
}

/* Compact view toggle and optional covers in the Wiki list. */
.gw-category-filter__top .gw-category-view-switch {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: auto;
    height: 36px;
    margin: 0;
    padding: 0 9px;
    border-radius: 7px;
    color: var(--gw-text-light);
    text-decoration: none;
}
.gw-category-filter__top .gw-category-view-switch:hover,
.gw-category-filter__top .gw-category-view-switch:focus-visible {
    border-color: rgba(124,92,255,.35);
    background: #fff;
    color: var(--gw-primary);
    outline: none;
}
.gw-category-view-switch .gw-icon--view,
.gw-category-view-switch .gw-icon--view svg {
    width: 17px;
    height: 17px;
    stroke-width: 2;
}
.gw-category-view-switch__text { margin-left: 6px; font-size: 12px; white-space: nowrap; }
@media (max-width: 760px) {
    .gw-category-filter__top .gw-category-view-switch {
        flex: 0 0 36px;
        width: 36px;
        margin-top: 0;
    }
}

/* The AI help is an anchored, dismissible popover rather than part of the button. */
.gw-ai-search-popover[hidden] { display: none; }
.gw-ai-search-anchor { position: relative; display: inline-flex; overflow: visible; }
.gw-ai-search-popover {
    position: absolute;
    z-index: 10010;
    box-sizing: border-box;
    bottom: calc(100% + 10px);
    left: 50%;
    transform: translateX(-50%);
    width: min(292px, calc(100vw - 24px));
    padding: 10px 36px 10px 12px;
    border: 1px solid #252b37;
    border-radius: 6px;
    background: #252b37;
    color: #fff;
    font-size: 12px;
    line-height: 1.55;
    box-shadow: 0 12px 30px rgba(17, 22, 34, .22);
}
.gw-ai-search-popover::after {
    position: absolute;
    left: var(--gw-ai-arrow-left, 50%);
    border: 7px solid transparent;
    content: '';
    transform: translateX(-50%);
}
.gw-ai-search-popover[data-placement="bottom"] { top: calc(100% + 10px); bottom: auto; }
.gw-ai-search-popover[data-placement="top"]::after {
    top: 100%;
    border-top-color: #252b37;
}
.gw-ai-search-popover[data-placement="bottom"]::after {
    bottom: 100%;
    border-bottom-color: #252b37;
}
.gw-ai-search-popover__close {
    position: absolute;
    top: 5px;
    right: 6px;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: #fff;
    font-size: 19px;
    line-height: 1;
    cursor: pointer;
}
.gw-ai-search-popover__close:hover,
.gw-ai-search-popover__close:focus-visible { background: rgba(255,255,255,.16); outline: none; }

/* Fixed covers keep category and search result rows from changing height. */
.gw-category-wiki-card__cover,
.gw-category-wiki-item__cover {
    height: auto;
    min-height: 0;
    aspect-ratio: 16 / 10;
}
.gw-search-article-card .gw-category-article-card__cover {
    min-height: 0;
    aspect-ratio: 16 / 9;
    align-self: start;
}
@media (max-width: 760px) {
    .gw-search-article-card .gw-category-article-card__cover {
        min-height: 0;
    }
}

.gw-submission__category-picker { display: grid; gap: 12px; }
.gw-submission__category-picker [data-submission-category-levels] { display: grid; gap: 12px; }
.gw-submission__category-picker [data-submission-category-status] { min-height: 20px; margin: 0; color: var(--gw-text-muted); font-size: 12px; line-height: 1.5; }
.gw-submission__category-picker input[readonly] { background: var(--gw-bg-soft); color: var(--gw-text-secondary); cursor: default; }

/* Article and search covers retain one predictable 16:9 frame. */
.gw-category-article-card__cover,
.gw-category-article-card__image,
.gw-search-article-card .gw-category-article-card__cover {
    height: auto;
    min-height: 0;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}
.gw-category-article-card__cover img,
.gw-category-article-card__image img,
.gw-category-article-card__cover span,
.gw-category-article-card__cover-placeholder,
.gw-category-article-card__image span {
    width: 100%;
    height: 100%;
}
.gw-category-article-card__cover img,
.gw-category-article-card__image img { object-fit: cover; }

/* Desktop-only utility rail. Icons are progressively enhanced by Lucide. */
.gw-utility-rail {
    position: fixed;
    z-index: 80;
    right: 18px;
    top: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    transform: translateY(-50%);
}
.gw-utility-rail__button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid var(--gw-border);
    border-radius: 6px;
    background: var(--gw-white);
    color: var(--gw-text-secondary);
    box-shadow: 0 4px 14px rgba(20, 24, 40, .09);
    cursor: pointer;
    text-decoration: none;
}
.gw-utility-rail__button:hover,
.gw-utility-rail__button:focus-visible { border-color: var(--gw-primary); color: var(--gw-primary); outline: none; }
.gw-utility-rail__button[disabled] { cursor: default; opacity: .62; }
.gw-utility-rail__button > span { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; }
.gw-utility-rail__button svg { width: 18px; height: 18px; stroke-width: 2; }
.gw-utility-rail__button[data-tooltip]::after {
    position: absolute;
    right: calc(100% + 9px);
    top: 50%;
    z-index: 1;
    padding: 5px 8px;
    border-radius: 4px;
    background: #252a36;
    color: #fff;
    content: attr(data-tooltip);
    font-size: 12px;
    line-height: 1.2;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-50%);
    transition: opacity .15s ease;
    white-space: nowrap;
}
.gw-utility-rail__button[data-tooltip]:hover::after,
.gw-utility-rail__button[data-tooltip]:focus-visible::after { opacity: 1; }
.gw-utility-rail__text-size { position: relative; }
.gw-utility-rail__menu {
    position: absolute;
    right: calc(100% + 9px);
    top: 50%;
    display: flex;
    gap: 2px;
    padding: 4px;
    border: 1px solid var(--gw-border);
    border-radius: 6px;
    background: var(--gw-white);
    box-shadow: 0 8px 22px rgba(20, 24, 40, .12);
    transform: translateY(-50%);
}
.gw-utility-rail__menu button { min-width: 34px; height: 28px; border: 0; border-radius: 4px; background: transparent; color: var(--gw-text-secondary); cursor: pointer; font-size: 12px; }
.gw-utility-rail__menu button:hover,
.gw-utility-rail__menu button:focus-visible,
.gw-utility-rail__menu button.is-selected { background: var(--gw-primary-soft); color: var(--gw-primary); outline: none; }
.gw-utility-rail__status { position: absolute; right: calc(100% + 9px); bottom: -24px; width: max-content; max-width: 220px; color: var(--gw-text-secondary); font-size: 12px; line-height: 1.35; text-align: right; }
.gw-utility-rail__status.is-error { color: #c74646; }
.gw-utility-rail [hidden] { display: none !important; }

html[data-gw-reading-size="small"] .gw-wiki-content__body,
html[data-gw-reading-size="small"] .entry-content,
html[data-gw-reading-size="small"] .gw-category-article-card__excerpt { font-size: 0.9em; }
html[data-gw-reading-size="large"] .gw-wiki-content__body,
html[data-gw-reading-size="large"] .entry-content,
html[data-gw-reading-size="large"] .gw-category-article-card__excerpt { font-size: 1.12em; }

@media (max-width: 768px) {
    .gw-utility-rail { display: none; }
}

/* Keep the actual rendered article covers identical across category and search lists. */
.gw-category-article-grid > .gw-category-article-card > .gw-category-article-card__cover,
.gw-category-article-grid > .gw-category-article-card > .gw-category-article-card__image,
.gw-search-results--article > .gw-search-article-card > .gw-category-article-card__cover {
    display: block;
    flex: 0 0 auto;
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden;
}
.gw-category-article-grid > .gw-category-article-card > .gw-category-article-card__cover > img,
.gw-category-article-grid > .gw-category-article-card > .gw-category-article-card__image > img,
.gw-search-results--article > .gw-search-article-card > .gw-category-article-card__cover > img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
}
.gw-category-article-grid > .gw-category-article-card > .gw-category-article-card__cover > span,
.gw-search-results--article > .gw-search-article-card > .gw-category-article-card__cover > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    height: 100% !important;
}
.gw-search-results--article > .gw-search-article-card {
    display: flex;
    flex-direction: column;
    grid-template-columns: none;
}
.gw-search-results--article > .gw-search-article-card > .gw-category-article-card__cover {
    align-self: auto;
    border-radius: 8px 8px 0 0;
}

/* Category-only portrait lists. Keep search and homepage cover layouts intact. */
.gw-category-page {
    overflow-x: clip;
}
.gw-category-page .gw-category-article-grid,
.gw-category-page .gw-category-list--wiki,
.gw-category-page .gw-category-wiki-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.gw-category-page .gw-category-article-card,
.gw-category-page .gw-category-wiki-item {
    --gw-list-cover-width: 140px;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 0;
    padding: 0;
}
.gw-category-page .gw-category-article-grid > .gw-category-article-card > .gw-category-article-card__cover,
.gw-category-page .gw-category-article-grid > .gw-category-article-card > .gw-category-article-card__image,
.gw-category-page .gw-category-wiki-item > .gw-category-wiki-item__cover {
    position: relative;
    display: block;
    flex: 0 0 var(--gw-list-cover-width);
    width: var(--gw-list-cover-width);
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 2 / 3 !important;
    align-self: flex-start;
    margin: 0;
    overflow: hidden;
    border-radius: 0;
}
.gw-category-page .gw-category-article-card__cover > img,
.gw-category-page .gw-category-article-card__image > img,
.gw-category-page .gw-category-wiki-item__cover > img,
.gw-category-page .gw-category-article-card__cover > span,
.gw-category-page .gw-category-wiki-item__cover > span {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    object-position: center;
}
.gw-category-page .gw-category-wiki-item__cover > span {
    font-size: 12px;
}
.gw-category-page .gw-category-article-card__body,
.gw-category-page .gw-category-wiki-item__main {
    flex: 1 1 0;
    min-width: 0;
    padding: 15px;
    overflow-wrap: anywhere;
}
.gw-category-page .gw-category-article-card h2,
.gw-category-page .gw-category-wiki-item h2 {
    white-space: normal;
}
.gw-category-page .gw-category-wiki-item__mark {
    position: absolute;
    z-index: 1;
    top: 8px;
    left: 8px;
    margin: 0;
    pointer-events: none;
}
.gw-category-page .gw-category-wiki-item__arrow {
    flex: 0 0 26px;
    width: 26px;
    margin: 12px 8px 0 0;
}
@media (max-width: 900px) {
    .gw-category-page .gw-category-article-grid,
    .gw-category-page .gw-category-list--wiki,
    .gw-category-page .gw-category-wiki-list {
        grid-template-columns: minmax(0, 1fr);
    }
}
@media (max-width: 640px) {
    .gw-category-page .gw-category-article-card,
    .gw-category-page .gw-category-wiki-item {
        --gw-list-cover-width: 100px;
    }
    .gw-category-page .gw-category-article-card__body,
    .gw-category-page .gw-category-wiki-item__main {
        padding: 12px;
    }
}