/* Page-specific styles for guidang.php. */
main.guidang-page,
main.guidang-page * {
    font-family: var(--font-main) !important;
}

.guidang-page .guidang-stats,
.guidang-page .guidang-category-stats,
.guidang-page .guidang-tag-stats {
    display: none;
}

.guidang-hero,
.guidang-stat,
.guidang-tags,
.guidang-panel,
.guidang-group,
.guidang-empty {
    background: var(--bg-card) !important;
    border-color: var(--border-color) !important;
}

.guidang-panel,
.guidang-group {
    border: 1px solid var(--border-color);
}

.guidang-group-body {
    border-top-color: var(--border-color) !important;
}
main.guidang-page {
                width: 100%;
            }

            

            .guidang-wrap {
                width: 100%;
                max-width: var(--page-width, 860px);
                margin: 0 auto;
                padding: 10px 0 30px;
                color: var(--text-body);
                font-family: var(--font-main);
            }

            .guidang-hero {
                position: relative;
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 16px;
                min-height: 62px;
                padding: 0 18px 0 20px;
                margin-bottom: 18px;
                border: 1px solid var(--border-color);
                border-radius: var(--radius);
                
                box-shadow: 0 12px 30px rgba(80, 61, 42, .05);
                backdrop-filter: blur(10px);
                overflow: hidden;
            }

            :root[data-theme="dark"] .guidang-hero {
                
                box-shadow: var(--control-shadow);
            }

            .guidang-hero::after {
                content: "";
                position: absolute;
                right: 38px;
                top: 50%;
                width: 170px;
                height: 70px;
                transform: translateY(-50%);
                
                pointer-events: none;
            }

            

            .guidang-hero-title {
                position: relative;
                z-index: 1;
                display: flex;
                align-items: center;
                gap: 14px;
                min-width: 0;
            }

            .guidang-main-icon {
                width: 30px;
                height: 30px;
                flex: 0 0 auto;
                color: #b08458;
                filter: drop-shadow(0 5px 10px rgba(153, 108, 62, .12));
            }

            .guidang-hero-title strong {
                font-size: 24px;
                line-height: 1;
                color: #42382f;
                font-weight: 650;
                letter-spacing: .05em;
                white-space: nowrap;
            }

            :root[data-theme="dark"] .guidang-hero-title strong,
            :root[data-theme="dark"] .guidang-stat-text strong,
            :root[data-theme="dark"] .guidang-tags-title,
            :root[data-theme="dark"] .guidang-group-title,
            :root[data-theme="dark"] .guidang-link {
                color: var(--text-body);
            }

            .guidang-hero-title i {
                width: 1px;
                height: 19px;
                
                font-style: normal;
            }

            

            .guidang-hero-title span {
                color: #76695e;
                font-size: 14px;
                white-space: nowrap;
            }

            :root[data-theme="dark"] .guidang-hero-title span,
            :root[data-theme="dark"] .guidang-intro,
            :root[data-theme="dark"] .guidang-stat-text span,
            :root[data-theme="dark"] .guidang-group-count {
                color: var(--text-body);
            }

            .guidang-hero-arrow {
                position: relative;
                z-index: 1;
                width: 18px;
                height: 18px;
                color: #a29181;
            }

            .guidang-hero-arrow::before {
                content: "";
                display: block;
                width: 9px;
                height: 9px;
                margin: 4px 0 0 2px;
                border-top: 1.5px solid var(--border-color);
                border-right: 1.5px solid var(--border-color);
                transform: rotate(45deg);
            }

            .guidang-intro {
                margin: 0 0 18px;
                color: #5f5349;
                font-size: 14px;
                line-height: 2;
                letter-spacing: .02em;
            }

            .guidang-intro p { margin: 0; }

            .guidang-stats {
                display: grid;
                grid-template-columns: repeat(4, minmax(0, 1fr));
                gap: 12px;
                margin: 0 0 14px;
            }

            .guidang-stat {
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 15px;
                min-width: 0;
                min-height: 84px;
                border: 1px solid var(--border-color);
                border-radius: var(--radius);
                
                box-shadow: 0 10px 24px rgba(80, 61, 42, .045);
                backdrop-filter: blur(8px);
            }

            :root[data-theme="dark"] .guidang-stat,
            :root[data-theme="dark"] .guidang-tags,
            :root[data-theme="dark"] .guidang-group,
            :root[data-theme="dark"] .guidang-empty {
                border-color: var(--border-color);
                
                box-shadow: var(--control-shadow);
            }

            .guidang-stat-icon {
                width: 42px;
                height: 42px;
                flex: 0 0 42px;
                border-radius: var(--radius-circle);
                display: inline-flex;
                align-items: center;
                justify-content: center;
                color: #8d7259;
                
                border: 1px solid var(--border-color);
            }

            :root[data-theme="dark"] .guidang-stat-icon {
                color: var(--accent-brown);
                border-color: var(--border-color);
                
            }

            .guidang-stat-icon svg {
                display: block;
                width: 24px;
                height: 24px;
                flex: 0 0 24px;
            }

            .guidang-stat-text {
                display: flex;
                flex-direction: column;
                gap: 2px;
                min-width: 0;
            }

            .guidang-stat-text span {
                color: #6b5d50;
                font-size: 13px;
            }

            .guidang-stat-text strong {
                color: #42382f;
                font-family: Georgia, "Times New Roman", serif;
                font-size: clamp(26px, 3.15vw, 32px);
                line-height: 1;
                font-weight: 600;
                font-variant-numeric: tabular-nums;
                white-space: nowrap;
            }

            .guidang-tags {
                margin: 0 0 16px;
                padding: 18px;
                border: 1px solid var(--border-color);
                border-radius: var(--radius);
            }

            .guidang-tags-head {
                display: flex;
                align-items: center;
                padding: 0;
                border: 0;
            }

            .guidang-tags-title {
                display: flex;
                align-items: center;
                flex: 1 1 auto;
                gap: 12px;
                min-width: 0;
                color: var(--text-body);
                font-size: 20px;
                font-weight: 700;
            }

            .guidang-tags-title::after {
                height: 1px;
                margin-left: 4px;
                background: var(--border-color);
                content: "";
                flex: 1 1 auto;
            }

            .guidang-tags-title svg {
                width: 22px;
                height: 22px;
                flex: 0 0 auto;
                color: var(--accent-brown);
            }

            .guidang-category-grid {
                display: grid;
                grid-template-columns: repeat(6, minmax(0, 1fr));
                gap: 0;
                margin-top: 8px;
                background: var(--bg-card);
            }

            .guidang-category-item {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                gap: 3px;
                min-width: 0;
                min-height: 50px;
                padding: 6px 5px;
                position: relative;
                border: 0;
                background: var(--bg-card);
                color: var(--text-body);
                text-align: center;
                text-decoration: none;
            }

            .guidang-category-item:nth-child(6n + 7)::before {
                position: absolute;
                top: 0;
                left: 0;
                right: -500%;
                height: 1px;
                background: var(--border-color);
                content: "";
                pointer-events: none;
                z-index: 1;
            }

            .guidang-category-item:nth-child(6n + 7) {
                z-index: 1;
            }

            .guidang-category-item::after {
                position: absolute;
                top: 26%;
                right: 0;
                width: 1px;
                height: 48%;
                background: var(--border-color);
                content: "";
            }

            .guidang-category-item:nth-child(6n)::after,
            .guidang-category-item:last-child::after {
                display: none;
            }

            .guidang-category-item:hover {
                color: var(--accent-brown);
            }

            .guidang-category-item span:first-child {
                max-width: 100%;
                font-size: 15px;
                line-height: 1.35;
            }

            .guidang-category-item .guidang-tag-count {
                display: block;
                color: var(--text-secondary);
                font-size: 13px;
                font-weight: 400;
                line-height: 1.35;
            }

            .guidang-tag-cloud {
                display: flex;
                flex-wrap: wrap;
                align-items: flex-start;
                justify-content: flex-start;
                gap: 10px 14px;
                margin-top: 16px;
            }

            .guidang-tag-pill {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 5px;
                width: max-content;
                max-width: 100%;
                min-width: 0;
                min-height: 29px;
                padding: 0 13px;
                border: 0;
                border-radius: var(--radius-pill);
                background: color-mix(in srgb, var(--accent-gold) 11%, var(--bg-card));
                color: var(--text-body);
                text-decoration: none;
                white-space: nowrap;
            }

            .guidang-tag-pill::before {
                color: var(--accent-brown);
                content: "#";
            }

            .guidang-tag-pill:hover {
                background: color-mix(in srgb, var(--accent-gold) 18%, var(--bg-card));
                color: var(--accent-brown);
            }

            .guidang-tag-pill span:first-child {
                font-size: 14px;
                font-weight: 600;
            }

            .guidang-tag-pill .guidang-tag-count {
                color: var(--text-secondary);
                font-size: 13px;
                font-weight: 400;
            }

            .guidang-panel {
                border: 1px solid var(--border-color);
                border-radius: var(--radius);
                
                box-shadow: var(--control-shadow);
                backdrop-filter: blur(9px);
                padding: 16px;
            }

            

            .guidang-toolbar {
                display: flex;
                align-items: center;
                justify-content: flex-end;
                gap: 8px;
                margin-bottom: 14px;
            }

            .guidang-switch {
                display: inline-flex;
                align-items: center;
                height: 36px;
                padding: 0 18px;
                border-radius: var(--radius);
                border: 1px solid var(--border-color);
                background: var(--bg-card);
                color: #695b4f;
                font-size: 14px;
                text-decoration: none;
                transition: all .18s ease;
            }

            :root[data-theme="dark"] .guidang-switch {
                color: var(--text-body);
                border-color: var(--border-color);
                background: var(--bg-card);
            }

            .guidang-switch:hover {
                border-color: var(--border-color);
                background: var(--control-hover-bg);
            }

            :root[data-theme="dark"] .guidang-switch:hover {
                color: var(--accent-brown);
                border-color: var(--border-color);
                background: var(--control-hover-bg);
            }

            .guidang-switch.active {
                color: #fff8ed;
                border-color: var(--border-color);
                background: var(--accent-brown);
                box-shadow: 0 9px 18px rgba(144, 92, 60, .16);
            }

            :root[data-theme="dark"] .guidang-switch.active {
                color: #1E1E1E;
                border-color: var(--border-color);
                background: var(--accent-brown);
            }

            .guidang-list {
                display: flex;
                flex-direction: column;
                gap: 10px;
            }

            .guidang-group {
                border: 1px solid var(--border-color);
                border-radius: var(--radius);
                
                overflow: hidden;
                transition: box-shadow .18s ease, border-color .18s ease, background .18s ease;
            }

            .guidang-group:hover {
                border-color: var(--border-color);
                box-shadow: 0 12px 26px rgba(80, 58, 39, .05);
                
            }

            :root[data-theme="dark"] .guidang-group:hover,
            :root[data-theme="dark"] .guidang-group.is-open {
                border-color: var(--border-color);
                
                box-shadow: var(--control-hover-shadow);
            }

            .guidang-group.is-open {
                border-color: var(--border-color);
            }

            :root[data-theme="dark"] .guidang-group.is-open {
                border-color: var(--border-color);
            }

            .guidang-group-header {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 14px;
                width: 100%;
                padding: 18px 18px;
                border: 0;
                background: transparent;
                
                cursor: pointer;
                text-align: left;
                color: inherit;
            }

            .guidang-group-left {
                display: flex;
                align-items: center;
                gap: 12px;
                min-width: 0;
            }

            .guidang-chevron {
                position: relative;
                width: 16px;
                height: 16px;
                color: var(--text-secondary);
                flex: 0 0 auto;
                transition: transform .18s ease, color .18s ease;
            }

            :root[data-theme="dark"] .guidang-chevron,
            :root[data-theme="dark"] .guidang-date,
            :root[data-theme="dark"] .guidang-tags-title svg,
            :root[data-theme="dark"] .guidang-main-icon {
                color: var(--accent-brown);
            }

            .guidang-chevron::before {
                content: "";
                position: absolute;
                left: 4px;
                top: 4px;
                width: 7px;
                height: 7px;
                border-top: 1.6px solid currentColor;
                border-right: 1.6px solid currentColor;
                transform: rotate(135deg);
            }

            .guidang-group.is-open .guidang-chevron {
                transform: rotate(-90deg);
                color: var(--accent-brown);
            }

            .guidang-group-title {
                color: #40362f;
                font-size: 18px;
                font-weight: 650;
                letter-spacing: .02em;
                white-space: nowrap;
            }

            .guidang-group-count {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                min-width: 84px;
                height: 30px;
                padding: 0 12px;
                border-radius: var(--radius-pill);
                border: 1px solid var(--border-color);
                background: color-mix(in srgb, var(--accent-gold) 14%, var(--bg-card));
                color: var(--text-secondary);
                font-size: 13px;
                white-space: nowrap;
            }

            .guidang-group-body {
                border-top: 1px solid var(--border-color);
                padding: 0 18px;
            }

            :root[data-theme="dark"] .guidang-group-body {
                border-top-color: var(--border-color);
            }

            .guidang-group-body-inner {
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                column-gap: 42px;
                row-gap: 8px;
                padding: 18px 0 16px;
            }

            .guidang-item {
                display: flex;
                align-items: baseline;
                gap: 14px;
                min-width: 0;
                padding: 4px 0;
            }

            .guidang-date {
                color: #b07c60;
                font-family: Georgia, "Times New Roman", serif;
                font-size: 14px;
                line-height: 1.4;
                white-space: nowrap;
                flex: 0 0 auto;
            }

            .guidang-link {
                min-width: 0;
                color: #4d4339;
                font-size: 15px;
                line-height: 1.7;
                text-decoration: none;
                transition: color .18s ease, transform .18s ease;
            }

            .guidang-link:hover {
                color: var(--accent-brown);
                transform: translateX(1px);
            }

            :root[data-theme="dark"] .guidang-link:hover {
                color: var(--accent-brown);
            }

            .guidang-group-body.is-collapsed {
                display: none;
            }

            .guidang-archive-content {
                transition: opacity .18s ease;
            }

            .guidang-archive-content.is-loading {
                opacity: .55;
                pointer-events: none;
            }

            .guidang-empty {
                padding: 46px 18px;
                text-align: center;
                border: 1px solid var(--border-color);
                border-radius: var(--radius);
                color: var(--text-secondary);
                
            }

            @media (max-width: 800px) {
                .guidang-hero {
                    min-height: 56px;
                    padding: 0 14px;
                    margin-bottom: 16px;
                }

                .guidang-hero-title {
                    gap: 10px;
                }

                .guidang-main-icon {
                    width: 27px;
                    height: 27px;
                }

                .guidang-hero-title strong {
                    font-size: 20px;
                }

                .guidang-hero-title span {
                    font-size: 13px;
                }

                .guidang-stats {
                    grid-template-columns: repeat(2, minmax(0, 1fr));
                    gap: 10px;
                }

                .guidang-stat {
                    min-height: auto;
                    padding: 12px 8px;
                    gap: 8px;
                    flex-direction: column;
                    justify-content: center;
                    text-align: center;
                }

                .guidang-stat-icon {
                    width: 36px;
                    height: 36px;
                    flex-basis: 36px;
                }

                .guidang-stat-icon svg {
                    width: 21px;
                    height: 21px;
                    flex-basis: 21px;
                }

                .guidang-stat-text strong {
                    font-size: clamp(22px, 8vw, 28px);
                }

                .guidang-tags {
                    padding: 16px;
                }

                .guidang-category-grid {
                    grid-template-columns: repeat(3, minmax(0, 1fr));
                }

                .guidang-category-item:nth-child(3n + 4)::before {
                    position: absolute;
                    top: 0;
                    left: 0;
                    right: -200%;
                    height: 1px;
                    background: var(--border-color);
                    content: "";
                }

                .guidang-category-item:nth-child(3n + 4) {
                    z-index: 1;
                }

                .guidang-category-item:nth-child(6n)::after {
                    display: block;
                }

                .guidang-category-item:nth-child(3n)::after,
                .guidang-category-item:last-child::after {
                    display: none;
                }

                .guidang-tag-cloud {
                    gap: 9px 8px;
                }

                .guidang-group-body-inner {
                    grid-template-columns: 1fr;
                    column-gap: 0;
                    row-gap: 6px;
                }
            }

            @media (max-width: 520px) {
                .guidang-hero-title span,
                .guidang-hero-title i {
                    display: none;
                }

                .guidang-intro {
                    font-size: 13px;
                    line-height: 1.9;
                }

                .guidang-panel {
                    padding: 12px;
                }

                .guidang-tags {
                    padding: 14px;
                }

                .guidang-tags-title {
                    font-size: 18px;
                }

                .guidang-category-grid {
                    grid-template-columns: repeat(2, minmax(0, 1fr));
                }

                .guidang-category-item:nth-child(2n + 3)::before {
                    position: absolute;
                    top: 0;
                    left: 0;
                    right: -100%;
                    height: 1px;
                    background: var(--border-color);
                    content: "";
                }

                .guidang-category-item:nth-child(2n + 3) {
                    z-index: 1;
                }

                .guidang-category-item:nth-child(3n + 4):not(:nth-child(2n + 3))::before {
                    content: none;
                }

                .guidang-category-item:nth-child(3n)::after {
                    display: block;
                }

                .guidang-category-item:nth-child(2n)::after,
                .guidang-category-item:last-child::after {
                    display: none;
                }

                .guidang-tag-cloud {
                    gap: 9px 6px;
                }

                .guidang-tag-pill {
                    padding: 0 10px;
                }

                .guidang-toolbar {
                    justify-content: stretch;
                }

                .guidang-switch {
                    flex: 1 1 0;
                    justify-content: center;
                    padding: 0 12px;
                }

                .guidang-group-header {
                    padding: 15px 14px;
                }

                .guidang-group-body {
                    padding: 0 14px;
                }

                .guidang-group-title {
                    font-size: 17px;
                }

                .guidang-group-count {
                    min-width: 74px;
                    height: 28px;
                    padding: 0 10px;
                    font-size: 12px;
                }

                .guidang-item {
                    gap: 12px;
                }

                .guidang-link {
                    font-size: 14px;
                    line-height: 1.65;
                }
            }
            /* =========================================================
             * 顶部标题卡片：统一为关于页风格
             * 电脑端：图标 + 标题 + 描述 一行显示
             * 手机端：标题在上，描述在下
             * ========================================================= */
            .guidang-hero {
                min-height: 62px !important;
                margin: 8px 0 18px !important;
                padding: 0 18px !important;
                display: flex !important;
                align-items: center !important;
                justify-content: flex-start !important;
                border-radius: var(--radius) !important;
                border: 1px solid var(--border-color);
                
                box-shadow: 0 12px 30px rgba(83, 62, 38, .045) !important;
                backdrop-filter: none !important;
                overflow: hidden !important;
            }

            .guidang-hero::before {
                display: none;
            }

            .guidang-hero::after,
            .guidang-hero-arrow {
                display: none !important;
            }

            .guidang-hero-title {
                position: relative;
                z-index: 1;
                display: grid !important;
                grid-template-columns: 31px auto 1px minmax(0, 1fr);
                grid-template-areas: "icon title line desc";
                align-items: center !important;
                gap: 0 13px !important;
                min-width: 0;
                width: 100%;
            }

            .guidang-main-icon {
                grid-area: icon;
                width: 31px !important;
                height: 31px !important;
                color: rgba(138, 96, 53, .68) !important;
                filter: none !important;
                display: block !important;
            }

            .guidang-hero-title h1 {
                font-size: 22px;
                line-height: 1.2;
                letter-spacing: .03em;
                white-space: nowrap;
                margin: 0;
                color: #3f352c;
                font-weight: 700;
            }

            .guidang-hero-title i {
                grid-area: line;
                display: block !important;
                width: 1px !important;
                height: 16px !important;
                margin: 0 !important;
                
                font-style: normal;
            }

            .guidang-hero-title span {
                grid-area: desc;
                min-width: 0;
                margin: 0 !important;
                color: #8f8172 !important;
                font-size: 13px !important;
                line-height: 1.4 !important;
                white-space: nowrap !important;
                overflow: hidden;
                text-overflow: ellipsis;
            }

            :root[data-theme="dark"] .guidang-hero {
                border-color: var(--border-color) !important;
                
                box-shadow: var(--control-shadow) !important;
            }

            :root[data-theme="dark"] .guidang-hero::before {
                display: none;
            }

            :root[data-theme="dark"] .guidang-hero-title h1 {
                color: var(--text-body) !important;
            }

            :root[data-theme="dark"] .guidang-hero-title span {
                color: var(--text-body) !important;
            }

            :root[data-theme="dark"] .guidang-main-icon {
                color: var(--accent-brown) !important;
            }

            

            @media (max-width: 680px) {
                .guidang-hero {
                    min-height: 68px !important;
                    margin: 6px 0 16px !important;
                    padding: 12px 15px !important;
                    border-radius: var(--radius) !important;
                }

                .guidang-hero::before {
                    display: none;
                }

                .guidang-hero-title {
                    grid-template-columns: 28px minmax(0, 1fr);
                    grid-template-areas:
                        "icon title"
                        "icon desc";
                    column-gap: 12px !important;
                    row-gap: 4px !important;
                }

                .guidang-main-icon {
                    width: 28px !important;
                    height: 28px !important;
                }

                .guidang-hero-title i {
                    display: none !important;
                }

                .guidang-hero-title span {
                    display: block !important;
                    font-size: 12px !important;
                    line-height: 1.45 !important;
                    white-space: normal !important;
                    overflow: visible;
                    text-overflow: clip;
                }
            }