/* ============================================================
   編集中バナー：ON/OFFはコメントアウトで切り替え
   編集者A → --editing-a の行を有効
   編集者B → --editing-b の行を有効
   ============================================================ */

/* ▼▼▼ 編集者A が編集中のときだけ この1行のスラッシュを外す ▼▼▼ */
/*body{ --editing: 1; --icon: "⚙"; }*/
/* ▼▼▼ 編集者B が編集中のときだけ この1行のスラッシュを外す ▼▼▼ */
/*body{ --editing: 1; --icon: "🐈"; }*/

body::after {
  display: var(--editing, none);
  content: var(--icon) "レイアウト編集中！表示が不安定な場合があります";
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 999999;
  background: rgba(180, 120, 0, 0.88);
  color: #fff;
  font-size: 13px;
  font-weight: bold;
  text-align: center;
  padding: 6px 0;
  letter-spacing: 0.05em;
  backdrop-filter: blur(4px);
  pointer-events: none;
  box-sizing: border-box;
  text-shadow: 0 1px 3px rgba(0,0,0,0.5);
  box-shadow: 0 -2px 8px rgba(0,0,0,0.3);
}

/* DB一覧表のセル幅・レイアウト固定 */
#db_data_list table.uk-table { margin: 0px; table-layout:fixed; }
#db_data_list div.uk-margin-bottom div:not(:first-child) { margin-top: -1px; }
#db_data_list div.uk-margin-bottom div:not(:first-child) tr:first-child{ visibility: collapse; }
#db_data_list table.uk-table tr th:nth-of-type(1) { width: 100px; }
#db_data_list table.uk-table tr th:nth-of-type(2) { width: 40px; }
#db_data_list table.uk-table tr th:nth-of-type(3) { width: 220px; }
#db_data_list table.uk-table tr th:nth-of-type(4) { width: 180px; }
#db_data_list table.uk-table tr th:nth-of-type(5) { width: 70px; }
/* #db_data_list table.uk-table tr th:nth-of-type(6) { width: 10px; } */


/* ============================================================
 DB検索結果テーブル：列幅を内容に合わせて自動調整
 ============================================================*/
.uk-overflow-container > .uk-table { table-layout: auto; width: 100%; }
.uk-overflow-container > .uk-table td { white-space: normal; word-break: break-word; }


