/* 深淵書架 ── 共有デザイントークン
   相関星図・禁忌遺物商会・書架の全モジュールで共通のカラー/装飾変数。
   レアリティ色(--shn-bone-dim/--shn-phos/--shn-blood/--shn-gold)は
   room/追補指示_REL-ROOM_遺物の間拡張.md で定義された将来の3D陳列室
   (common/rare/forbidden/mythic)と同一系統に揃えている。
   全モジュールCSSより先にenqueueされる想定。 */
:root {
  --shn-abyss: #0B0D12;
  --shn-panel: #151A24;
  --shn-panel2: #101520;
  --shn-gold: #C9A227;
  --shn-gold-dim: #7a6420;
  --shn-blood: #8E2F3C;
  --shn-phos: #7FD1B9;
  --shn-violet: #8A7BB8;
  --shn-bone: #E8E3D5;
  --shn-bone-dim: #9a958a;
  --shn-hairline: rgba(201, 162, 39, .28);
  --shn-hairline-soft: rgba(201, 162, 39, .16);

  --shn-font-display: "Shippori Mincho B1", serif;
  --shn-font-body: "Zen Kaku Gothic New", sans-serif;
  --shn-font-mono: "IBM Plex Mono", monospace;

  --shn-glow-gold: 0 0 18px rgba(201, 162, 39, .16);
  --shn-vignette: radial-gradient(120% 90% at 50% -10%, rgba(201, 162, 39, .06), transparent 60%);
}

/* 共通の角飾り(禁忌書物風フレーム)。パネル系コンテナに直接付与する。
   ::before/::afterの2点のみでL字を対角に配置する軽量な手法。 */
.shn-frame { position: relative; }
.shn-frame::before,
.shn-frame::after {
  content: "";
  position: absolute;
  width: 13px;
  height: 13px;
  pointer-events: none;
  opacity: .75;
  z-index: 2;
}
.shn-frame::before {
  top: 7px;
  left: 7px;
  border-top: 1px solid var(--shn-gold-dim);
  border-left: 1px solid var(--shn-gold-dim);
}
.shn-frame::after {
  bottom: 7px;
  right: 7px;
  border-bottom: 1px solid var(--shn-gold-dim);
  border-right: 1px solid var(--shn-gold-dim);
}

/* 共通の見出しオーナメント。既存の各種titleクラスへ追加適用する。 */
.shn-heading-rune::before {
  content: "◆";
  display: inline-block;
  font-size: .6em;
  color: var(--shn-gold-dim);
  margin-right: .6em;
  transform: translateY(-.1em);
}

/* 共通の背景テクスチャ適用。url()はstyle属性で --shn-bg-image に
   差し込んで使う(前景の可読性を保つため上に暗いグラデーションを重ねる)。 */
.shn-textured {
  background-image:
    var(--shn-vignette),
    linear-gradient(rgba(6, 7, 10, .55), rgba(6, 7, 10, .72)),
    var(--shn-bg-image, none);
  background-size: auto, auto, cover;
  background-position: center, center, center;
  background-repeat: no-repeat, no-repeat, no-repeat;
}
