/*
Theme Name: 紫式部テーマ (Murasaki Theme)
Theme URI: https://example.com/murasaki-theme
Author: Murasaki Dev
Description: 平安時代の雅（みやび）をコンセプトにした紫式部ポータルサイト用WordPressテーマ
Version: 1.1.0
Text Domain: murasaki-theme
*/

/* ===================================
   色彩設計 ─ 深紫と黄金

   深紫（こきむらさき） #461a5c  本文・見出し
   中紫（なかむらさき） #6b2d7b  リンク・強調
   薄紫（うすむらさき） #9b6bab  補助
   藤色（ふじいろ）     #c4a6d4  装飾線・淡彩
   白藤（しらふじ）     #ede2f4  背景アクセント

   黄金（こがね）       #b8963e  帯・見出し装飾
   淡金（うすこがね）   #d4be7a  ホバー・副装飾
   白金（はっきん）     #ede4c9  金の淡彩

   和紙白（わししろ）   #f6f1e7  地の色
   和紙鼠（わしねず）   #e3dacb  罫・区切り
   墨色（すみいろ）     #2c1e14  最濃テキスト
   薄墨（うすずみ）     #5c4d42  補助テキスト
   紅（くれない）       #b33e5c  差し色
   =================================== */
:root {
    /* ── 紫系 ── */
    --koki-murasaki:  #461a5c;
    --naka-murasaki:  #6b2d7b;
    --usu-murasaki:   #9b6bab;
    --fuji-iro:       #c4a6d4;
    --shira-fuji:     #ede2f4;

    /* ── 金系 ── */
    --kogane:         #b8963e;
    --usu-kogane:     #d4be7a;
    --hakkin:         #ede4c9;

    /* ── 和紙・墨 ── */
    --washi-shiro:    #f6f1e7;
    --washi-nezu:     #e3dacb;
    --sumi-iro:       #2c1e14;
    --usu-zumi:       #5c4d42;

    /* ── 差し色 ── */
    --kurenai:        #b33e5c;

    /* ── フォント ── */
    --font-mincho:
        "Shippori Mincho", "Noto Serif JP",
        "Yu Mincho", "游明朝", "ＭＳ 明朝",
        "Hiragino Mincho ProN", serif;
    --font-gothic:
        "Noto Sans JP", "Yu Gothic", "游ゴシック", sans-serif;
}

/* ===================================
   Reset & Base
   =================================== */
*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 16px;
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    font-family: var(--font-mincho);
    font-weight: 400;
    color: var(--koki-murasaki);
    line-height: 2;
    letter-spacing: 0.04em;

    /* ── 和紙テクスチャ ──
       細かな繊維の交差を3層で表現 */
    background-color: var(--washi-shiro);
    background-image:
        /* 第1層: 水平の繊維 */
        repeating-linear-gradient(
            0deg,
            transparent,
            transparent 1px,
            rgba(180, 168, 145, 0.07) 1px,
            rgba(180, 168, 145, 0.07) 2px,
            transparent 2px,
            transparent 5px
        ),
        /* 第2層: 垂直の繊維 */
        repeating-linear-gradient(
            90deg,
            transparent,
            transparent 1px,
            rgba(180, 168, 145, 0.05) 1px,
            rgba(180, 168, 145, 0.05) 2px,
            transparent 2px,
            transparent 7px
        ),
        /* 第3層: 斜めの繊維（和紙らしい不規則感） */
        repeating-linear-gradient(
            -45deg,
            transparent,
            transparent 3px,
            rgba(195, 182, 160, 0.04) 3px,
            rgba(195, 182, 160, 0.04) 4px,
            transparent 4px,
            transparent 11px
        ),
        /* 第4層: 全体のグラデーション（漉きムラ） */
        radial-gradient(
            ellipse at 30% 20%,
            rgba(237, 228, 201, 0.5) 0%,
            transparent 70%
        ),
        radial-gradient(
            ellipse at 75% 80%,
            rgba(227, 218, 203, 0.4) 0%,
            transparent 60%
        );
}

/* ===================================
   Typography
   =================================== */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-mincho);
    font-weight: 600;
    color: var(--koki-murasaki);
    line-height: 1.5;
}

p {
    color: var(--koki-murasaki);
    line-height: 2;
}

strong, b {
    font-weight: 700;
    color: var(--sumi-iro);
}

a {
    color: var(--naka-murasaki);
    text-decoration: none;
    transition: color 0.3s ease;
}

a:hover {
    color: var(--kogane);
}

img {
    max-width: 100%;
    height: auto;
}

::selection {
    background-color: var(--fuji-iro);
    color: var(--sumi-iro);
}

/* ===================================
   Header ─ 深紫の帳（とばり）
   =================================== */
.site-header {
    background:
        /* 金箔の粒子を散らす */
        radial-gradient(circle at 15% 40%, rgba(184, 150, 62, 0.2) 0%, transparent 40%),
        radial-gradient(circle at 85% 60%, rgba(184, 150, 62, 0.15) 0%, transparent 35%),
        radial-gradient(circle at 50% 90%, rgba(184, 150, 62, 0.1) 0%, transparent 30%),
        /* 深紫のグラデーション */
        linear-gradient(
            160deg,
            #2d0e3d 0%,
            var(--koki-murasaki) 30%,
            var(--naka-murasaki) 60%,
            var(--koki-murasaki) 80%,
            #2d0e3d 100%
        );
    color: #fff;
    padding: 0;
    position: relative;
    overflow: hidden;
}

/* 上部に金の細線 */
.site-header::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(
        90deg,
        transparent 5%,
        var(--usu-kogane) 20%,
        var(--kogane) 50%,
        var(--usu-kogane) 80%,
        transparent 95%
    );
    z-index: 2;
}

.header-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2.5rem 1.5rem 2rem;
    position: relative;
    z-index: 1;
    text-align: center;
}

.site-title {
    font-family: var(--font-mincho);
    font-size: 2.8rem;
    font-weight: 700;
    letter-spacing: 0.4em;
    margin-bottom: 0.5rem;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.4);
}

.site-title a {
    color: #fff;
    background: linear-gradient(180deg, #fff 40%, var(--usu-kogane) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.site-title a:hover {
    background: linear-gradient(180deg, var(--usu-kogane) 0%, var(--kogane) 100%);
    -webkit-background-clip: text;
    background-clip: text;
}

.site-description {
    font-family: var(--font-mincho);
    font-size: 0.95rem;
    color: var(--usu-kogane);
    letter-spacing: 0.25em;
    font-weight: 300;
}

/* ===================================
   Navigation ─ 金縁の帯
   =================================== */
.main-navigation {
    background: linear-gradient(
        180deg,
        rgba(45, 14, 61, 0.95) 0%,
        rgba(70, 26, 92, 0.95) 100%
    );
    border-top: 1px solid rgba(184, 150, 62, 0.6);
    border-bottom: 2px solid var(--kogane);
    position: relative;
}

/* 下辺に金のぼかし光 */
.main-navigation::after {
    content: "";
    position: absolute;
    bottom: -1px;
    left: 10%;
    right: 10%;
    height: 1px;
    background: radial-gradient(ellipse, rgba(212, 190, 122, 0.6), transparent);
}

.main-navigation ul {
    list-style: none;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    max-width: 1200px;
    margin: 0 auto;
}

.main-navigation li {
    position: relative;
}

.main-navigation a {
    display: block;
    color: rgba(255, 255, 255, 0.9);
    padding: 0.85rem 1.8rem;
    font-family: var(--font-mincho);
    font-size: 0.95rem;
    letter-spacing: 0.2em;
    transition: all 0.3s ease;
}

.main-navigation a:hover,
.main-navigation .current-menu-item a {
    background-color: rgba(184, 150, 62, 0.15);
    color: var(--usu-kogane);
}

/* ホバー時に下線を金で */
.main-navigation a::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 2px;
    background: var(--kogane);
    transition: all 0.3s ease;
    transform: translateX(-50%);
}

.main-navigation a:hover::after,
.main-navigation .current-menu-item a::after {
    width: 60%;
}

/* ===================================
   Main Content
   =================================== */
.site-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2.5rem 1.5rem;
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 2.5rem;
}

.site-content.full-width {
    grid-template-columns: 1fr;
}

.content-area {
    min-width: 0;
}

/* ===================================
   Hero Section ─ 紫雲の間
   =================================== */
.hero-section {
    background:
        radial-gradient(circle at 25% 30%, rgba(184, 150, 62, 0.12) 0%, transparent 50%),
        radial-gradient(circle at 75% 70%, rgba(184, 150, 62, 0.08) 0%, transparent 40%),
        linear-gradient(
            135deg,
            #2d0e3d 0%,
            var(--koki-murasaki) 40%,
            var(--naka-murasaki) 70%,
            var(--koki-murasaki) 100%
        );
    color: #fff;
    padding: 5rem 2rem;
    text-align: center;
    margin: -2.5rem -1.5rem 2.5rem -1.5rem;
    position: relative;
    background-size: cover;
    background-position: center;
}

/* 下辺の金のライン（二重） */
.hero-section::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 6px;
    background:
        linear-gradient(180deg,
            transparent 0px,
            var(--kogane) 1px,
            transparent 2px,
            transparent 3px,
            rgba(184, 150, 62, 0.4) 4px,
            transparent 5px
        );
}

.hero-title {
    font-family: var(--font-mincho);
    font-size: 3.2rem;
    font-weight: 700;
    letter-spacing: 0.5em;
    margin-bottom: 1.2rem;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
    background: linear-gradient(180deg, #fff 30%, var(--usu-kogane) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-subtitle {
    font-family: var(--font-mincho);
    font-size: 1.15rem;
    color: var(--usu-kogane);
    letter-spacing: 0.25em;
    line-height: 2.2;
    font-weight: 300;
}

/* ===================================
   Section Titles ─ 金の飾り罫
   =================================== */
.section-title {
    font-family: var(--font-mincho);
    font-size: 1.8rem;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0.3em;
    margin: 3rem 0 2rem;
    color: var(--koki-murasaki);
    position: relative;
    padding-bottom: 1rem;
}

/* 金の中央装飾線 */
.section-title::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 120px;
    height: 2px;
    background: linear-gradient(
        90deg,
        transparent,
        var(--usu-kogane) 20%,
        var(--kogane) 50%,
        var(--usu-kogane) 80%,
        transparent
    );
}

.section-title::before {
    content: "✦";
    display: block;
    font-size: 0.7rem;
    color: var(--kogane);
    margin-bottom: 0.4rem;
    letter-spacing: 0;
}

/* ===================================
   Cards & Posts ─ 和紙の料紙
   =================================== */
