/* 漫画アニメ新刊まとめ のサイト側の見た目。テーマの style.css のあとに読まれる。
   画像の url() には必ず ?v= を付ける。外部の番地と、ほかの CSS の読み込みは書かない。 */
:root {
  --nav: #3a2d5c;
  --brand: #7a5a00; --brand-end: #3a2d5c; --brand-soft: #fdf5d4;
  --yellow: #ffd23f; --yellow-soft: #fdf5d4; --yellow-ink: #3a2a00;
  --paper: #f4f5f7; --surface: #ffffff; --ink: #18202b; --muted: #4b5563;
  --line: #d6dae1; --link: #164a8a; --focus: #164a8a; --hot: #b3261e;
}

/* ダークモード（テーマの暗い色の上に、このサイトの色を重ねる）。 */
:root[data-theme="dark"] {
  --paper: #0e131a; --surface: #171d27; --ink: #eef1f6; --muted: #aab2c0;
  --line: #303846; --nav: #241b3b;
  --brand-soft: #2c2410; --yellow-soft: #33290d;
  --link: #9cc0ff; --focus: #ffd874;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #0e131a; --surface: #171d27; --ink: #eef1f6; --muted: #aab2c0;
    --line: #303846; --nav: #241b3b;
    --brand-soft: #2c2410; --yellow-soft: #33290d;
    --link: #9cc0ff; --focus: #ffd874;
  }
}

/* ヘッダーとフッター：ちりばめ画像の上に、半透明のナビ色を重ねて、文字とロゴを読めるようにする。 */
.site-header {
  background:
    linear-gradient(110deg, rgba(58, 45, 92, .93) 0%, rgba(58, 45, 92, .86) 55%, rgba(36, 27, 59, .92) 100%),
    url("../img/header_collage.webp?v=20261114a") center center / auto 220px repeat-x,
    #3a2d5c;
  border-top-color: #ffd23f;
  border-bottom: 4px solid #ffd23f;
}
.site-footer {
  background-color: #241b3b;
  background-image:
    linear-gradient(rgba(36, 27, 59, .90), rgba(36, 27, 59, .90)),
    url("../img/footer_collage.webp?v=20261114a");
  background-position: center center, center center;
  background-size: cover, cover;
  background-repeat: no-repeat, no-repeat;
}
.header-note strong, .header-note span, .brand-caption { text-shadow: 0 1px 3px rgba(0, 0, 0, .8); }

/* カテゴリの色（白い文字が載る --cat は濃い色）。 */
.cat-manga { --cat: #3a2d5c; --cat-soft: #ece8f6; }
.cat-anime { --cat: #0b5a70; --cat-soft: #e2f3f7; }
.cat-tana { --cat: #7a4b00; --cat-soft: #fbf0dc; }
.cat-oshi { --cat: #8a2f55; --cat-soft: #fbe9f1; }
.cat-katari { --cat: #1f5d3a; --cat-soft: #e6f4ec; }
.cat-yomikata { --cat: #1f3a5f; --cat-soft: #e8eef7; }

/* 「オリジナル」と「AI」の表記：うっすらと分かる、地味な見た目。
   灰色の文字だけ。背景色・枠・太字なし。文言と位置は変えない。隠さない。
   背景との明るさの差は 4.5:1 以上（ライト #6b656b／ダーク #a8a1a7）。 */
:root { --quiet-label: #6b656b; }
:root[data-theme="dark"] { --quiet-label: #a8a1a7; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --quiet-label: #a8a1a7; } }
.badge.fiction, .ai-badge {
  color: var(--quiet-label); background: none; border: 0; border-radius: 0; padding: 0;
  font-size: .8rem; font-weight: 400; line-height: 1.6; opacity: 1;
}
.story-kicker .badge.fiction { color: #6b656b; }
.res-meta .ai-badge { margin-inline-start: 4px; }
