/* =========================================
   1. 背景の夜空グラデーションと基本設定
========================================= */
body {
    background: linear-gradient(to bottom, #050414 0%, #160a38 50%, #2b1654 100%) fixed !important;
    color: #333333 !important; /* 本文の文字色は黒 */
    position: relative;
    z-index: 0;
}

/* =========================================
   2. 瞬く星空の表現
========================================= */
body::before, body::after {
    content: "";
    position: fixed;
    top: 0; left: 0; width: 100vw; height: 100vh;
    z-index: -1;
    pointer-events: none;
    background-repeat: repeat;
}
body::before {
    background-image: 
        radial-gradient(1px 1px at 20px 30px, #ffffff, rgba(0,0,0,0)),
        radial-gradient(1px 1px at 40px 70px, #e0e0e0, rgba(0,0,0,0)),
        radial-gradient(1px 1px at 160px 120px, #cccccc, rgba(0,0,0,0));
    background-size: 250px 250px;
    animation: twinkle-slow 4s infinite alternate;
}
body::after {
    background-image: 
        radial-gradient(1.5px 1.5px at 10px 10px, #fff, rgba(0,0,0,0)),
        radial-gradient(2px 2px at 150px 150px, #fff, rgba(0,0,0,0));
    background-size: 300px 300px;
    animation: twinkle-fast 3s infinite alternate-reverse;
    opacity: 0.5;
}

@keyframes twinkle-slow { 0% { opacity: 0.3; } 100% { opacity: 1; } }
@keyframes twinkle-fast { 0% { opacity: 0.1; } 100% { opacity: 0.8; } }

/* =========================================
   3. 記事・コンテンツエリア
========================================= */
#wrapper, #container, #contents, #main, .page_body, .main-content {
    background-color: rgba(255, 255, 255, 0.88) !important; /* 読みやすさ重視の白 */
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
}

/* =========================================
   4. 【追加】見出し：明滅する金色
========================================= */
h1, h2, h3 {
    color: #d4af37 !important; /* 上品なゴールド */
    border-bottom: 2px solid rgba(212, 175, 55, 0.3) !important;
    text-shadow: 0 0 5px rgba(212, 175, 55, 0.2);
    animation: gold-twinkle 3s infinite ease-in-out; /* 明滅アニメーション */
    font-weight: bold !important;
}

/* 金色の明滅アニメーション */
@keyframes gold-twinkle {
    0% { color: #b8860b; text-shadow: 0 0 2px rgba(184, 134, 11, 0.2); }
    50% { color: #ffd700; text-shadow: 0 0 15px rgba(255, 215, 0, 0.8); }
    100% { color: #b8860b; text-shadow: 0 0 2px rgba(184, 134, 11, 0.2); }
}

/* =========================================
   5. リンク設定
========================================= */
a {
    color: #82b1ff !important; /* 青いリンク */
    text-decoration: none !important;
    transition: 0.3s;
}
a:hover {
    color: #ffd700 !important;
    text-shadow: 0 0 8px rgba(255, 215, 0, 0.6);
}