.post-card {
    background:
        /* カード上も和紙テクスチャ */
        repeating-linear-gradient(
            0deg,
            transparent, transparent 1px,
            rgba(180, 168, 145, 0.04) 1px,
            rgba(180, 168, 145, 0.04) 2px,
            transparent 2px, transparent 5px
        ),
        linear-gradient(180deg, #fffdf8 0%, var(--washi-shiro) 100%);
    border: 1px solid var(--washi-nezu);
    border-top: 3px solid var(--fuji-iro);
    border-radius: 2px;
    margin-bottom: 2rem;
    overflow: hidden;
    box-shadow:
        0 2px 8px rgba(70, 26, 92, 0.06),
        0 1px 3px rgba(70, 26, 92, 0.04);
    transition: all 0.35s ease;
}

.post-card:hover {
    box-shadow:
        0 6px 20px rgba(70, 26, 92, 0.12),
        0 2px 6px rgba(70, 26, 92, 0.06);
    border-top-color: var(--kogane);
    transform: translateY(-2px);
}

.post-card-thumbnail {
    width: 100%;
    height: 220px;
    object-fit: cover;
    display: block;
    filter: contrast(0.95) saturate(0.9);
    transition: filter 0.3s ease;
}

/* SVG画像の場合はcontainを使用 */
.post-card-thumbnail[src$=".svg"] {
    object-fit: contain;
    background: linear-gradient(135deg, var(--shira-fuji) 0%, var(--washi-shiro) 100%);
}

.post-card:hover .post-card-thumbnail {
    filter: contrast(1) saturate(1);
}

.post-card-body {
    padding: 1.5rem 1.8rem;
}

.post-card-title {
    font-family: var(--font-mincho);
    font-size: 1.35rem;
    font-weight: 600;
    margin-bottom: 0.6rem;
    letter-spacing: 0.12em;
    line-height: 1.6;
}

.post-card-title a {
    color: var(--koki-murasaki);
    transition: color 0.3s ease;
}

.post-card-title a:hover {
    color: var(--kogane);
}

.post-card-meta {
    font-size: 0.82rem;
    color: var(--usu-murasaki);
    margin-bottom: 0.8rem;
    font-family: var(--font-mincho);
    letter-spacing: 0.08em;
}

.post-card-excerpt {
    color: var(--usu-zumi);
    font-size: 0.95rem;
    line-height: 2;
}

/* ===================================
   Post Grid (Front Page)
   =================================== */
.post-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1.5rem;
}

.post-grid .post-card {
    margin-bottom: 0;
}

.more-link {
    display: inline-block;
    font-family: var(--font-mincho);
    color: var(--naka-murasaki);
    letter-spacing: 0.15em;
    padding: 0.5rem 0;
    border-bottom: 1px solid var(--fuji-iro);
    transition: all 0.3s ease;
}

.more-link:hover {
    color: var(--kogane);
    border-bottom-color: var(--kogane);
}

/* ===================================
   和歌表示 ─ 料紙の短冊
   =================================== */
.waka-block {
    background:
        /* 淡い金銀砂子風 */
        radial-gradient(circle at 10% 20%, rgba(184, 150, 62, 0.06) 0%, transparent 40%),
        radial-gradient(circle at 90% 80%, rgba(184, 150, 62, 0.04) 0%, transparent 30%),
        linear-gradient(135deg, var(--shira-fuji) 0%, #faf6f0 50%, var(--shira-fuji) 100%);
    border-left: 3px solid var(--kogane);
    border-right: 1px solid var(--hakkin);
    padding: 1.5rem 2rem 1.5rem 2.5rem;
    margin: 1.5rem 0;
    font-family: var(--font-mincho);
    font-size: 1.15rem;
    font-weight: 400;
    color: var(--koki-murasaki);
    line-height: 2.4;
    letter-spacing: 0.18em;
    position: relative;
}

/* 和歌記号 */
.waka-block::before {
    content: "〽";
    position: absolute;
    top: 0.3rem;
    right: 0.8rem;
    font-size: 1.8rem;
    color: var(--kogane);
    opacity: 0.3;
}

/* 下部に小さな装飾 */
.waka-block::after {
    content: "── ✦ ──";
    display: block;
    text-align: right;
    font-size: 0.6rem;
    color: var(--usu-kogane);
    margin-top: 0.5rem;
    letter-spacing: 0.3em;
    opacity: 0.6;
}

/* ===================================
   Single Post ─ 巻物風
   =================================== */
.single-post-header {
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--fuji-iro);
    position: relative;
}

/* 金の小さな菱形装飾 */
.single-post-header::after {
    content: "◆";
    position: absolute;
    bottom: -0.6rem;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.6rem;
    color: var(--kogane);
    background: var(--washi-shiro);
    padding: 0 0.8rem;
}

.single-post-title {
    font-family: var(--font-mincho);
    font-size: 2.2rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    margin-bottom: 0.6rem;
    color: var(--koki-murasaki);
    line-height: 1.5;
}

.single-post-meta {
    font-size: 0.88rem;
    color: var(--usu-murasaki);
    font-family: var(--font-mincho);
    letter-spacing: 0.1em;
}

.single-post-thumbnail {
    margin-bottom: 2rem;
    border: 1px solid var(--washi-nezu);
    border-radius: 2px;
    overflow: hidden;
}

.single-post-thumbnail img {
    width: 100%;
    height: auto;
    display: block;
}

.single-post-content {
    line-height: 2.2;
    font-size: 1.05rem;
    color: var(--koki-murasaki);
}

.single-post-content h2 {
    font-family: var(--font-mincho);
    font-size: 1.5rem;
    font-weight: 600;
    margin: 2.5rem 0 1rem;
    padding-bottom: 0.6rem;
    border-bottom: 1px solid var(--fuji-iro);
    letter-spacing: 0.15em;
    color: var(--koki-murasaki);
    position: relative;
}

/* 見出しの左に金の縦線 */
.single-post-content h2::before {
    content: "";
    position: absolute;
    left: -1rem;
    top: 0.2rem;
    bottom: 0.8rem;
    width: 3px;
    background: linear-gradient(180deg, var(--kogane), var(--usu-kogane));
    border-radius: 1px;
}

.single-post-content h3 {
    font-family: var(--font-mincho);
    font-size: 1.25rem;
    font-weight: 600;
    margin: 2rem 0 0.8rem;
    color: var(--naka-murasaki);
    letter-spacing: 0.12em;
}

.single-post-content p {
    margin-bottom: 1.6rem;
}

.post-type-label {
    font-family: var(--font-mincho);
    color: var(--kogane);
    letter-spacing: 0.3em;
    font-size: 0.85rem;
}

/* ===================================
   Post Navigation
   =================================== */
.post-navigation {
    margin-top: 3rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--washi-nezu);
}

.post-navigation a {
    font-family: var(--font-mincho);
    color: var(--naka-murasaki);
    letter-spacing: 0.1em;
}

.post-navigation a:hover {
    color: var(--kogane);
}

/* ===================================
   Sidebar ─ 冊子風
   =================================== */
.site-sidebar .widget {
    background:
        /* 和紙の繊維 */
        repeating-linear-gradient(
            0deg,
            transparent, transparent 1px,
            rgba(180, 168, 145, 0.04) 1px,
            rgba(180, 168, 145, 0.04) 2px,
            transparent 2px, transparent 5px
        ),
        repeating-linear-gradient(
            90deg,
            transparent, transparent 2px,
            rgba(180, 168, 145, 0.03) 2px,
            rgba(180, 168, 145, 0.03) 3px,
            transparent 3px, transparent 8px
        ),
        linear-gradient(180deg, #fffdf8, var(--washi-shiro));
    border: 1px solid var(--fuji-iro);
    border-top: 3px solid var(--fuji-iro);
    border-radius: 2px;
    padding: 1.5rem;
    margin-bottom: 1.8rem;
    box-shadow:
        0 2px 8px rgba(70, 26, 92, 0.05),
        inset 0 0 30px rgba(196, 166, 212, 0.04);
    position: relative;
}

/* 左上の角に和風の飾り */
.site-sidebar .widget::before {
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 20px;
    height: 20px;
    border-top: 3px solid var(--kogane);
    border-left: 3px solid var(--kogane);
    border-radius: 2px 0 0 0;
    pointer-events: none;
}

/* 右下の角に和風の飾り */
.site-sidebar .widget::after {
    content: "";
    position: absolute;
    bottom: -1px;
    right: -1px;
    width: 20px;
    height: 20px;
    border-bottom: 3px solid var(--kogane);
    border-right: 3px solid var(--kogane);
    border-radius: 0 0 2px 0;
    pointer-events: none;
}

.site-sidebar .widget-title {
    font-family: var(--font-mincho);
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--koki-murasaki);
    letter-spacing: 0.2em;
    padding-bottom: 0.6rem;
    padding-left: 1.6em;
    margin-bottom: 1rem;
    border-bottom: 1px solid var(--kogane);
    position: relative;
}

/* 見出しの頭に扇の飾り */
.site-sidebar .widget-title::before {
    content: "扇";
    position: absolute;
    left: 0;
    top: 0;
    font-size: 0.75rem;
    width: 1.3em;
    height: 1.3em;
    line-height: 1.3em;
    text-align: center;
    color: var(--kogane);
    border: 1px solid var(--usu-kogane);
    border-radius: 50%;
    font-family: var(--font-mincho);
}

/* 下部の金の菱形装飾 */
.site-sidebar .widget-title::after {
    content: "◇";
    position: absolute;
    bottom: -0.55rem;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.5rem;
    color: var(--kogane);
    background: #fffdf8;
    padding: 0 0.5rem;
}

/* ── ウィジェット種別ごとの飾り記号 ── */
.site-sidebar .widget_search .widget-title::before { content: "筆"; }
.site-sidebar .widget_recent_entries .widget-title::before { content: "巻"; }
.site-sidebar .widget_categories .widget-title::before { content: "冊"; }
.site-sidebar .widget_archive .widget-title::before { content: "暦"; }
.site-sidebar .widget_text .widget-title::before { content: "文"; }
.site-sidebar .widget_murasaki_waka .widget-title::before { content: "歌"; }
.site-sidebar .widget_murasaki_koyomi .widget-title::before { content: "月"; }
.site-sidebar .widget_murasaki_genji_list .widget-title::before { content: "帖"; }

.site-sidebar .widget ul {
    list-style: none;
}

.site-sidebar .widget li {
    padding: 0.5rem 0;
    border-bottom: 1px dotted var(--washi-nezu);
    font-size: 0.92rem;
    position: relative;
    padding-left: 1em;
}

/* リスト項目の頭に小さな菱形 */
.site-sidebar .widget li::before {
    content: "◆";
    position: absolute;
    left: 0;
    top: 0.55rem;
    font-size: 0.4rem;
    color: var(--fuji-iro);
}

.site-sidebar .widget li:last-child {
    border-bottom: none;
}

.site-sidebar .widget a {
    color: var(--koki-murasaki);
}

.site-sidebar .widget a:hover {
    color: var(--kogane);
}

/* ── 検索フォームの装飾 ── */
.site-sidebar .widget_search input[type="search"],
.site-sidebar .widget_search input[type="text"] {
    width: 100%;
    padding: 0.6rem 0.8rem;
    font-family: var(--font-mincho);
    font-size: 0.9rem;
    border: 1px solid var(--fuji-iro);
    border-radius: 2px;
    background: rgba(255, 253, 248, 0.8);
    color: var(--koki-murasaki);
    letter-spacing: 0.08em;
    transition: border-color 0.3s ease;
}

.site-sidebar .widget_search input[type="search"]:focus,
.site-sidebar .widget_search input[type="text"]:focus {
    outline: none;
    border-color: var(--kogane);
    box-shadow: 0 0 0 2px rgba(184, 150, 62, 0.15);
}