/* カードグリッド：12分割（スマホは6分割） */
.card-wrap {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 8px;
}
@media (max-width: 600px) {
  .card-wrap { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

/* カード本体 */
.card {
  position: relative;
  background-color: #2b2b2b;
  border-radius: 6px;
  overflow: hidden;
}
.card img { display: block; width: 100%; height: auto; }
.card-wrap > p { display: none; } /* グリッド内の余分なpタグ非表示 */
.card-title { margin: 0; padding: 0; }

/* カード内テキストを画像に重ねて下部に配置 */
.card-text {
  position: absolute;
  bottom: 8%;
  width: 100%;
  text-align: center;
  font-size: 10px;
}
@media (max-width: 600px) {
  .card-text { font-size: 9px; }
}


/* DB共通リスト表：セル幅・ヘッダー重複非表示 */
.db-list-common table.uk-table { margin: 0px; table-layout: fixed; }
.db-list-common .uk-margin-bottom > div:not(:first-child) { margin-top: -1px; }
.db-list-common .uk-margin-bottom > div:not(:first-child) tr:first-child { visibility: collapse; }
.db-list-common table.uk-table tr th:nth-of-type(1) { width: 100px; }
.db-list-common table.uk-table tr th:nth-of-type(2) { width: 40px; }
.db-list-common table.uk-table tr th:nth-of-type(3) { width: 220px; }
.db-list-common table.uk-table tr th:nth-of-type(4) { width: 180px; }
.db-list-common table.uk-table tr th:nth-of-type(5) { width: 70px; }

/* 図鑑リスト専用列幅 */
.db-ndk-zukan table.uk-table tr th:nth-of-type(1) { width: 120px; }
.db-ndk-zukan table.uk-table tr th:nth-of-type(2) { width: 60px; }
.db-ndk-zukan table.uk-table tr th:nth-of-type(3) { width: 260px; }
.db-ndk-zukan table.uk-table tr th:nth-of-type(4) { width: 180px; }
.db-ndk-zukan table.uk-table tr th:nth-of-type(5) { width: 80px; }

/* 特定コンテナの余白を完全除去 */
.uk-overflow-container,
.toggle-wrapper,
.limited-row-table,
.limited-row-table.uk-table { margin: 0 !important; padding: 0 !important; }

/* toggle-wrapper：高さ計測の基準点 */
.toggle-wrapper {
  position: relative;
  overflow: hidden;
}

/* DBブロック間の余白を潰す */
.uk-margin-bottom { margin-bottom: 0 !important; }


/* 横並び分割レイアウト（2分割・3分割） */
.flex-row { display: flex !important; flex-wrap: nowrap; gap: 8px; }
.flex-1 { flex: 2 !important; display: block !important; }
.flex-2 { flex: 2 !important; display: block !important; }
.flex-3 { flex: 1 !important; display: block !important; }


/* ============================================================
 見出し・部分編集
 ============================================================*/

/* PC表示時はページ名非表示
@media (min-width: 768px) {
  .uk-text-small.uk-text-right { display: none; }
}
*/
/* ページ名を常に非表示（PC・スマホ両方） */
.uk-text-small.uk-text-right {
  display: none !important;
}

/* サイトヘッダーのタイトル文字色・グロー */
#site_header h1 { color: inherit; }

#site_header h1 a.uk-link-muted,
.uk-link-muted a {
  color: #b8dff5;
  text-shadow: 0 0 5px rgba(79, 209, 255, 0.45);
}

#site_header h1 a.uk-link-muted:hover,
.uk-link-muted a:hover {
  color: #ffd166;
  text-shadow: 0 0 8px rgba(255, 209, 102, 0.8);
}


/* ページタイトル（最初のh1）：ゴールドアクセント・ガラス風 */
.main_content > h1 {
  background: rgba(0, 0, 0, 0.45);
  color: #e6f6ff;
  padding: 14px 18px;
  border-left: 8px solid #ffd166;
  border-radius: 8px;
  font-size: 1.9em;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.5);
}

/* サブページ見出し（.uk-h3.uk-link-muted のリンク） */
.uk-h3.uk-margin-small-top a.uk-link-muted {
  color: #b8dff5;                                    /* シアン寄りの薄いブルー */
  text-shadow: 0 0 5px rgba(79, 209, 255, 0.45);    /* 控えめなシアングロー */
}

/* タイトル用クラス */
.title-main {
  font-size: 2.4em;
  font-weight: bold;
  color: #e6f6ff;
  border-bottom: 3px solid #4fd1ff;
  padding-bottom: 10px;
  text-align: left;
  text-shadow: 0 0 6px rgba(79, 209, 255, 0.6);
}

/* 最終更新日・カウンター：小さめグレーで右寄せ */
/* 変更後 */
#lastmod {
  display: flex;
  justify-content: flex-end;
  gap: 16px;
  font-size: 10px;
  color: #777;
}
.lastmod-date, .lastmod-counter { white-space: nowrap; }
/* 1年以上更新なしは薄い赤 */
.old-update { color: #d9534f !important; }
/* NEW表示（緑系） */
.new-update {color: #28a745; font-weight: bold;}

/* h1：濃グレー帯＋紫左ボーダー */
h1 {
  background: #2b3037;
  color: #e0e0e0;
  padding: 4px 2px;
  border-left: 6px solid #7a5aff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.45);
  font-weight: bold;
  margin-top: 4px;
  margin-bottom: 4px;
}

/* h2：透明背景＋紫下線 */
h2 {
  background: transparent;
  color: #4a4f58;
  padding: 4px 5px;
  padding-top: 4px;
  border-bottom: 2px solid #7a5aff;
  border-top: 1px solid #ddd;
  font-weight: 600;
  margin-top: 4px;
  margin-bottom: 4px;
}

/* h3：紫下線（インライン） */
h3 {
  color: #5a5070;
  padding: 2px 4px;
  font-weight: bold;
  display: inline-block;
  background: none;
  font-size: 1.1em;
  margin-top: 8px;
  margin-bottom: 1px;
  text-decoration: underline;
  text-decoration-color: rgba(122, 90, 255, 0.4);
  text-decoration-thickness: 4px;
  text-underline-offset: 0px;
}

h3 + * { margin-top: 0px !important; }

/* 見出し直後の段落余白 */
h1 + p, h2 + p, h3 + p { margin-top: 2px; }
#main_content > p:first-of-type { margin-top: 0px; }

/* 見出し内リンク色 */
h1 a { color: #00bfff; }
h2 a, h3 a { color: #4169e1; }

/* 特定表のセルを上揃え */
.top-table table td,
.top-table table th { vertical-align: top; }

/* 部分編集ボタン用コンテナ：高さゼロ・右寄せ */
.uk-text-right {
  display: inline-block;
  float: right;
  margin: 0;
  padding: 0;
  height: 0;
  line-height: 0;
  text-align: right;
  margin-top: 20px;/*この値を大きくして下にする*/
}

/* 部分編集ボタン直後のbrや空pを非表示 */
div.uk-text-right:has(> a[href*="edit"]) + br,
div.uk-text-right:has(> a[href*="edit"]) + p,
div.uk-text-right:has(> a[href*="edit"]) + br + br { display: none !important; }

/* 部分編集ボタン直後の見出しの上余白を解除 */
div.uk-text-right:has(> a[href*="edit"]) + h1,
div.uk-text-right:has(> a[href*="edit"]) + h2,
div.uk-text-right:has(> a[href*="edit"]) + h3 { margin-top: 0 !important; }

/* 部分編集ボタンのテキストを絵文字に置換 */
.uk-text-right a { font-size: 0; }
.uk-text-right a::after { content: "🖊編集"; font-size: 12px; margin-right: 5px; }

/* areaedit範囲：右側縦線のみ（左ずれ防止） */
.areaedit-wrap {
  position: relative;
  border: none;
  border-right: 3px solid rgba(122, 90, 255, 0.5);
  border-radius: 0;
  padding: 0 6px 0 0;   /* 右にだけ線分の余白 */
  margin: 0;
  background: none;
  margin-bottom: 8px; /* ← 追加 */
  box-sizing: border-box;
  width: 100%;
}
.areaedit-wrap::before { content: none; }
.areaedit-wrap::before { content: none; }
/* ============================================================
 背景・本文エリア
 ============================================================*/

/* 背景画像：全画面固定表示 */
body {
  background-image: url("https://img.wiki3.jp/roguelikecardbattle/background.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
  background-color: #f0f0f0;
}

/* メインコンテンツsectionは透明（背景を背後に通す） */
section#main_content { background: transparent !important; }

/* 本文エリア：半透明白ガラス */
.uk-width-2-3 {
  background: rgba(255, 255, 255, 0.92) !important;
  border-radius: 14px;
  padding: 16px;
}

/* テーブル・overflow系は白固定（視認性確保） */
.uk-overflow-container,
.uk-overflow-container * { background: #fff !important; }

/* 水平線 */
hr { border: none; border-top: 1px solid #888; }

/* 通常版（青）・深層版（赤）エリアの色分け */
.content-a { background: rgba(0, 120, 200, 0.12); }
.content-b { background: rgba(200, 60, 60, 0.12); }
/* content-a/b内のpreはエリア色に合わせる */
.content-a pre {
  background: rgba(255, 255, 255, 0.75) !important;
  border: 1px solid rgba(0, 120, 200, 0.3);
  border-radius: 4px;
}

.content-b pre {
  background: rgba(255, 255, 255, 0.75) !important;
  border: 1px solid rgba(200, 60, 60, 0.3);
  border-radius: 4px;
}
/* 左メニュー：半透明白 */
.uk-width-1-3 {
  background: rgba(255, 255, 255, 0.85) !important;
  border-radius: 14px;
}

/* 左メニュー内チップス型リンク群 */
.menu-chips ul { padding: 0; margin: 0; line-height: 1.4; list-style: none; }
.menu-chips li { display: inline; }
.menu-chips a { margin: 0 8px 0 0; padding: 0; background: none; font-size: 12px; text-decoration: underline; line-height: 1.2; }
.menu-chips a:hover { color: #551a8b; }
.menu-chips { margin-top: -12px; }

/* コメント：中身は透明、全体面は半透明白 */
#comment_list > .comment,
#comment_list > .comment_body,
#comment_list > .comment p { background: transparent !important; border: none !important; box-shadow: none !important; }
#comment-form,
.uk-margin-top > .comment,
section#comment-form ~ .comment { background: rgba(255, 255, 255, 0.65) !important; border-radius: 12px; padding: 12px 16px; }
#comment-form input,
#comment-form textarea { background: rgba(255, 255, 255, 0.75) !important; }


/* テーブル内の細い区切り線 */
.mini-border { border-top: 1px solid #ccc; margin: 2px 0; }

/* ========================================================
   ゲームwiki スキルカード CSS — zukan5 専用
   wiki3.jp の「サイト共通CSS」欄に追記して使用する

   【設計方針】
   テンプレートを <div class="sc-scope"> で囲み、
   全セレクタを .sc-scope の子孫として記述することで
   zukan5 以外のDBや既存レイアウトに一切影響しない。
   background の !important は既存CSS
   「.uk-overflow-container * { background:#fff !important }」対策。
   ======================================================== */

.sc-scope .sc-wrap {
  font-family: 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif;
  background: transparent;
  padding: 4px 0;
  display: block;
  width: 100%;
  box-sizing: border-box;
}

.sc-scope .sc-card {
  background: rgba(20, 18, 42, 0.92) !important;
  border: 1px solid #2a2850 !important;
  border-radius: 6px !important;
  overflow: hidden;
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 0 !important;
}

/* ── 画像セル：「クリスタル レイ」(6文字)が収まる幅に ── */
.sc-scope .sc-img-cell {
  width: 114px;
  min-width: 114px;
  background: rgba(20, 18, 42, 0.92) !important;
  border-right: 1px solid #2a2850 !important;
  text-align: center;
  vertical-align: top;
  padding: 8px 6px !important;
}

.sc-scope .sc-name {
  display: block;
  color: #c8b8ff;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: 0.04em;
  margin-bottom: 4px;
  line-height: 1.3;
}

.sc-scope .sc-img-cell img {
  max-width: 84px;
  display: block;
  margin: 0 auto 4px;
}

/* 編集/情報リンク：デフォルト青系のまま、背景を明るくして視認性確保 */
.sc-scope .sc-tools {
  display: block;
  font-size: 11px;
  margin-top: 4px;
  line-height: 1.8;
  background: rgba(60, 80, 140, 0.25) !important;
  border-radius: 3px;
  padding: 2px 4px;
}
.sc-scope .sc-tools a {
  text-decoration: none !important;
}

/* ── 通常 / 強化：背景を統一 ── */
.sc-scope .sc-normal {
  padding: 7px 10px !important;
  border-bottom: 1px solid #1e1c3a !important;
  vertical-align: top;
  background: rgba(20, 18, 42, 0.92) !important;
}

.sc-scope .sc-enhanced {
  padding: 7px 10px !important;
  vertical-align: top;
  background: rgba(20, 18, 42, 0.92) !important;
}

.sc-scope .sc-label-n {
  display: inline-block;
  font-size: 11px;
  font-weight: bold;
  color: #a080e8;
  background: rgba(90, 50, 180, 0.25) !important;
  border: 1px solid #5a3aaa;
  border-radius: 2px;
  padding: 1px 6px;
  margin-right: 5px;
}

.sc-scope .sc-label-r {
  display: inline-block;
  font-size: 11px;
  font-weight: bold;
  color: #e06060;
  background: rgba(160, 40, 40, 0.25) !important;
  border: 1px solid #883030;
  border-radius: 2px;
  padding: 1px 6px;
  margin-right: 5px;
}

/* 属性・行数/文字数を同サイズで右寄せ */
.sc-scope .sc-cond {
  color: #8890aa;
  font-size: 10px;
}

/* 行数/文字数を右端に寄せる */
.sc-scope td.sc-normal,
.sc-scope td.sc-enhanced {
  position: relative;
}

.sc-scope .sc-cond sub {
  font-size: 10px;
  vertical-align: baseline;
  color: #686880;
  float: right;
  line-height: 1.6;
}

.sc-scope .sc-desc {
  color: #c0c8e0;
  font-size: 12px;
  line-height: 1.65;
  margin-top: 4px;
  clear: both;
}

/* ── 効果タグ行 ── */
.sc-scope .sc-footer-efc {
  background: rgba(20, 18, 42, 0.92) !important;
  border-top: 1px solid #2a2850 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
  padding: 5px 10px !important;
  line-height: 1.8;
}

/* ── 入手先行 ── */
.sc-scope .sc-footer-frm {
  background: rgba(20, 18, 42, 0.92) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.07) !important;
  padding: 5px 10px !important;
  line-height: 1.8;
}

.sc-scope .sc-footer-label {
  color: #9080cc;
  font-size: 11px;
  font-weight: bold;
  margin-right: 3px;
}

.sc-scope .sc-footer-sep {
  color: #4a4870;
  font-size: 11px;
  margin: 0 4px;
}

.sc-scope .sc-footer-val {
  color: #9898c0;
  font-size: 11px;
}

.sc-scope .sc-footer-tags {
  font-size: 11px;
}

/* ============================================================
[01] ヘッダー画像
[02] 目次（PC版）
[03] 目次（スマホ版）
[04] 脚注＆特定ワードのポップアップ
[05] ワイドレイアウト
[06] コンテンツ切り替えボタン
[07] リンク切れハイライト
[08] DB表のスクロール設定
[09] PC/スマホ表の出し分け
スキル脚注ポップアップ
敵スキル表
敵デッキポップアップ
DB検索・フィルタ・ソートUI
のCSSはgithubに外部化しました
   ============================================================ */