.site-sidebar .widget_search input[type="submit"] {
    display: block;
    width: 100%;
    margin-top: 0.5rem;
    padding: 0.5rem;
    font-family: var(--font-mincho);
    font-size: 0.88rem;
    letter-spacing: 0.2em;
    color: #fff;
    background: linear-gradient(135deg, var(--koki-murasaki), var(--naka-murasaki));
    border: none;
    border-radius: 2px;
    cursor: pointer;
    transition: opacity 0.3s ease;
}

.site-sidebar .widget_search input[type="submit"]:hover {
    opacity: 0.85;
}

/* ===================================
   今日の一首ウィジェット ─ 短冊
   =================================== */
.widget_murasaki_waka {
    border-top-color: var(--kogane) !important;
    overflow: visible;
}

/* ─────────────────────────────────────
   Animations
   ───────────────────────────────────── */

/* 霞が晴れるやうに ─ ぼかしと透明度が同時に解ける */
@keyframes kasumi-clear {
    0% {
        opacity: 0;
        filter: blur(6px);
        transform: translateY(8px) scale(0.98);
    }
    40% {
        opacity: 0.6;
        filter: blur(3px);
        transform: translateY(2px) scale(0.995);
    }
    70% {
        opacity: 0.9;
        filter: blur(1px);
        transform: translateY(-1px) scale(1.002);
    }
    100% {
        opacity: 1;
        filter: blur(0);
        transform: translateY(0) scale(1);
    }
}

/* 墨が滲むやうに ─ 文字がじわりと浮かぶ */
@keyframes sumi-nijimi {
    0% {
        opacity: 0;
        filter: blur(8px);
        color: transparent;
        text-shadow: 0 0 20px rgba(70, 26, 92, 0.3);
    }
    30% {
        opacity: 0.4;
        filter: blur(4px);
        color: rgba(70, 26, 92, 0.3);
        text-shadow: 0 0 12px rgba(70, 26, 92, 0.4);
    }
    60% {
        opacity: 0.8;
        filter: blur(1.5px);
        color: rgba(70, 26, 92, 0.7);
        text-shadow: 0 0 4px rgba(70, 26, 92, 0.15);
    }
    100% {
        opacity: 1;
        filter: blur(0);
        color: var(--koki-murasaki);
        text-shadow: none;
    }
}

/* 金箔のきらめき ─ 短冊の縁が微かに光る */
@keyframes kinpaku-shimmer {
    0%, 100% {
        box-shadow:
            /* 浮遊影 */
            0 4px 16px rgba(70, 26, 92, 0.10),
            0 8px 32px rgba(70, 26, 92, 0.06),
            0 1px 3px rgba(70, 26, 92, 0.08),
            /* 内側の光 */
            inset 0 0 30px rgba(184, 150, 62, 0.03),
            /* 縁の金光 */
            0 0 0 1px rgba(184, 150, 62, 0.15);
    }
    50% {
        box-shadow:
            0 6px 20px rgba(70, 26, 92, 0.12),
            0 10px 40px rgba(70, 26, 92, 0.07),
            0 1px 3px rgba(70, 26, 92, 0.08),
            inset 0 0 40px rgba(184, 150, 62, 0.06),
            0 0 0 1px rgba(184, 150, 62, 0.3);
    }
}

/* 解説がふわりと浮かぶ */
@keyframes note-float {
    0% {
        opacity: 0;
        transform: translateY(6px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ─────────────────────────────────────
   短冊レイアウト ─ 解説（左）＋短冊（右）
   ───────────────────────────────────── */
.tanzaku-layout {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 0;
}

/* ─────────────────────────────────────
   短冊本体
   ───────────────────────────────────── */
.tanzaku {
    /* ── 生成り色の和紙 ── */
    background:
        /* 金砂子（きんすなご）─ 斜めに散らす */
        radial-gradient(1px 1px at 12% 18%, rgba(184, 150, 62, 0.20) 50%, transparent 50%),
        radial-gradient(1px 1px at 78% 32%, rgba(184, 150, 62, 0.16) 50%, transparent 50%),
        radial-gradient(1px 1px at 35% 68%, rgba(184, 150, 62, 0.14) 50%, transparent 50%),
        radial-gradient(1px 1px at 62% 85%, rgba(184, 150, 62, 0.18) 50%, transparent 50%),
        radial-gradient(1px 1px at 88% 55%, rgba(184, 150, 62, 0.12) 50%, transparent 50%),
        radial-gradient(1px 1px at 22% 90%, rgba(184, 150, 62, 0.16) 50%, transparent 50%),
        /* 和紙の繊維 ─ 縦横 */
        repeating-linear-gradient(
            2deg,
            transparent, transparent 1px,
            rgba(175, 160, 125, 0.035) 1px,
            rgba(175, 160, 125, 0.035) 2px,
            transparent 2px, transparent 5px
        ),
        repeating-linear-gradient(
            88deg,
            transparent, transparent 2px,
            rgba(175, 160, 125, 0.025) 2px,
            rgba(175, 160, 125, 0.025) 3px,
            transparent 3px, transparent 8px
        ),
        /* ベース ─ 生成り色（#f5f5dc） */
        linear-gradient(
            175deg,
            #f7f6e2 0%,
            #f5f5dc 40%,
            #f3f1d6 70%,
            #f0eed0 100%
        );

    /* ── 短冊の形 ── */
    flex-shrink: 0;
    margin: 0;
    padding: 0;
    width: 155px;
    min-height: 380px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    border: none;
    border-radius: 6px;

    /* ── 赤い紐（右側 1px） ── */
    border-right: 1px solid #c04040;

    /* ── 浮遊する短冊 ─ 多層 box-shadow ── */
    box-shadow:
        0 1px 2px rgba(70, 26, 92, 0.10),
        0 4px 16px rgba(70, 26, 92, 0.08),
        0 8px 32px rgba(70, 26, 92, 0.05),
        0 16px 48px rgba(70, 26, 92, 0.03),
        inset 0 0 30px rgba(184, 150, 62, 0.03),
        inset 0 2px 8px rgba(255, 252, 240, 0.5),
        0 0 0 1px rgba(184, 150, 62, 0.15);

    /* ── アニメーション ── */
    animation:
        kasumi-clear 1.8s cubic-bezier(0.23, 1, 0.32, 1) both,
        kinpaku-shimmer 6s ease-in-out 2.5s infinite;
}

/* ── 短冊上部の紐穴と赤い紐 ── */
.tanzaku::before {
    content: "";
    position: absolute;
    top: 0;
    right: -1px;
    width: 1px;
    height: 12px;
    background: linear-gradient(to bottom, #b83030, #c04040);
    /* 紐が上に伸びるイメージ */
    box-shadow:
        0 -6px 0 0 rgba(184, 48, 48, 0.6),
        0 -12px 0 0 rgba(184, 48, 48, 0.3);
    animation: kasumi-clear 1.8s cubic-bezier(0.23, 1, 0.32, 1) 0.3s both;
}

/* ── 短冊の内枠 ─ 金の罫線 ── */
.tanzaku::after {
    content: "";
    position: absolute;
    top: 20px;
    bottom: 14px;
    left: 10px;
    right: 10px;
    border: 1px solid rgba(184, 150, 62, 0.10);
    border-radius: 2px;
    pointer-events: none;
    background:
        radial-gradient(circle at 0% 0%, rgba(184, 150, 62, 0.25) 2px, transparent 2px),
        radial-gradient(circle at 100% 0%, rgba(184, 150, 62, 0.25) 2px, transparent 2px),
        radial-gradient(circle at 0% 100%, rgba(184, 150, 62, 0.25) 2px, transparent 2px),
        radial-gradient(circle at 100% 100%, rgba(184, 150, 62, 0.25) 2px, transparent 2px);
    animation: kasumi-clear 1.8s cubic-bezier(0.23, 1, 0.32, 1) 0.2s both;
}

/* ── ホバー時 ─ 短冊がわずかに浮き上がる ── */
.tanzaku:hover {
    box-shadow:
        0 2px 4px rgba(70, 26, 92, 0.08),
        0 8px 24px rgba(70, 26, 92, 0.10),
        0 16px 48px rgba(70, 26, 92, 0.06),
        0 24px 64px rgba(70, 26, 92, 0.03),
        inset 0 0 30px rgba(184, 150, 62, 0.05),
        inset 0 2px 8px rgba(255, 252, 240, 0.6),
        0 0 0 1px rgba(184, 150, 62, 0.3);
    transform: translateY(-3px);
    transition: box-shadow 0.5s ease, transform 0.5s ease;
}

/* ─────────────────────────────────────
   短冊内部 ─ 縦書き
   ───────────────────────────────────── */
.tanzaku-inner {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    -webkit-text-orientation: mixed;
    font-family: var(--font-mincho);
    color: var(--koki-murasaki);
    display: flex;
    gap: 0.3rem;
    padding: 1.6rem 0.5rem 0.8rem;
    height: 100%;
    min-height: 340px;
    position: relative;
    z-index: 1;
}

/* ── 上の句 ── */
.tanzaku-kami {
    font-size: 1.05rem;
    font-weight: 500;
    line-height: 2.1;
    letter-spacing: 0.4em;
    animation: sumi-nijimi 2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.5s both;
}

/* ── 下の句 ── */
.tanzaku-shimo {
    font-size: 1.05rem;
    font-weight: 500;
    line-height: 2.1;
    letter-spacing: 0.4em;
    animation: sumi-nijimi 2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.2s both;
}

/* ── 詠み人・帖名 ── */
.tanzaku-credit {
    font-size: 0.7rem;
    color: var(--usu-murasaki);
    line-height: 1.6;
    letter-spacing: 0.15em;
    padding-top: 2em;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    animation: sumi-nijimi 1.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.8s both;
}

.tanzaku-author {
    font-weight: 600;
    color: var(--naka-murasaki);
}

.tanzaku-chapter {
    font-size: 0.65rem;
    color: var(--usu-murasaki);
}

/* ─────────────────────────────────────
   解説エリア（短冊の左側）
   ───────────────────────────────────── */
.tanzaku-commentary {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1.2rem 0.5rem 0.5rem 0;
    overflow: hidden;
    animation: note-float 0.8s ease-out 2.8s both;
}

.tanzaku-translation {
    padding: 0.4rem 0.5rem;
    background: linear-gradient(135deg, rgba(250, 245, 232, 0.4), rgba(245, 238, 220, 0.2));
    border-left: 1.5px solid var(--usu-kogane);
    border-radius: 0 2px 2px 0;
}

.tanzaku-translation-label {
    display: block;
    font-family: var(--font-mincho);
    font-size: 0.55rem;
    font-weight: 600;
    color: var(--usu-murasaki);
    letter-spacing: 0.15em;
    margin-bottom: 0.15rem;
    opacity: 0.7;
}

.tanzaku-translation-text {
    font-family: var(--font-mincho);
    font-size: 0.68rem;
    font-weight: 400;
    color: var(--koki-murasaki);
    line-height: 1.75;
    letter-spacing: 0.02em;
    margin: 0;
    opacity: 0.85;
}

/* ─────────────────────────────────────
   紫式部からの解説エリア（左側）
   ───────────────────────────────────── */
.tanzaku-note {
    padding: 0.4rem 0.5rem;
    background: linear-gradient(135deg, rgba(246, 242, 248, 0.4), rgba(250, 246, 240, 0.3));
    border-left: 1.5px solid var(--fuji-iro);
    border-radius: 0 2px 2px 0;
    position: relative;
}

.tanzaku-note-label {
    display: block;
    font-family: var(--font-mincho);
    font-size: 0.55rem;
    font-weight: 600;
    color: var(--kogane);
    letter-spacing: 0.15em;
    margin-bottom: 0.2rem;
    opacity: 0.7;
}

.tanzaku-note-label::before {
    content: "── ";
    font-size: 0.45rem;
    opacity: 0.5;
}

.tanzaku-note-label::after {
    content: " ──";
    font-size: 0.45rem;
    opacity: 0.5;
}

.tanzaku-note-text {
    font-family: var(--font-mincho);
    font-size: 0.65rem;
    font-weight: 400;
    color: var(--usu-zumi);
    line-height: 1.75;
    letter-spacing: 0.03em;
    margin: 0;
    opacity: 0.85;
}

/* ===================================
   平安の暦ウィジェット
   =================================== */
.widget_murasaki_koyomi {
    border-top-color: var(--kogane) !important;
    text-align: center;
}

.koyomi-month-name {
    font-family: var(--font-mincho);
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--koki-murasaki);
    letter-spacing: 0.35em;
    margin-bottom: 0.2rem;
}

.koyomi-month-reading {
    font-family: var(--font-mincho);
    font-size: 0.78rem;
    color: var(--usu-murasaki);
    letter-spacing: 0.15em;
    margin-bottom: 0.8rem;
}

.koyomi-date {
    font-family: var(--font-mincho);
    font-size: 0.88rem;
    color: var(--usu-zumi);
    letter-spacing: 0.1em;
    line-height: 1.8;
}

.koyomi-season {
    display: inline-block;
    margin-top: 0.8rem;
    padding: 0.3rem 1.2rem;
    font-family: var(--font-mincho);
    font-size: 0.82rem;
    letter-spacing: 0.2em;
    color: var(--kogane);
    border: 1px solid var(--usu-kogane);
    border-radius: 2px;
    background: rgba(184, 150, 62, 0.05);
}

.koyomi-kisetsu-word {
    display: block;
    margin-top: 0.6rem;
    font-family: var(--font-mincho);
    font-size: 0.85rem;
    color: var(--naka-murasaki);
    letter-spacing: 0.12em;
    font-style: italic;
}

/* ===================================
   源氏物語一覧ウィジェット
   =================================== */
.genji-list-item {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.genji-list-number {
    font-family: var(--font-mincho);
    font-size: 0.7rem;
    color: var(--usu-murasaki);
    flex-shrink: 0;
    min-width: 1.5em;
    text-align: right;
}

/* ===================================
   Archive Header
   =================================== */
.archive-header {
    margin-bottom: 2rem;
}

.archive-description {
    font-family: var(--font-mincho);
    color: var(--usu-zumi);
    text-align: center;
    font-size: 0.95rem;
    letter-spacing: 0.1em;
}

/* ===================================
   Front Section
   =================================== */
.front-section {
    margin-bottom: 2rem;
}

/* ===================================
   Footer ─ 深紫の裾
   =================================== */
.site-footer {
    background:
        radial-gradient(circle at 20% 50%, rgba(184, 150, 62, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 80% 50%, rgba(184, 150, 62, 0.06) 0%, transparent 40%),
        linear-gradient(
            180deg,
            var(--koki-murasaki) 0%,
            #2d0e3d 40%,
            #1e0a2a 100%
        );
    color: rgba(255, 255, 255, 0.8);
    text-align: center;
    padding: 2.5rem 1.5rem;
    margin-top: 3rem;
    position: relative;
}

/* 上辺の金帯（二重線） */
.site-footer::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background:
        linear-gradient(180deg,
            var(--kogane) 0px,
            var(--kogane) 1px,
            transparent 1px,
            transparent 2px,
            rgba(184, 150, 62, 0.4) 2px,
            rgba(184, 150, 62, 0.4) 3px,
            transparent 3px
        );
}

.footer-widgets {
    max-width: 1200px;
    margin: 0 auto 2rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 2rem;
    text-align: left;
}

.footer-widgets .widget-title {
    font-family: var(--font-mincho);
    color: var(--usu-kogane);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.2em;
    margin-bottom: 0.8rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid rgba(184, 150, 62, 0.3);
}

.footer-widgets a {
    color: rgba(255, 255, 255, 0.65);
    font-family: var(--font-mincho);
    letter-spacing: 0.05em;
}

.footer-widgets a:hover {
    color: var(--usu-kogane);
}

.site-footer .copyright {
    font-family: var(--font-mincho);
    font-size: 0.85rem;
    letter-spacing: 0.15em;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.5);
}

/* ===================================
   Pagination
   =================================== */
.pagination {
    text-align: center;
    margin: 2.5rem 0;
}

.pagination .page-numbers {
    display: inline-block;
    padding: 0.5rem 1rem;
    margin: 0 0.25rem;
    border: 1px solid var(--fuji-iro);
    border-radius: 2px;
    font-family: var(--font-mincho);
    color: var(--koki-murasaki);
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

.pagination .page-numbers:hover {
    border-color: var(--kogane);
    color: var(--kogane);
}

.pagination .current {
    background: linear-gradient(135deg, var(--koki-murasaki), var(--naka-murasaki));
    color: #fff;
    border-color: var(--koki-murasaki);
}

/* ===================================
   Responsive ─ 端末対応
   =================================== */
@media (max-width: 768px) {
    .site-content {
        grid-template-columns: 1fr;
        padding: 1.5rem 1rem;
    }

    .site-title {
        font-size: 2rem;
        letter-spacing: 0.25em;
    }

    .hero-section {
        padding: 3rem 1.5rem;
        margin: -1.5rem -1rem 2rem -1rem;
    }

    .hero-title {
        font-size: 2.2rem;
        letter-spacing: 0.3em;
    }

    .hero-subtitle {
        font-size: 1rem;
    }

    .main-navigation ul {
        flex-direction: column;
        align-items: center;
    }

    .main-navigation a {
        padding: 0.7rem 1.5rem;
    }

    .section-title {
        font-size: 1.4rem;
        letter-spacing: 0.2em;
    }

    .post-grid {
        grid-template-columns: 1fr;
    }

    .single-post-title {
        font-size: 1.6rem;
    }

    .single-post-content h2::before {
        display: none;
    }

    .waka-block {
        padding: 1.2rem 1.5rem;
        font-size: 1.05rem;
    }

    .tanzaku {
        width: 200px;
        min-height: 320px;
    }

    .tanzaku-inner {
        min-height: 280px;
        padding: 1.8rem 0.5rem 0.8rem;
        gap: 0.3rem;
    }

    .tanzaku-kami,
    .tanzaku-shimo {
        font-size: 1rem;
        letter-spacing: 0.18em;
    }

    .tanzaku-credit {
        font-size: 0.65rem;
    }

    .post-card-body {
        padding: 1.2rem 1.3rem;
    }
}

@media (max-width: 480px) {
    .site-title {
        font-size: 1.6rem;
        letter-spacing: 0.15em;
    }

    .hero-title {
        font-size: 1.7rem;
        letter-spacing: 0.2em;
    }

    .section-title::before {
        display: none;
    }
}

/* ===================================
   季節カラースキーム（CSS変数）
   =================================== */
.season-spring {
    --seasonal-primary: #e8a0b4;
    --seasonal-secondary: #8b6ca3;
    --seasonal-accent: #f2c4a0;
    --seasonal-gradient-start: #f2c4a0;
    --seasonal-gradient-end: #c4a0d4;
    /* 曙色（あけぼのいろ） */
    --akebono: #f2c4a0;
    --akebono-deep: #e8a07a;
    /* 若紫（わかむらさき） */
    --waka-murasaki: #c4a0d4;
    --waka-murasaki-deep: #8b6ca3;
}

.season-summer {
    --seasonal-primary: #7fb5db;
    --seasonal-secondary: #2e7d32;
    --seasonal-accent: #81d4fa;
    --seasonal-gradient-start: #7fb5db;
    --seasonal-gradient-end: #388e3c;
}

.season-autumn {
    --seasonal-primary: #c73e3a;
    --seasonal-secondary: #f9a825;
    --seasonal-accent: #ef6c00;
    --seasonal-gradient-start: #c73e3a;
    --seasonal-gradient-end: #f9a825;
}

.season-winter {
    --seasonal-primary: #a8c5db;
    --seasonal-secondary: #b0bec5;
    --seasonal-accent: #e0e0e0;
    --seasonal-gradient-start: #e8eaf6;
    --seasonal-gradient-end: #a8c5db;
}

/* ===================================
   日記アーカイブヘッダー
   =================================== */
.diary-archive-header {
    text-align: center;
    margin-bottom: 2.5rem;
    padding: 2.5rem 2rem 2rem;
    background:
        repeating-linear-gradient(
            0deg,
            transparent, transparent 1px,
            rgba(180, 168, 145, 0.04) 1px,
            rgba(180, 168, 145, 0.04) 2px,
            transparent 2px, transparent 5px
        ),
        linear-gradient(180deg, #fffdf8 0%, var(--washi-shiro) 100%);
    border: 1px solid var(--washi-nezu);
    border-top: 4px solid var(--seasonal-primary, var(--fuji-iro));
    border-radius: 2px;
    position: relative;
}

.diary-archive-icon {
    display: block;
    font-size: 2.5rem;
    margin-bottom: 0.5rem;
    line-height: 1;
}

.diary-archive-title {
    font-family: var(--font-mincho);
    font-size: 2rem;
    font-weight: 700;
    letter-spacing: 0.4em;
    color: var(--koki-murasaki);
    margin-bottom: 0.8rem;
}

.diary-archive-lunar {
    margin-bottom: 0.5rem;
}

.diary-archive-month-name {
    font-family: var(--font-mincho);
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--koki-murasaki);
    letter-spacing: 0.3em;
    margin-right: 0.5rem;
}

.diary-archive-month-reading {
    font-family: var(--font-mincho);
    font-size: 0.8rem;
    color: var(--usu-murasaki);
    letter-spacing: 0.15em;
}

.diary-archive-word {
    font-family: var(--font-mincho);
    font-size: 0.9rem;
    color: var(--naka-murasaki);
    letter-spacing: 0.12em;
    font-style: italic;
    margin-bottom: 0.8rem;
}

.diary-archive-season-badge {
    display: inline-block;
    padding: 0.25rem 1.2rem;
    font-family: var(--font-mincho);
    font-size: 0.82rem;
    letter-spacing: 0.2em;
    color: var(--seasonal-primary, var(--kogane));
    border: 1px solid var(--seasonal-primary, var(--usu-kogane));
    border-radius: 2px;
    background: rgba(0, 0, 0, 0.02);
}

/* ===================================
   日記カードグリッド
   =================================== */
.diary-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1.8rem;
}

/* ===================================
   日記カード ─ 和紙テクスチャ
   =================================== */
.diary-card {
    background:
        repeating-linear-gradient(
            0deg,
            transparent, transparent 1px,
            rgba(180, 168, 145, 0.05) 1px,
            rgba(180, 168, 145, 0.05) 2px,
            transparent 2px, transparent 5px
        ),
        repeating-linear-gradient(
            90deg,
            transparent, transparent 2px,
            rgba(180, 168, 145, 0.03) 2px,
            rgba(180, 168, 145, 0.03) 3px,
            transparent 3px, transparent 8px
        ),
        repeating-linear-gradient(
            -45deg,
            transparent, transparent 3px,
            rgba(195, 182, 160, 0.03) 3px,
            rgba(195, 182, 160, 0.03) 4px,
            transparent 4px, transparent 11px
        ),
        linear-gradient(180deg, #fffdf8 0%, var(--washi-shiro) 100%);
    border: 1px solid var(--washi-nezu);
    border-left: 3px solid var(--seasonal-primary, var(--fuji-iro));
    border-radius: 2px;
    overflow: hidden;
    box-shadow:
        0 2px 8px rgba(70, 26, 92, 0.06),
        0 1px 3px rgba(70, 26, 92, 0.04);
    transition: all 0.35s ease;
    position: relative;
}

/* 右上の墨筆装飾 */
.diary-card::after {
    content: "◇";
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    font-size: 0.6rem;
    color: var(--seasonal-primary, var(--fuji-iro));
    opacity: 0.4;
    z-index: 1;
    pointer-events: none;
}

.diary-card:hover {
    box-shadow:
        0 8px 24px rgba(70, 26, 92, 0.12),
        0 3px 8px rgba(70, 26, 92, 0.06);
    transform: translateY(-3px);
    border-left-color: var(--kogane);
}

/* ── カード画像 ── */
.diary-card-image-link {
    display: block;
    overflow: hidden;
}

.diary-card-thumbnail {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
    filter: contrast(0.95) saturate(0.9);
    transition: filter 0.3s ease, transform 0.4s ease;
}

.diary-card:hover .diary-card-thumbnail {
    filter: contrast(1) saturate(1);
    transform: scale(1.03);
}

/* ===================================
   日記カード季節プレースホルダー
   =================================== */
.diary-card-placeholder {
    width: 100%;
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.diary-card-placeholder.season-spring {
    background: linear-gradient(135deg, #f2c4a0 0%, #e8a0b4 50%, #c4a0d4 100%);
}

.diary-card-placeholder.season-summer {
    background: linear-gradient(135deg, #7fb5db 0%, #388e3c 50%, #81d4fa 100%);
}

.diary-card-placeholder.season-autumn {
    background: linear-gradient(135deg, #c73e3a 0%, #f9a825 50%, #ef6c00 100%);
}

.diary-card-placeholder.season-winter {
    background: linear-gradient(135deg, #e8eaf6 0%, #a8c5db 50%, #cfd8dc 100%);
}

.diary-card-placeholder-icon {
    font-size: 3rem;
    opacity: 0.6;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.15));
}

/* ── カード本文 ── */
.diary-card-body {
    padding: 1.3rem 1.5rem;
    position: relative;
}

.diary-card-date-badge {
    display: inline-block;
    font-family: var(--font-mincho);
    font-size: 0.75rem;
    color: var(--seasonal-primary, var(--naka-murasaki));
    letter-spacing: 0.1em;
    padding: 0.15rem 0.6rem;
    border: 1px solid var(--seasonal-primary, var(--fuji-iro));
    border-radius: 2px;
    margin-bottom: 0.6rem;
    background: rgba(255, 255, 255, 0.6);
}

.diary-card-title {
    font-family: var(--font-mincho);
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    letter-spacing: 0.1em;
    line-height: 1.6;
}

.diary-card-title a {
    color: var(--koki-murasaki);
    transition: color 0.3s ease;
}

.diary-card-title a:hover {
    color: var(--kogane);
}

.diary-card-waka {
    font-family: var(--font-mincho);
    font-size: 0.82rem;
    color: var(--naka-murasaki);
    letter-spacing: 0.1em;
    line-height: 1.8;
    padding: 0.4rem 0.6rem;
    margin-bottom: 0.6rem;
    background: linear-gradient(135deg, rgba(250, 245, 232, 0.5), rgba(237, 226, 244, 0.3));
    border-left: 2px solid var(--usu-kogane);
    border-radius: 0 2px 2px 0;
}

.diary-card-excerpt {
    color: var(--usu-zumi);
    font-size: 0.9rem;
    line-height: 1.9;
    margin-bottom: 0.8rem;
}

.diary-card-more {
    display: inline-block;
    font-family: var(--font-mincho);
    font-size: 0.85rem;
    color: var(--naka-murasaki);
    letter-spacing: 0.12em;
    border-bottom: 1px solid var(--fuji-iro);
    padding-bottom: 0.15rem;
    transition: all 0.3s ease;
}

.diary-card-more:hover {
    color: var(--kogane);
    border-bottom-color: var(--kogane);
}

.diary-empty {
    text-align: center;
    font-family: var(--font-mincho);
    font-size: 1rem;
    color: var(--usu-zumi);
    padding: 3rem 0;
    letter-spacing: 0.1em;
}

/* ===================================
   個別ページ ─ 季節バッジ（丸型）
   =================================== */
.single-diary {
    position: relative;
}

.diary-season-badge {
    position: absolute;
    top: 0;
    right: 0;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.6) 100%);
    border: 2px solid var(--seasonal-primary, var(--fuji-iro));
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    z-index: 2;
}

.diary-season-badge-icon {
    font-size: 1.2rem;
    line-height: 1;
}

.diary-season-badge-label {
    font-family: var(--font-mincho);
    font-size: 0.6rem;
    font-weight: 600;
    color: var(--koki-murasaki);
    letter-spacing: 0.1em;
    line-height: 1;
    margin-top: 0.1rem;
}

/* ── 個別ページ旧暦日付 ── */
.diary-meta {
    display: flex;
    align-items: baseline;
    gap: 0.8rem;
    flex-wrap: wrap;
}

.diary-lunar-date {
    font-family: var(--font-mincho);
    font-size: 1rem;
    color: var(--koki-murasaki);
    letter-spacing: 0.15em;
    font-weight: 500;
}

.diary-western-date {
    font-family: var(--font-mincho);
    font-size: 0.78rem;
    color: var(--usu-murasaki);
    letter-spacing: 0.08em;
}

/* ===================================
   個別ページ ─ 季節プレースホルダー
   =================================== */
.diary-single-placeholder {
    width: 100%;
    height: 280px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 2rem;
    border: 1px solid var(--washi-nezu);
    border-radius: 2px;
    position: relative;
    overflow: hidden;
}

.diary-single-placeholder.season-spring {
    background: linear-gradient(135deg, #f2c4a0 0%, #e8a0b4 40%, #c4a0d4 70%, #8b6ca3 100%);
}

.diary-single-placeholder.season-summer {
    background: linear-gradient(135deg, #7fb5db 0%, #388e3c 40%, #81d4fa 70%, #2e7d32 100%);
}

.diary-single-placeholder.season-autumn {
    background: linear-gradient(135deg, #c73e3a 0%, #f9a825 40%, #ef6c00 70%, #fdd835 100%);
}

.diary-single-placeholder.season-winter {
    background: linear-gradient(135deg, #e8eaf6 0%, #a8c5db 40%, #cfd8dc 70%, #b0bec5 100%);
}

.diary-single-placeholder-icon {
    font-size: 4rem;
    opacity: 0.7;
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.15));
}

.diary-single-placeholder-word {
    font-family: var(--font-mincho);
    font-size: 0.95rem;
    color: rgba(255, 255, 255, 0.95);
    letter-spacing: 0.2em;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
    font-weight: 500;
}

/* 冬の文字色は暗めに */
.diary-single-placeholder.season-winter .diary-single-placeholder-word {
    color: var(--koki-murasaki);
    text-shadow: none;
}

/* ===================================
   日記レスポンシブ
   =================================== */
@media (max-width: 768px) {
    .diary-card-grid {
        grid-template-columns: 1fr;
    }

    .diary-archive-header {
        padding: 1.8rem 1.2rem 1.5rem;
    }

    .diary-archive-title {
        font-size: 1.6rem;
        letter-spacing: 0.25em;
    }

    .diary-archive-month-name {
        font-size: 1.2rem;
    }

    .diary-season-badge {
        width: 48px;
        height: 48px;
    }

    .diary-season-badge-icon {
        font-size: 1rem;
    }

    .diary-season-badge-label {
        font-size: 0.55rem;
    }

    .diary-single-placeholder {
        height: 200px;
    }

    .diary-single-placeholder-icon {
        font-size: 3rem;
    }

    .diary-single-placeholder-word {
        font-size: 0.85rem;
    }
}

@media (max-width: 480px) {
    .diary-archive-header {
        padding: 1.2rem 0.8rem 1rem;
    }

    .diary-archive-title {
        font-size: 1.3rem;
        letter-spacing: 0.15em;
    }

    .diary-archive-icon {
        font-size: 2rem;
    }

    .diary-card-body {
        padding: 1rem 1.1rem;
    }

    .diary-card-title {
        font-size: 1.05rem;
    }

    .diary-card-excerpt {
        font-size: 0.85rem;
    }

    .diary-season-badge {
        width: 42px;
        height: 42px;
    }

    .diary-season-badge-icon {
        font-size: 0.9rem;
    }
}

/* ===================================
   春はあけぼの ─ 曙色と若紫の世界
   =================================== */

/* たなびく雲のアニメーション */
@keyframes tanabiku-drift {
    0%   { transform: translateX(-5%) scaleX(1); opacity: 0.3; }
    25%  { transform: translateX(2%) scaleX(1.05); opacity: 0.5; }
    50%  { transform: translateX(8%) scaleX(1.1); opacity: 0.4; }
    75%  { transform: translateX(3%) scaleX(1.02); opacity: 0.55; }
    100% { transform: translateX(-5%) scaleX(1); opacity: 0.3; }
}

@keyframes tanabiku-drift-slow {
    0%   { transform: translateX(5%) scaleX(1.05); opacity: 0.2; }
    30%  { transform: translateX(-3%) scaleX(1); opacity: 0.35; }
    60%  { transform: translateX(-8%) scaleX(0.95); opacity: 0.25; }
    100% { transform: translateX(5%) scaleX(1.05); opacity: 0.2; }
}

@keyframes tanabiku-drift-mid {
    0%   { transform: translateX(0%) scaleX(1); opacity: 0.25; }
    40%  { transform: translateX(6%) scaleX(1.08); opacity: 0.4; }
    70%  { transform: translateX(-4%) scaleX(0.98); opacity: 0.3; }
    100% { transform: translateX(0%) scaleX(1); opacity: 0.25; }
}

/* 春の日記ページ ─ たなびく雲を背景に */
body.season-spring .diary-archive-header {
    border-top-color: transparent;
    background:
        repeating-linear-gradient(
            0deg,
            transparent, transparent 1px,
            rgba(180, 168, 145, 0.03) 1px,
            rgba(180, 168, 145, 0.03) 2px,
            transparent 2px, transparent 5px
        ),
        linear-gradient(
            135deg,
            #fdf6f0 0%,
            #fceee4 30%,
            #f8e8f0 60%,
            #f0e0f0 100%
        );
    position: relative;
    overflow: hidden;
}

/* 曙色→若紫のグラデーション上線 */
body.season-spring .diary-archive-header::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(
        90deg,
        #f2c4a0 0%,
        #e8a0b4 35%,
        #c4a0d4 65%,
        #8b6ca3 100%
    );
    z-index: 2;
}

/* たなびく雲 第1層 ─ ゆるやかに流れる上の雲 */
body.season-spring .diary-archive-header::after {
    content: "";
    position: absolute;
    top: 15%;
    left: -10%;
    right: -10%;
    height: 40px;
    background:
        radial-gradient(ellipse 200px 30px at 20% 50%, rgba(242, 196, 160, 0.4) 0%, transparent 70%),
        radial-gradient(ellipse 300px 25px at 55% 50%, rgba(232, 160, 180, 0.35) 0%, transparent 70%),
        radial-gradient(ellipse 180px 20px at 80% 50%, rgba(196, 160, 212, 0.3) 0%, transparent 70%);
    animation: tanabiku-drift 20s ease-in-out infinite;
    pointer-events: none;
    z-index: 1;
}

/* 春の単独ページにもたなびく雲 */
body.season-spring .single-diary {
    position: relative;
    overflow: visible;
}

body.season-spring .single-diary::before {
    content: "";
    position: absolute;
    top: -10px;
    left: -20px;
    right: -20px;
    height: 60px;
    background:
        radial-gradient(ellipse 250px 35px at 15% 50%, rgba(242, 196, 160, 0.25) 0%, transparent 70%),
        radial-gradient(ellipse 350px 30px at 50% 50%, rgba(232, 160, 180, 0.2) 0%, transparent 70%),
        radial-gradient(ellipse 200px 25px at 85% 50%, rgba(196, 160, 212, 0.2) 0%, transparent 70%);
    animation: tanabiku-drift-slow 25s ease-in-out infinite;
    pointer-events: none;
    z-index: 0;
}

/* 日記カードにもほんのり曙色の光 */
body.season-spring .diary-card {
    border-left-color: #e8a0b4;
}

body.season-spring .diary-card:hover {
    border-left-color: #c4a0d4;
    box-shadow:
        0 8px 24px rgba(139, 108, 163, 0.12),
        0 3px 8px rgba(232, 160, 180, 0.08);
}

/* 春の日記ヘッダー ─ 曙のグラデーション帯 */
body.season-spring .single-post-header {
    border-bottom-color: #e8a0b4;
}

body.season-spring .single-post-header::after {
    color: #c4a0d4;
}

/* 春のバッジカラー */
body.season-spring .diary-season-badge {
    border-color: #e8a0b4;
    background:
        radial-gradient(circle,
            rgba(252, 238, 228, 0.95) 0%,
            rgba(248, 232, 240, 0.8) 100%
        );
}

body.season-spring .diary-card-date-badge {
    color: #8b6ca3;
    border-color: #c4a0d4;
}

/* 春の和歌ブロック ─ 曙色のアクセント */
body.season-spring .waka-block {
    border-left-color: #e8a0b4;
    background:
        radial-gradient(circle at 10% 20%, rgba(242, 196, 160, 0.06) 0%, transparent 40%),
        radial-gradient(circle at 90% 80%, rgba(196, 160, 212, 0.04) 0%, transparent 30%),
        linear-gradient(135deg, #fdf6f0 0%, #faf0f4 50%, #f0e8f4 100%);
}

/* 日記アーカイブ内のたなびく雲 第2層 */
.diary-archive-clouds {
    position: absolute;
    bottom: 20%;
    left: -10%;
    right: -10%;
    height: 35px;
    background:
        radial-gradient(ellipse 280px 28px at 30% 50%, rgba(196, 160, 212, 0.3) 0%, transparent 70%),
        radial-gradient(ellipse 220px 22px at 65% 50%, rgba(242, 196, 160, 0.25) 0%, transparent 70%),
        radial-gradient(ellipse 160px 18px at 90% 50%, rgba(232, 160, 180, 0.2) 0%, transparent 70%);
    animation: tanabiku-drift-mid 18s ease-in-out infinite;
    pointer-events: none;
    z-index: 1;
}

@media (max-width: 768px) {
    body.season-spring .single-diary::before {
        left: -10px;
        right: -10px;
        height: 40px;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.season-spring .diary-archive-header::after,
    body.season-spring .single-diary::before,
    .diary-archive-clouds {
        animation: none;
    }
}

/* ===================================
   若紫専用 ─ 春の北山仕様
   =================================== */

/* 若紫ページに春の装飾を適用 */
body.single-genji.spring-theme {
    --sakura-iro: #e8a0b4;      /* 桜色 */
    --moegi-iro: #8fc31f;       /* 萌黄色 */
    --wakakusa: #c4d83c;        /* 若草色 */
    --sakura-light: #f8e8f0;    /* 淡桜 */
    --akebono: #f2c4a0;         /* 曙色 */
}

/* 若紫ページのヘッダー装飾 */
body.single-genji.spring-theme .single-post-header {
    border-bottom-color: var(--sakura-iro);
    background: linear-gradient(
        135deg,
        rgba(248, 232, 240, 0.3) 0%,
        rgba(252, 238, 228, 0.2) 100%
    );
    padding: 2rem;
    border-radius: 2px;
    position: relative;
    overflow: hidden;
}

/* 春の雲 ─ たなびく装飾 */
body.single-genji.spring-theme .single-post-header::before {
    content: "";
    position: absolute;
    top: -10px;
    left: -5%;
    right: -5%;
    height: 60px;
    background:
        radial-gradient(ellipse 200px 30px at 20% 50%, rgba(242, 196, 160, 0.2) 0%, transparent 70%),
        radial-gradient(ellipse 280px 25px at 55% 50%, rgba(232, 160, 180, 0.18) 0%, transparent 70%),
        radial-gradient(ellipse 160px 20px at 85% 50%, rgba(196, 160, 212, 0.15) 0%, transparent 70%);
    animation: tanabiku-drift-slow 25s ease-in-out infinite;
    pointer-events: none;
    z-index: 0;
}

body.single-genji.spring-theme .single-post-header::after {
    color: var(--sakura-iro);
}

body.single-genji.spring-theme .single-post-title,
body.single-genji.spring-theme .post-type-label {
    position: relative;
    z-index: 1;
}

/* 見出しに春の色を */
body.single-genji.spring-theme .single-post-content h2 {
    color: var(--naka-murasaki);
    border-bottom-color: var(--sakura-iro);
}

body.single-genji.spring-theme .single-post-content h2::before {
    background: linear-gradient(180deg, var(--sakura-iro), var(--akebono));
}

body.single-genji.spring-theme .single-post-content h3 {
    color: var(--sakura-iro);
}

/* 和歌ブロックに春の装飾 */
body.single-genji.spring-theme .waka-block {
    border-left-color: var(--sakura-iro);
    background:
        radial-gradient(circle at 10% 20%, rgba(242, 196, 160, 0.08) 0%, transparent 40%),
        radial-gradient(circle at 90% 80%, rgba(232, 160, 180, 0.06) 0%, transparent 30%),
        linear-gradient(135deg, #fdf6f0 0%, #faf0f4 50%, #f0e8f4 100%);
}

body.single-genji.spring-theme .waka-block::before {
    color: var(--sakura-iro);
}

/* アイキャッチ画像に春の枠 */
body.single-genji.spring-theme .single-post-thumbnail {
    border-color: var(--sakura-iro);
    border-width: 2px;
    position: relative;
}

body.single-genji.spring-theme .single-post-thumbnail::after {
    content: "";
    position: absolute;
    top: -1px;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(
        90deg,
        var(--akebono) 0%,
        var(--sakura-iro) 35%,
        var(--fuji-iro) 65%,
        var(--waka-murasaki) 100%
    );
    z-index: 1;
}

/* 投稿ナビゲーションに春の色 */
body.single-genji.spring-theme .post-navigation a:hover {
    color: var(--sakura-iro);
}

/* 春の桜吹雪アニメーション */
@keyframes sakura-fall {
    0% {
        transform: translateY(-10px) translateX(0) rotate(0deg);
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    90% {
        opacity: 1;
    }
    100% {
        transform: translateY(100vh) translateX(30px) rotate(180deg);
        opacity: 0;
    }
}

/* 春のページに桜の花びらを散らす（控えめに） */
body.single-genji.spring-theme::before {
    content: "🌸";
    position: fixed;
    top: -20px;
    left: 15%;
    font-size: 1.2rem;
    animation: sakura-fall 12s linear infinite;
    pointer-events: none;
    z-index: 1;
    opacity: 0.4;
}

body.single-genji.spring-theme::after {
    content: "🌸";
    position: fixed;
    top: -20px;
    left: 75%;
    font-size: 0.9rem;
    animation: sakura-fall 15s linear 5s infinite;
    pointer-events: none;
    z-index: 1;
    opacity: 0.3;
}

/* 春のページ全体の背景を淡く彩る */
body.single-genji.spring-theme {
    background-image:
        repeating-linear-gradient(
            0deg,
            transparent,
            transparent 1px,
            rgba(232, 160, 180, 0.02) 1px,
            rgba(232, 160, 180, 0.02) 2px,
            transparent 2px,
            transparent 5px
        ),
        repeating-linear-gradient(
            90deg,
            transparent,
            transparent 1px,
            rgba(242, 196, 160, 0.015) 1px,
            rgba(242, 196, 160, 0.015) 2px,
            transparent 2px,
            transparent 7px
        ),
        repeating-linear-gradient(
            -45deg,
            transparent,
            transparent 3px,
            rgba(196, 160, 212, 0.01) 3px,
            rgba(196, 160, 212, 0.01) 4px,
            transparent 4px,
            transparent 11px
        ),
        radial-gradient(
            ellipse at 30% 20%,
            rgba(248, 232, 240, 0.3) 0%,
            transparent 70%
        ),
        radial-gradient(
            ellipse at 75% 80%,
            rgba(252, 238, 228, 0.25) 0%,
            transparent 60%
        ),
        var(--washi-shiro);
}

/* レスポンシブ: モバイルでは桜吹雪を非表示 */
@media (max-width: 768px) {
    body.single-genji.spring-theme::before,
    body.single-genji.spring-theme::after {
        display: none;
    }
}

/* アニメーション抑制設定への対応 */
@media (prefers-reduced-motion: reduce) {
    body.single-genji.spring-theme::before,
    body.single-genji.spring-theme::after,
    body.single-genji.spring-theme .single-post-header::before {
        animation: none;
    }
}

/* ===================================
   源氏物語 帖マップ
   =================================== */

/* ── ヒーローヘッダー ── */
.genji-map-hero {
    background:
        radial-gradient(ellipse at 20% 50%, rgba(184,150,62,0.15) 0%, transparent 60%),
        radial-gradient(ellipse at 80% 30%, rgba(155,107,171,0.2) 0%, transparent 50%),
        linear-gradient(150deg, #1e0630 0%, var(--koki-murasaki) 50%, #2d0e3d 100%);
    color: var(--washi-shiro);
    text-align: center;
    padding: 4rem 2rem 3.5rem;
    position: relative;
    overflow: hidden;
    border-radius: 4px;
    margin-bottom: 1.5rem;
}
.genji-map-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        repeating-linear-gradient(45deg,
            transparent, transparent 40px,
            rgba(184,150,62,0.04) 40px, rgba(184,150,62,0.04) 41px);
    pointer-events: none;
}
.genji-map-hero-kana {
    font-size: 0.75rem;
    letter-spacing: 0.3em;
    color: var(--usu-kogane);
    margin-bottom: 0.5rem;
}
.genji-map-hero-title {
    font-size: clamp(1.8rem, 4vw, 2.8rem);
    font-weight: 700;
    color: var(--washi-shiro);
    letter-spacing: 0.15em;
    line-height: 1.3;
    margin-bottom: 1rem;
    text-shadow: 0 2px 12px rgba(0,0,0,0.4);
}
.genji-map-hero-desc {
    font-size: 0.9rem;
    color: var(--fuji-iro);
    line-height: 1.9;
    margin-bottom: 2rem;
}

/* ── プログレスバー ── */
.genji-map-progress {
    max-width: 360px;
    margin: 0 auto;
}
.genji-map-progress-bar {
    height: 6px;
    background: rgba(255,255,255,0.15);
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 0.6rem;
}
.genji-map-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--usu-kogane), var(--kogane));
    border-radius: 3px;
}
.genji-map-progress-text {
    font-size: 0.85rem;
    color: var(--fuji-iro);
    letter-spacing: 0.05em;
}
.genji-map-progress-num {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--usu-kogane);
}

/* ── 凡例 ── */
.genji-map-legend {
    display: flex;
    gap: 1.5rem;
    justify-content: flex-end;
    padding: 0 0.5rem 1rem;
    font-size: 0.8rem;
    color: var(--usu-zumi);
}
.legend-item {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
}
.legend-published .legend-dot { background: var(--naka-murasaki); }
.legend-pending  .legend-dot  { background: var(--washi-nezu); }

/* ── 部セクション ── */
.genji-map-section {
    margin-bottom: 2.5rem;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(70,26,92,0.08);
}
.genji-map-section-header {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    padding: 1.5rem 2rem;
    flex-wrap: wrap;
}
.genji-map-section-label-wrap {
    min-width: 160px;
    flex-shrink: 0;
}
.genji-map-section-label {
    display: inline-block;
    font-size: 0.7rem;
    letter-spacing: 0.2em;
    padding: 0.15em 0.6em;
    border-radius: 2px;
    margin-bottom: 0.3rem;
    font-weight: 700;
}
.genji-map-section-title {
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    line-height: 1.3;
    margin-bottom: 0.2rem;
}
.genji-map-section-range {
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    opacity: 0.7;
}
.genji-map-section-desc {
    font-size: 0.85rem;
    line-height: 1.8;
    flex: 1;
    padding-top: 0.2rem;
}

/* ── 第一部：薄紫 ── */
.part-one .genji-map-section-header {
    background: linear-gradient(135deg, #f0e8f7, var(--shira-fuji));
    color: var(--koki-murasaki);
    border-bottom: 2px solid var(--fuji-iro);
}
.part-one .genji-map-section-label  { background: var(--naka-murasaki); color: #fff; }
.part-one .genji-map-section-title  { color: var(--koki-murasaki); }
.part-one .genji-map-grid           { background: #faf6fe; }
.part-one .is-published {
    background: linear-gradient(135deg, #fff, var(--shira-fuji));
    border: 1px solid var(--fuji-iro);
    color: var(--koki-murasaki);
}
.part-one .is-published:hover {
    border-color: var(--naka-murasaki);
    background: linear-gradient(135deg, var(--shira-fuji), #e8d8f5);
    box-shadow: 0 4px 16px rgba(107,45,123,0.18);
}
.part-one .is-published .genji-map-card-num { color: var(--naka-murasaki); }

/* ── 第二部：深紫 ── */
.part-two .genji-map-section-header {
    background: linear-gradient(135deg, #2d0e3d, var(--koki-murasaki));
    color: var(--washi-shiro);
    border-bottom: 2px solid #8b4aab;
}
.part-two .genji-map-section-label {
    background: rgba(255,255,255,0.15);
    color: var(--usu-kogane);
    border: 1px solid rgba(255,255,255,0.2);
}
.part-two .genji-map-section-title  { color: var(--washi-shiro); }
.part-two .genji-map-section-desc   { color: var(--fuji-iro); }
.part-two .genji-map-section-range  { color: var(--fuji-iro); }
.part-two .genji-map-grid           { background: #1a0525; }
.part-two .is-published {
    background: linear-gradient(135deg, #2a0a38, #3d1555);
    border: 1px solid #6b2d7b;
    color: var(--fuji-iro);
}
.part-two .is-published:hover {
    border-color: var(--usu-kogane);
    background: linear-gradient(135deg, #3d1555, #52207a);
    box-shadow: 0 4px 16px rgba(0,0,0,0.4);
}
.part-two .is-published .genji-map-card-num   { color: var(--usu-kogane); }
.part-two .is-published .genji-map-card-kanji { color: var(--washi-shiro); }
.part-two .is-pending  { background: #120320; border: 1px solid #2d1040; }
.part-two .is-pending .genji-map-card-num,
.part-two .is-pending .genji-map-card-kanji,
.part-two .is-pending .genji-map-card-yomi { color: #4a3060; }

/* ── 第三部：金茶 ── */
.part-three .genji-map-section-header {
    background: linear-gradient(135deg, #2e1a05, #4a2e0a);
    color: var(--washi-shiro);
    border-bottom: 2px solid var(--kogane);
}
.part-three .genji-map-section-label   { background: var(--kogane); color: #fff; }
.part-three .genji-map-section-title   { color: var(--usu-kogane); }
.part-three .genji-map-section-desc    { color: var(--hakkin); }
.part-three .genji-map-section-range   { color: var(--usu-kogane); opacity: 0.8; }
.part-three .genji-map-grid            { background: #1e1005; }
.part-three .is-published {
    background: linear-gradient(135deg, #2e1a05, #3d2308);
    border: 1px solid #6b4a1a;
    color: var(--hakkin);
}
.part-three .is-published:hover {
    border-color: var(--kogane);
    background: linear-gradient(135deg, #3d2308, #5c3510);
    box-shadow: 0 4px 16px rgba(184,150,62,0.2);
}
.part-three .is-published .genji-map-card-num   { color: var(--kogane); }
.part-three .is-published .genji-map-card-kanji { color: var(--usu-kogane); }
.part-three .is-pending  { background: #130b02; border: 1px solid #2a1a05; }
.part-three .is-pending .genji-map-card-num,
.part-three .is-pending .genji-map-card-kanji,
.part-three .is-pending .genji-map-card-yomi { color: #3d2a10; }

/* ── グリッド ── */
.genji-map-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    gap: 8px;
    padding: 1.5rem;
}

/* ── カード共通 ── */
.genji-map-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 0.5rem 0.65rem;
    border-radius: 4px;
    text-align: center;
    position: relative;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    min-height: 90px;
    text-decoration: none;
}
.genji-map-card.is-published { cursor: pointer; }
.genji-map-card.is-published:hover { transform: translateY(-3px); text-decoration: none; }
.genji-map-card.is-pending {
    cursor: default;
    border: 1px solid var(--washi-nezu);
    background: #f0ebe3;
}
.genji-map-card-num {
    font-size: 0.65rem;
    letter-spacing: 0.05em;
    font-family: var(--font-gothic);
    margin-bottom: 0.3rem;
    display: block;
}
.genji-map-card-kanji {
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 1.2;
    display: block;
    margin-bottom: 0.25rem;
}
.genji-map-card-yomi {
    font-size: 0.6rem;
    letter-spacing: 0.03em;
    display: block;
    opacity: 0.7;
}
.is-pending .genji-map-card-kanji { color: #b5a898; }
.is-pending .genji-map-card-num   { color: #c9bbae; }
.is-pending .genji-map-card-yomi  { color: #c9bbae; }
.genji-map-card-pending-label {
    position: absolute;
    top: 4px;
    right: 4px;
    font-size: 0.5rem;
    font-family: var(--font-gothic);
    color: #c9bbae;
    background: rgba(0,0,0,0.06);
    padding: 1px 4px;
    border-radius: 2px;
}

/* ── フッターノート ── */
.genji-map-footnote {
    text-align: center;
    font-size: 0.75rem;
    color: var(--usu-zumi);
    padding: 1rem 0 0.5rem;
    border-top: 1px solid var(--washi-nezu);
    margin-top: 1rem;
}

/* ── レスポンシブ ── */
@media (max-width: 768px) {
    .genji-map-hero { padding: 2.5rem 1.2rem 2rem; }
    .genji-map-section-header { padding: 1.2rem; gap: 1rem; }
    .genji-map-grid {
        grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
        gap: 6px;
        padding: 1rem;
    }
    .genji-map-card { min-height: 80px; padding: 0.6rem 0.4rem; }
    .genji-map-card-kanji { font-size: 0.9rem; }
}
@media (max-width: 480px) {
    .genji-map-grid {
        grid-template-columns: repeat(auto-fill, minmax(68px, 1fr));
        gap: 5px;
    }
}

/* ===================================
   帖一覧ページ (page-chapter-list.php)
   クラスプレフィックス: cl-
   =================================== */

/* ─── ヒーローセクション ─── */
.cl-hero {
    background:
        radial-gradient(circle at 15% 50%, rgba(184, 150, 62, 0.2) 0%, transparent 45%),
        radial-gradient(circle at 85% 50%, rgba(184, 150, 62, 0.15) 0%, transparent 40%),
        linear-gradient(160deg, #2d0e3d 0%, var(--koki-murasaki) 40%, var(--naka-murasaki) 70%, #2d0e3d 100%);
    color: #fff;
    padding: 4rem 2rem 3rem;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.cl-hero::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, var(--kogane), var(--usu-kogane), var(--kogane), transparent);
}
.cl-hero::after {
    content: "";
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--fuji-iro), transparent);
}
.cl-hero-kana {
    font-size: 0.85rem;
    letter-spacing: 0.15em;
    color: var(--fuji-iro);
    margin-bottom: 0.5rem;
}
.cl-hero-title {
    font-size: clamp(1.8rem, 4vw, 2.8rem);
    font-weight: 700;
    color: #fff;
    letter-spacing: 0.12em;
    margin-bottom: 1rem;
    text-shadow: 0 2px 12px rgba(107, 45, 123, 0.5);
}
.cl-hero-desc {
    font-size: 0.95rem;
    color: var(--shira-fuji);
    line-height: 2;
    margin-bottom: 2rem;
}
.cl-progress {
    max-width: 360px;
    margin: 0 auto;
}
.cl-progress-bar {
    height: 6px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 0.6rem;
}
.cl-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--kogane), var(--usu-kogane));
    border-radius: 3px;
    transition: width 0.8s ease;
}
.cl-progress-text {
    font-size: 0.9rem;
    color: var(--shira-fuji);
    text-align: center;
}
.cl-progress-num {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--usu-kogane);
}

/* ─── 各部セクション ─── */
.cl-section {
    margin-bottom: 0;
    padding: 0;
}
.cl-section-header {
    display: flex;
    align-items: flex-start;
    gap: 2rem;
    padding: 2rem 2.5rem;
}
.cl-section-label-wrap {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}
.cl-section-label {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    padding: 0.2rem 0.7rem;
    border-radius: 2px;
}
.cl-section-title {
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: 0.06em;
}
.cl-section-range {
    font-size: 0.78rem;
    letter-spacing: 0.05em;
    opacity: 0.75;
}
.cl-section-desc {
    font-size: 0.9rem;
    line-height: 1.9;
    padding-top: 0.3rem;
}

/* ─── テーブル ─── */
.cl-table-wrap {
    overflow-x: auto;
    padding: 0 1.5rem 2rem;
}
.cl-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.93rem;
}
.cl-table th,
.cl-table td {
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 1px solid rgba(0,0,0,0.08);
}
.cl-table thead tr {
    border-bottom: 2px solid;
}
.cl-th-num    { width: 3.5rem; text-align: center; }
.cl-th-title  { width: 7rem; }
.cl-th-yomi   { width: 9rem; }
.cl-th-status { width: 5.5rem; text-align: center; }
.cl-td-num    { text-align: center; font-weight: 700; font-size: 1rem; }
.cl-td-yomi   { font-size: 0.85rem; }
.cl-td-status { text-align: center; }

.cl-title-link {
    font-weight: 700;
    text-decoration: none;
    transition: color 0.2s;
}
.cl-title-link:hover { text-decoration: underline; }
.cl-title-pending {
    color: inherit;
    opacity: 0.45;
}

/* ─── 状態バッジ ─── */
.cl-badge {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
    white-space: nowrap;
}
.cl-badge-pub     { background: var(--naka-murasaki); color: #fff; }
.cl-badge-pending { background: var(--washi-nezu); color: var(--usu-zumi); }

/* ─── 第一部カラー ─── */
.cl-part-one .cl-section-header   { background: #f9f4fe; }
.cl-part-one .cl-section-label    { background: var(--naka-murasaki); color: #fff; }
.cl-part-one .cl-section-title    { color: var(--koki-murasaki); }
.cl-part-one .cl-section-range    { color: var(--usu-murasaki); }
.cl-part-one .cl-section-desc     { color: var(--usu-zumi); }
.cl-part-one .cl-table-wrap       { background: #faf6fe; }
.cl-part-one .cl-table th         { color: var(--koki-murasaki); border-color: var(--fuji-iro); background: rgba(196,166,212,0.15); }
.cl-part-one .cl-table td         { color: var(--sumi-iro); border-color: rgba(196,166,212,0.3); }
.cl-part-one .is-pub .cl-td-num   { color: var(--naka-murasaki); }
.cl-part-one .cl-title-link       { color: var(--naka-murasaki); }
.cl-part-one .cl-title-link:hover { color: var(--kogane); }

/* ─── 第二部カラー ─── */
.cl-part-two .cl-section-header   { background: #1a0525; }
.cl-part-two .cl-section-label    { background: var(--usu-murasaki); color: #fff; }
.cl-part-two .cl-section-title    { color: var(--shira-fuji); }
.cl-part-two .cl-section-range    { color: var(--fuji-iro); }
.cl-part-two .cl-section-desc     { color: var(--fuji-iro); }
.cl-part-two .cl-table-wrap       { background: #120018; }
.cl-part-two .cl-table th         { color: var(--shira-fuji); border-color: var(--usu-murasaki); background: rgba(107,45,123,0.2); }
.cl-part-two .cl-table td         { color: var(--shira-fuji); border-color: rgba(107,45,123,0.25); }
.cl-part-two .is-pub .cl-td-num   { color: var(--usu-kogane); }
.cl-part-two .cl-title-link       { color: var(--usu-kogane); }
.cl-part-two .cl-title-link:hover { color: var(--hakkin); }
.cl-part-two .cl-title-pending    { color: var(--fuji-iro); }
.cl-part-two .cl-td-yomi          { color: var(--fuji-iro); }
.cl-part-two .cl-badge-pending    { background: rgba(255,255,255,0.1); color: var(--fuji-iro); }

/* ─── 第三部カラー ─── */
.cl-part-three .cl-section-header   { background: #1e1005; }
.cl-part-three .cl-section-label    { background: var(--kogane); color: #fff; }
.cl-part-three .cl-section-title    { color: var(--usu-kogane); }
.cl-part-three .cl-section-range    { color: var(--usu-kogane); opacity: 0.8; }
.cl-part-three .cl-section-desc     { color: var(--hakkin); }
.cl-part-three .cl-table-wrap       { background: #140b00; }
.cl-part-three .cl-table th         { color: var(--usu-kogane); border-color: var(--kogane); background: rgba(184,150,62,0.15); }
.cl-part-three .cl-table td         { color: var(--hakkin); border-color: rgba(184,150,62,0.2); }
.cl-part-three .is-pub .cl-td-num   { color: var(--kogane); }
.cl-part-three .cl-title-link       { color: var(--usu-kogane); }
.cl-part-three .cl-title-link:hover { color: var(--hakkin); }
.cl-part-three .cl-title-pending    { color: var(--usu-kogane); opacity: 0.4; }
.cl-part-three .cl-td-yomi          { color: var(--usu-kogane); opacity: 0.7; }
.cl-part-three .cl-badge-pending    { background: rgba(255,255,255,0.1); color: var(--usu-kogane); }

/* ─── フッターノート ─── */
.cl-footnote {
    text-align: center;
    padding: 2rem;
    font-size: 0.82rem;
    color: var(--usu-zumi);
    border-top: 1px solid var(--washi-nezu);
}

/* ─── レスポンシブ ─── */
@media (max-width: 640px) {
    .cl-section-header  { flex-direction: column; gap: 1rem; padding: 1.5rem 1.2rem; }
    .cl-table-wrap      { padding: 0 0.8rem 1.5rem; }
    .cl-table th,
    .cl-table td        { padding: 0.6rem 0.6rem; font-size: 0.85rem; }
    .cl-th-yomi,
    .cl-td-yomi         { display: none; }
}


/* ===================================
   登場人物ページ (page-characters.php)
   クラスプレフィックス: ch-
   =================================== */

/* ─── ヒーローセクション ─── */
.ch-hero {
    background:
        radial-gradient(circle at 20% 50%, rgba(184, 150, 62, 0.18) 0%, transparent 45%),
        radial-gradient(circle at 80% 30%, rgba(107, 45, 123, 0.3) 0%, transparent 50%),
        linear-gradient(150deg, #1e0a2e 0%, var(--koki-murasaki) 35%, #3d1a55 65%, #1e0a2e 100%);
    color: #fff;
    padding: 4rem 2rem 3rem;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.ch-hero::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, var(--kogane), var(--usu-kogane), var(--kogane), transparent);
}
.ch-hero::after {
    content: "";
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--fuji-iro), transparent);
}
.ch-hero-kana {
    font-size: 0.85rem;
    letter-spacing: 0.15em;
    color: var(--fuji-iro);
    margin-bottom: 0.5rem;
}
.ch-hero-title {
    font-size: clamp(1.8rem, 4vw, 2.8rem);
    font-weight: 700;
    color: #fff;
    letter-spacing: 0.12em;
    margin-bottom: 1rem;
    text-shadow: 0 2px 12px rgba(107, 45, 123, 0.5);
}
.ch-hero-desc {
    font-size: 0.95rem;
    color: var(--shira-fuji);
    line-height: 2;
    max-width: 600px;
    margin: 0 auto;
}

/* ─── セクション ─── */
.ch-section {
    margin-bottom: 0;
}
.ch-section-header {
    padding: 2rem 2.5rem 1.5rem;
}
.ch-section-title {
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid;
    display: inline-block;
}
.ch-section-desc {
    font-size: 0.9rem;
    line-height: 1.9;
    margin-top: 0.6rem;
}

/* ─── テーブル ─── */
.ch-table-wrap {
    overflow-x: auto;
    padding: 0 1.5rem 2.5rem;
}
.ch-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.92rem;
}
.ch-table th,
.ch-table td {
    padding: 0.85rem 1rem;
    text-align: left;
    vertical-align: top;
    border: 1px solid rgba(0,0,0,0.12);
}
.ch-table thead tr th {
    border-bottom: 2px solid;
}
.ch-th-name  { width: 6rem; white-space: nowrap; }
.ch-th-yomi  { width: 8rem; }
.ch-th-role  { width: 10rem; }
.ch-th-desc  { }
.ch-td-name  { font-weight: 700; font-size: 1rem; white-space: nowrap; }
.ch-td-yomi  { font-size: 0.82rem; }
.ch-td-role  { font-size: 0.85rem; }
.ch-td-desc  { font-size: 0.88rem; line-height: 1.85; }

/* ─── 第一部カラー ─── */
.ch-part-one .ch-section-header     { background: #f9f4fe; }
.ch-part-one .ch-section-title      { color: var(--koki-murasaki); border-color: var(--fuji-iro); }
.ch-part-one .ch-section-desc       { color: var(--usu-zumi); }
.ch-part-one .ch-table-wrap         { background: #faf6fe; }
.ch-part-one .ch-table th           { color: var(--koki-murasaki); border-color: var(--fuji-iro); background: rgba(196,166,212,0.15); }
.ch-part-one .ch-table td           { color: var(--sumi-iro); border-color: rgba(196,166,212,0.25); }
.ch-part-one .ch-td-name            { color: var(--koki-murasaki); }
.ch-part-one .ch-td-role            { color: var(--naka-murasaki); }

/* ─── 第三部カラー ─── */
.ch-part-three .ch-section-header   { background: #1e1005; }
.ch-part-three .ch-section-title    { color: var(--usu-kogane); border-color: var(--kogane); }
.ch-part-three .ch-section-desc     { color: var(--hakkin); }
.ch-part-three .ch-table-wrap       { background: #140b00; }
.ch-part-three .ch-table th         { color: var(--usu-kogane); border-color: var(--kogane); background: rgba(184,150,62,0.15); }
.ch-part-three .ch-table td         { color: var(--hakkin); border-color: rgba(184,150,62,0.2); }
.ch-part-three .ch-td-name          { color: var(--usu-kogane); }
.ch-part-three .ch-td-role          { color: var(--kogane); }
.ch-part-three .ch-td-yomi          { color: var(--usu-kogane); opacity: 0.75; }

/* ─── フッターノート ─── */
.ch-footnote {
    text-align: center;
    padding: 2rem;
    font-size: 0.82rem;
    color: var(--usu-zumi);
    border-top: 1px solid var(--washi-nezu);
}

/* ─── レスポンシブ ─── */
@media (max-width: 768px) {
    .ch-section-header  { padding: 1.5rem 1.2rem 1rem; }
    .ch-table-wrap      { padding: 0 0.8rem 1.5rem; }
    .ch-table th,
    .ch-table td        { padding: 0.65rem 0.6rem; }
    .ch-th-yomi,
    .ch-td-yomi         { display: none; }
    .ch-td-desc         { font-size: 0.82rem; }
}
@media (max-width: 480px) {
    .ch-th-role,
    .ch-td-role         { display: none; }
}

/* ─── hero タイトル: single-post-content h2 の上書き修正 ─── */
.single-post-content .genji-map-hero-title,
.single-post-content .cl-hero-title,
.single-post-content .ch-hero-title {
    color: #f5e8c0;
    border-bottom: none;
    margin: 0 0 1rem;
    padding-bottom: 0;
}
.single-post-content .genji-map-hero-title::before,
.single-post-content .cl-hero-title::before,
.single-post-content .ch-hero-title::before {
    display: none;
}