/**
 * 共通レイアウト（全ページ共通）— この1ファイルに一元化
 * サイドバー・ヘッダー・メニューボタン・top-bar・main-area のスタイルは
 * ここだけで定義する。各テンプレートの <style> では
 * .sidebar / .menu-toggle / .top-bar / .header-sticky / .page-wrapper / .main-area
 * を再定義しないこと。（{% include '_main_layout_css.html' %} で読み込み）
 */

/* === ベース・テーマ（未指定時用） === */
:root {
  --bg: #f5f5f8;
  --card: #ffffff;
  /* static/images/aiaicursor-logo.png 左上ピクセル（ロゴ帯の背景。ロゴ差し替え時は再取得して更新） */
  --sidebar-brand-bg: #fcfcfc;
  --ja-bg: #eef1f5;
  --text: #1a1a1e;
  --muted: #5c5c6a;
  --accent: #4f46e5;
  --accent-hover: #4338ca;
  --border: #e2e4e8;
}
* { box-sizing: border-box; }
/* 全ページ共通: html も body と同様にゼロ（テンプレートごとの html, body 再定義差で上下の余白がズレるのを防ぐ） */
html {
  margin: 0;
  padding: 0;
  min-height: 100%;
}
body {
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, "Segoe UI", sans-serif;
  background: var(--bg);
  color: var(--text);
  margin: 0;
  padding: 0;
  line-height: 1.6;
}
.page-wrapper { display: flex; min-height: 100vh; }

/* === ユーティリティ（必要最小限・全ページ共通） === */
.u-nowrap { white-space: nowrap !important; }
.u-flex { display: flex !important; }
.u-flex-nowrap { display: flex !important; flex-wrap: nowrap !important; }
.u-flex-wrap { flex-wrap: wrap !important; }
.u-items-center { align-items: center !important; }
.u-gap-2 { gap: 0.5rem !important; }
.u-gap-3 { gap: 0.75rem !important; }
.u-mt-3 { margin-top: 0.75rem !important; }
.u-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.u-link-accent { color: var(--accent); text-decoration: none; }
.u-link-accent:hover { text-decoration: underline; }
/* 角枠付きパネル（カード背景・境界線）。余白・見出しなどは別クラスで付与 */
.u-panel-bordered {
  padding: 1.25rem 1.25rem 1.5rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--card);
  box-sizing: border-box;
}
@media (max-width: 480px) {
  .u-panel-bordered {
    padding: 1rem 1rem 1.25rem;
  }
}

/* 汎用: パネル縦積みの下余白 */
.u-mb-section {
  margin-bottom: 1.25rem !important;
}
.u-mb-3 {
  margin-bottom: 0.75rem !important;
}
/* 汎用: 行区切りデータテーブル（一覧・ログ。記事本文は .article-card table） */
.u-table-rows {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}
.u-table-rows th,
.u-table-rows td {
  padding: 0.5rem 0.75rem;
  text-align: left;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
}
.u-table-rows th {
  color: var(--muted);
  font-weight: 600;
}
.u-table-rows--dense {
  font-size: 0.85rem;
}
.u-table-rows--dense th,
.u-table-rows--dense td {
  padding: 0.5rem 0.65rem;
}
.u-table-rows--header-nowrap th {
  white-space: nowrap;
}
.u-table-scroll-x {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.u-table-toolbar {
  margin: 0 0 0.75rem 0;
}
.u-table-cell-pre {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, monospace;
  color: var(--text);
}
.u-table-cell-pre--compact {
  font-size: 0.78rem;
}
.u-max-w-56 {
  max-width: 14rem;
}
.u-max-w-2xl {
  max-width: 28rem;
}
.u-break-words {
  word-break: break-word;
}
/* 管理者タブ画面: 狭い幅でテーブル横スクロール（.page-wrapper に .share-admin-layout を付与） */
@media (max-width: 768px) {
  .page-wrapper.share-admin-layout .main-area-scroll .container {
    min-width: 680px !important;
  }
  .page-wrapper.share-admin-layout .u-table-rows {
    table-layout: auto !important;
  }
  .page-wrapper.share-admin-layout .u-table-rows th,
  .page-wrapper.share-admin-layout .u-table-rows td {
    white-space: nowrap !important;
  }
}

/* 異世界衰弱（ロビー）: 公開/非公開ラジオの既定マージンを無効化 */
input[type="radio"][name="room-visibility"]{
  margin: 0;
  margin-left: 0;
}

/* === サイドバー・ハンバーガーメニュー（全ページ共通） === */
.sidebar {
  min-width: 220px;
  width: max-content;
  flex-shrink: 0;
  background: var(--card);
  border-right: 1px solid var(--border);
  padding: 0.75rem 0;
  position: sticky;
  top: 0;
  align-self: start;
  max-height: 100vh;
  overflow-y: auto;
}
/* ロゴ行は固定し、メニュー部分のみ縦スクロール（#sidebar のみ） */
#sidebar.sidebar {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
  padding-top: 0;
  padding-bottom: 0;
}
#sidebar .sidebar-nav {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 0.75rem;
}
.sidebar-nav { display: flex; flex-direction: column; gap: 0.1rem; padding: 0 0.75rem; }
.sidebar-nav a {
  display: block;
  padding: 0.5rem 0.75rem;
  border-radius: 6px;
  color: var(--text);
  text-decoration: none;
  font-size: 0.9rem;
  line-height: 1.4; /* 記事ページの body line-height: 1.8 を継承しないよう固定し、他ページと見た目を揃える */
  transition: background 0.15s;
}
.sidebar-nav a:hover { background: var(--bg); color: var(--accent); }
.sidebar-nav .nav-label {
  font-size: 0.7rem;
  color: var(--muted);
  padding: 0.6rem 0.75rem 0.15rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* 事業者カタログ: 審査待ち・差し戻し「要対応」（青ボタン内・白文字・白系バッジ） */
#sidebar .sidebar-user-block .sidebar-user-business-nav .sidebar-attention-badge {
  flex: 0 0 auto !important;
  margin-left: 0.35rem !important;
  padding: 0.12rem 0.4rem !important;
  font-size: 0.65rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  border-radius: 4px !important;
  background: rgba(255, 255, 255, 0.22) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.45) !important;
  white-space: nowrap !important;
  overflow: visible !important;
  min-width: 0 !important;
}

/* ログイン後: アクセントボタン（.sidebar-user-business-nav）右端のメニュー矢印を白に（.sidebar-nav a::after のグレーを上書き） */
#sidebar .sidebar-nav .sidebar-user-block a.sidebar-user-business-nav::after {
  border-right-color: #fff !important;
  border-top-color: #fff !important;
}

/* 未ログイン時「ログイン・登録」ボタン右端の矢印を白に */
#sidebar .sidebar-nav .sidebar-login-block a.sidebar-cta-btn::after {
  display: inline-block !important;
  border-right-color: #fff !important;
  border-top-color: #fff !important;
}

/* ログアウト右端の矢印: ボタンと同様に文字色↔背景色の反転（既定＝#5c5c6a、ホバー＝#f0f0f4） */
#sidebar .sidebar-nav .sidebar-user-block a.sidebar-logout-btn::after {
  display: inline-block !important;
  border-right-color: #5c5c6a !important;
  border-top-color: #5c5c6a !important;
}
#sidebar .sidebar-nav .sidebar-user-block a.sidebar-logout-btn:hover::after {
  border-right-color: #f0f0f4 !important;
  border-top-color: #f0f0f4 !important;
}

/* 左サイドバー「ログイン・登録」ボタン（紫）：太字にしない */
#sidebar .sidebar-login-block .sidebar-cta-btn {
  font-weight: 400;
}

/* サイドバー最上部：ロゴ（最大幅180px）＋スマホ時は×を同一行の右端に配置（overflow で隠れない） */
#sidebar .sidebar-top {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  /* 旧 .sidebar の上パディング相当をロゴ帯に含める */
  padding: 1.25rem 3rem 0.5rem 0.5rem;
  background: var(--sidebar-brand-bg);
  box-sizing: border-box;
  flex-shrink: 0;
}
#sidebar .sidebar-top .sidebar-brand {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0;
  margin: 0;
  border: none;
  background: transparent;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
#sidebar .sidebar-brand-link {
  display: inline-block;
  max-width: 180px;
  width: 100%;
  line-height: 0;
  text-decoration: none;
  border: none;
  background: transparent;
  opacity: 1;
}
/* ロゴの白が濁って見えるのを避けるため、ホバーでも opacity を下げない（フォーカスリングのみ） */
#sidebar .sidebar-brand-link:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
#sidebar .sidebar-brand-img {
  width: 100%;
  max-width: 180px;
  height: auto;
  display: block;
  margin: 0 auto;
  opacity: 1;
}

/* スマホでサイドバー開いたときの ×（ロゴ行と重ならないよう z-index を確保） */
#sidebar .menu-close {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  z-index: 202;
}

.menu-toggle {
  display: none;
  position: fixed;
  top: 0.75rem;
  left: 0.75rem;
  z-index: 201;
  width: 44px;
  height: 44px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--card);
  cursor: pointer;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  flex-direction: row;
  gap: 3px;
}
.menu-toggle:focus { outline: 2px solid var(--accent); }
.menu-toggle .menu-line {
  display: block;
  width: 3px;
  height: 14px;
  background: var(--text);
  border-radius: 1px;
}
.sidebar.open ~ .sidebar-overlay ~ .menu-toggle { display: none !important; }
.sidebar-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.4);
  z-index: 199;
}
.sidebar-overlay.open { display: block; }

/* 管理者ログイン時「管理画面」バッジ: ヘッダー・メニューより前面に表示 */
.admin-return-badge {
  position: fixed !important;
  top: 0.75rem !important;
  right: 1rem !important;
  z-index: 999999 !important;
  display: inline-flex !important;
  align-items: center !important;
  padding: 0.4rem 0.75rem !important;
  background: #6b7280 !important;
  color: #fff !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
  isolation: isolate;
}
.admin-return-badge:hover {
  background: #4f46e5 !important;
  color: #fff !important;
}
@media (max-width: 768px) {
  .admin-return-badge {
    top: 0.5rem !important;
    right: 0.5rem !important;
    font-size: 0.8rem !important;
    padding: 0.35rem 0.6rem !important;
  }
}

/* === 戻るリンク（全ページ共通・継承を受けないよう line-height 固定） === */
/* 下余白は 1rem（.flash-msg や直後のパネル・リードと詰まりすぎないよう統一）。先頭子は .main-below-header で margin-top を 0 に。 */
.back-link {
  display: inline-block;
  margin: 1rem 0 1rem 0;
  color: var(--accent);
  text-decoration: none;
  font-size: 0.95rem;
  line-height: 1.25;
}
button.back-link {
  background: none;
  border: none;
  cursor: pointer;
  font: inherit;
  padding: 0;
  text-align: left;
}
.back-link:hover { text-decoration: underline; }
.back-link--no-top-margin { margin-top: 0; }

/* === Cursor 作成バッジ（全ページ共通・継承を受けないよう line-height 固定） === */
.cursor-badge {
  position: fixed;
  bottom: 6px;
  right: 8px;
  font-size: 11px;
  color: var(--muted);
  opacity: 0.9;
  pointer-events: none;
  z-index: 99999;
  line-height: 1.25;
  text-align: right;
  background: rgba(255,255,255,0.95);
  padding: 4px 6px;
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}
.cursor-badge--minimal {
  font-size: 10px;
  opacity: 0.75;
  z-index: 9999;
  background: transparent;
  padding: 0;
  box-shadow: none;
}
@media (max-width: 768px) {
  .cursor-badge { z-index: 999999; }
  .cursor-badge--minimal { z-index: 999999; }
}

/* === 記事ページ共通（サイト記事・.lead / .cmd 等・継承を受けないよう line-height 固定） === */
.site-nav, .cursor-nav, .obsidian-nav { margin: 0.5rem 0 1rem 0; line-height: 1.25; }
.site-nav a, .cursor-nav a, .obsidian-nav a { color: var(--accent); text-decoration: none; font-size: 0.95rem; margin-right: 1rem; line-height: 1.25; }
.site-nav a:hover, .cursor-nav a:hover, .obsidian-nav a:hover { text-decoration: underline; }
.article-meta { font-size: 0.9rem; color: var(--muted); margin-bottom: 2rem; line-height: 1.25; }
.lead { font-size: 1.1rem; color: var(--muted); margin-bottom: 1.5rem; line-height: 1.4; }
.highlight { background: #eef1f9; padding: 0.2em 0.4em; border-radius: 4px; line-height: 1.25; }
.cmd {
  font-family: "Consolas", "Monaco", "Courier New", monospace;
  font-size: 0.9rem;
  background: #f0f0f4;
  padding: 0.15em 0.4em;
  border-radius: 4px;
  line-height: 1.25;
}
pre.cmd { padding: 0.75rem 1rem; display: block; margin: 0.5rem 0; border-radius: 8px; white-space: pre-wrap; }

/* 記事カード・見出し・本文（記事テンプレートで .article-card を付与した article に適用） */
.article-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 2rem;
  margin-top: 1rem;
}
.article-card h1 { font-size: 1.75rem; margin: 0 0 0.5rem 0; color: var(--text); font-weight: 700; line-height: 1.4; }
.article-card h2 { font-size: 1.25rem; margin: 2rem 0 0.75rem 0; color: var(--accent); font-weight: 600; padding-bottom: 0.25rem; border-bottom: 2px solid var(--border); }
.article-card h2:first-of-type { margin-top: 0; }
.article-card h3 { font-size: 1.05rem; margin: 1.25rem 0 0.5rem 0; color: var(--text); font-weight: 600; line-height: 1.25; }
.article-card p { margin: 0 0 1rem 0; line-height: 1.6; }
.article-card ul, .article-card ol { margin: 0 0 1rem 0; padding-left: 1.5rem; }
.article-card li { margin-bottom: 0.35rem; }
.article-card blockquote { margin: 1rem 0; padding: 0.75rem 1rem; border-left: 4px solid var(--accent); background: #f8f9fc; color: var(--muted); font-style: italic; line-height: 1.4; }
.article-card blockquote a { color: var(--accent); text-decoration: none; }
.article-card blockquote a:hover { text-decoration: underline; }
.article-card table { width: 100%; border-collapse: collapse; margin: 1rem 0; font-size: 0.95rem; }
.article-card th, .article-card td { border: 1px solid var(--border); padding: 0.5rem 0.75rem; text-align: left; vertical-align: top; }
.article-card th { background: var(--bg); color: var(--accent); font-weight: 600; }
@media (max-width: 768px) {
  .article-card th, .article-card td { font-size: 0.85rem; padding: 0.4rem 0.5rem; }
}

/* コンテナ幅のバリエーション（詳細ページなど） */
.container--narrow { max-width: 900px; }
.container--article { max-width: 720px !important; }

/* メインエリア: 縦方向 Flex。子がヘッダー＋コンテンツ or コンテンツのみ */
.main-area {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1;
  min-width: 0;
  background: var(--card);
}

/* ヘッダー: 全ページ共通。sticky でスクロール時に上に固定 */
.main-area > header,
.header-sticky {
  flex-shrink: 0;
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--card, #fff) !important;
  border-bottom: 1px solid var(--border, #e2e4e8);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}

/* ヘッダー内トップバー・ページタイトル: 全ページ共通 */
.top-bar {
  display: flex;
  align-items: center;
  min-height: 48px;
  padding: 0 1.25rem;
  gap: 0.75rem;
}
.top-bar .page-title {
  font-size: 1.15rem;
  margin: 0;
  color: var(--accent);
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ヘッダー下のツールバー（検索・タブ等）がある場合: 全ページ共通 */
.header-toolbar-wrap {
  padding: 0.5rem 1rem;
  background: var(--bg, #f5f5f8);
  border-bottom: 1px solid var(--border, #e2e4e8);
}
/* 管理者（タブのみ）: ツールバー縦余白を詰める */
.page-wrapper.share-admin-layout .header-toolbar-wrap {
  padding: 0.35rem 1rem 0.25rem;
}
/* 管理者ヘッダー直下のタブ（/share/admin および関連ページ共通） */
.header-toolbar-wrap .admin-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  margin: 0;
  border-bottom: 1px solid var(--border);
  line-height: 1.25;
}
.header-toolbar-wrap .admin-tabs a {
  padding: 0.35rem 0.65rem;
  text-decoration: none;
  color: var(--muted);
  font-size: 0.9rem;
  border-bottom: 3px solid transparent;
  margin-bottom: -1px;
  line-height: 1.2;
}
.header-toolbar-wrap .admin-tabs a:hover {
  color: var(--accent);
}
.header-toolbar-wrap .admin-tabs a.active {
  color: var(--accent);
  font-weight: 600;
  border-bottom-color: var(--accent);
}
.header-inner { padding-left: 0.5rem; padding-right: 0.5rem; }

/* ヘッダーの直後の要素: 残り領域でスクロール。実質フル幅 */
.main-area > header + * {
  flex: 1;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

/* ヘッダーがない場合（子が1つだけ）: その子をスクロール領域に */
.main-area > *:only-child {
  flex: 1;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

/* ヘッダー下の横幅: 全ページ共通でフル幅。padding も統一 */
.container {
  max-width: none !important;
  margin: 0 auto;
  padding: 0 1.5rem 2rem 1.5rem;
}
/* ヘッダー内の .container は下余白をつけない（書き出し位置がずれないように） */
.main-area > header .container {
  padding-bottom: 0;
}
/* ヘッダー〜main 余白の統一: 共通クラス .main-below-header を付けた要素だけ。詳細度を上げてテンプレートの .container や後読み込みの style に絶対に負けないようにする */
.container.main-content.main-below-header,
main.main-content.main-below-header,
div.main-content.main-below-header {
  padding: 1rem 1.5rem 2rem 1.5rem !important;
}
/* 先頭子要素の上マージンを必ず0にし、余白は .main-below-header の padding だけにする（トップの p.top-lead の UA margin 等で差が出ないように） */
.main-below-header > *:first-child {
  margin-top: 0 !important;
}
/* 翻訳ウィジェット等が付与する top / position を打ち消し、余白は padding だけにする */
.main-below-header,
main.main-content.main-below-header {
  top: auto !important;
  position: relative;
}


/* === 共通コンポーネント（各テンプレートの <style> に書かずここだけで定義） === */
/* Cursor バッジ（全ページ共通・1箇所のみ） */
.cursor-badge {
  position: fixed;
  bottom: 6px;
  right: 8px;
  font-size: 11px;
  color: var(--muted);
  opacity: 0.9;
  pointer-events: none;
  z-index: 99999;
  line-height: 1.4;
  text-align: right;
  background: rgba(255,255,255,0.95);
  padding: 4px 6px;
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}
@media (max-width: 768px) {
  .cursor-badge { z-index: 999999; }
}

/* 空状態・「〇〇はありません」系（.no-results / .share-no-results / .jobs-empty / .offers-empty / .empty-msg を1パターンに統一） */
.no-results,
.share-no-results,
.jobs-empty,
.offers-empty,
.empty-msg {
  color: var(--muted);
  padding: 0 0 1rem 0;
  margin-top: 0.5rem;
}
.empty-msg { font-size: 0.9rem; }
.main-below-header > .no-results:first-child,
.main-below-header > .share-no-results:first-child,
.main-below-header > .jobs-empty:first-child,
.main-below-header > .offers-empty:first-child,
.main-below-header > .empty-msg:first-child {
  margin-top: 0 !important;
}
/* share の「まだありません」は上下余白多めのバリエーション */
.share-no-results { padding: 0 0 1.5rem 0; }
/* 一覧が空のブロック用（求人・受注・応募など） */
.jobs-empty,
.offers-empty { padding: 2rem 0; }

/* 結果見出し（「〇〇の検索結果」「全○件」など） */
.results-header,
.jobs-results-header {
  color: var(--muted);
  font-size: 0.9rem;
  margin-bottom: 0.75rem;
}
.results-header { margin-bottom: 0.5rem; }

/* ========================================================================
   メインエリア共通ボタン（.page-wrapper main / .main-area / .main-content）
   ※ #sidebar（左メニュー）は .btn を使わない想定のため対象外
   1) 青 .btn-primary  2) 赤 .btn-danger / .btn-delete
   3) 黄 .btn-danger-owner / .btn-author / .btn-cta-yellow
   4) 白 .btn-secondary（白地＋アクセント枠）／ .btn-white（白地＋薄枠）
   ======================================================================== */
.page-wrapper main .btn,
.page-wrapper .main-area .btn,
.page-wrapper .main-content .btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  min-height: 44px;
  padding: 0.5rem 1rem;
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.25;
  cursor: pointer;
  text-decoration: none;
  border: 2px solid transparent;
  font-family: inherit;
  vertical-align: middle;
  appearance: none;
  -webkit-appearance: none;
}

.page-wrapper main .btn.btn-small,
.page-wrapper .main-area .btn.btn-small,
.page-wrapper .main-content .btn.btn-small {
  min-height: 44px;
  padding: 0.5rem 1rem;
  font-size: 0.95rem;
}

/* 1. 青 */
.page-wrapper main .btn-primary,
.page-wrapper .main-area .btn-primary,
.page-wrapper .main-content .btn-primary,
.page-wrapper main a.btn-primary,
.page-wrapper .main-area a.btn-primary,
.page-wrapper .main-content a.btn-primary {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}
.page-wrapper main .btn-primary:hover,
.page-wrapper .main-area .btn-primary:hover,
.page-wrapper .main-content .btn-primary:hover,
.page-wrapper main a.btn-primary:hover,
.page-wrapper .main-area a.btn-primary:hover,
.page-wrapper .main-content a.btn-primary:hover {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
  color: #fff;
}

/* jobs 一覧: 検索ボタン */
.page-wrapper main .jobs-btn,
.page-wrapper .main-area .jobs-btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.5rem 1rem;
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  border: 2px solid transparent;
  text-decoration: none;
  font-family: inherit;
}
.page-wrapper main .jobs-btn-primary,
.page-wrapper .main-area .jobs-btn-primary {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}
.page-wrapper main .jobs-btn-primary:hover,
.page-wrapper .main-area .jobs-btn-primary:hover {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
  color: #fff;
}

/* 2. 赤 */
.page-wrapper main .btn-danger,
.page-wrapper .main-area .btn-danger,
.page-wrapper .main-content .btn-danger,
.page-wrapper main .btn-delete,
.page-wrapper .main-area .btn-delete,
.page-wrapper .main-content .btn-delete {
  background: #b91c1c;
  color: #fff;
  border-color: #b91c1c;
}
.page-wrapper main .btn-danger:hover,
.page-wrapper .main-area .btn-danger:hover,
.page-wrapper .main-content .btn-danger:hover,
.page-wrapper main .btn-delete:hover,
.page-wrapper .main-area .btn-delete:hover,
.page-wrapper .main-content .btn-delete:hover {
  background: #991b1b;
  border-color: #991b1b;
  color: #fff;
}

/* 3. 黄（作者・CTA） */
.page-wrapper main .btn-danger-owner,
.page-wrapper .main-area .btn-danger-owner,
.page-wrapper .main-content .btn-danger-owner,
.page-wrapper main .btn-author,
.page-wrapper .main-area .btn-author,
.page-wrapper .main-content .btn-author,
.page-wrapper main a.btn-danger-owner,
.page-wrapper .main-area a.btn-danger-owner {
  background: #ca8a04;
  color: #fff;
  border-color: #ca8a04;
}
.page-wrapper main .btn-danger-owner:hover,
.page-wrapper .main-area .btn-danger-owner:hover,
.page-wrapper .main-content .btn-danger-owner:hover,
.page-wrapper main .btn-author:hover,
.page-wrapper .main-area .btn-author:hover,
.page-wrapper .main-content .btn-author:hover,
.page-wrapper main a.btn-danger-owner:hover,
.page-wrapper .main-area a.btn-danger-owner:hover {
  background: #a16207;
  border-color: #a16207;
  color: #fff;
}

/* 4. 白系・ニュートラル（グレー枠・カード地。RSS更新・キャンセル等） */
.page-wrapper main .btn-secondary,
.page-wrapper .main-area .btn-secondary,
.page-wrapper .main-content .btn-secondary {
  background: var(--card);
  color: var(--text);
  border-color: var(--border);
  border-width: 1px;
}
.page-wrapper main .btn-secondary:hover,
.page-wrapper .main-area .btn-secondary:hover,
.page-wrapper .main-content .btn-secondary:hover {
  background: #e8eaee;
  color: var(--text);
  border-color: var(--border);
}

/* 4b. 白地＋アクセント枠（白抜きCTA） */
.page-wrapper main .btn-outline-accent,
.page-wrapper .main-area .btn-outline-accent,
.page-wrapper .main-content .btn-outline-accent {
  background: #fff;
  color: var(--accent);
  border-color: var(--accent);
}
.page-wrapper main .btn-outline-accent:hover,
.page-wrapper .main-area .btn-outline-accent:hover,
.page-wrapper .main-content .btn-outline-accent:hover {
  background: var(--bg);
  color: var(--accent);
  border-color: var(--accent);
}

/* 4c. 白地・薄枠（違反報告など） */
.page-wrapper main .btn-white,
.page-wrapper .main-area .btn-white,
.page-wrapper .main-content .btn-white {
  background: #fff;
  color: var(--text);
  border-color: var(--border);
}
.page-wrapper main .btn-white:hover,
.page-wrapper .main-area .btn-white:hover,
.page-wrapper .main-content .btn-white:hover {
  background: var(--bg);
  color: var(--text);
  border-color: var(--border);
}

/* 掲載用 CTA（黄ボタン）: /share・/jobs 共通 */
.page-wrapper main .btn-cta-yellow,
.page-wrapper .main-area .btn-cta-yellow,
.page-wrapper .main-content .btn-cta-yellow,
a.btn-cta-yellow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.5rem 1rem;
  background: #ca8a04;
  color: #fff;
  font-weight: 600;
  font-size: 0.95rem;
  border-radius: 8px;
  text-decoration: none;
  border: 2px solid #ca8a04;
  box-sizing: border-box;
}
.page-wrapper main .btn-cta-yellow:hover,
.page-wrapper .main-area .btn-cta-yellow:hover,
.page-wrapper .main-content .btn-cta-yellow:hover,
a.btn-cta-yellow:hover {
  background: #a16207;
  border-color: #a16207;
  color: #fff;
}

/* 求人・受注一覧の「掲載する」系リンク */
.page-wrapper main .new-offer-link,
.page-wrapper .main-area .new-offer-link,
.page-wrapper main .new-job-link,
.page-wrapper .main-area .new-job-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.5rem 1rem;
  background: var(--accent);
  color: #fff;
  font-weight: 600;
  font-size: 0.95rem;
  border-radius: 8px;
  text-decoration: none;
  border: 2px solid var(--accent);
  box-sizing: border-box;
}
.page-wrapper main .new-offer-link:hover,
.page-wrapper .main-area .new-offer-link:hover,
.page-wrapper main .new-job-link:hover,
.page-wrapper .main-area .new-job-link:hover {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
  color: #fff;
}
/* 掲載 CTA 行（ボタン＋※ログインが必要です のラップ） */
.cta-row {
  margin-bottom: 1rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}
.cta-row .cta-note { font-size: 0.8rem; color: var(--muted); }

/* PC: サイドバー固定・メインエリア左マージン */
@media (min-width: 769px) {
  .sidebar {
    position: fixed !important;
    left: 0;
    top: 0;
    bottom: 0;
    width: 300px;
    z-index: 50;
    overflow-y: auto;
  }
  #sidebar.sidebar {
    overflow: hidden;
    display: flex;
    flex-direction: column;
  }
  #sidebar .sidebar-nav {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .main-area { margin-left: 300px; }
  /* PC では × 非表示のためロゴ行の右余白を詰める */
  #sidebar .sidebar-top { padding-right: 0.5rem; }
}

/* スマホ・幅狭: page-wrapper をビューポート高に固定し、内側だけスクロール */
@media (max-width: 768px) {
  html { overflow-x: hidden; height: 100%; }
  body { padding: 0; margin: 0; overflow: hidden; height: 100%; }
  /**
   * display:flex のままだと、position:fixed のサイドバーが flex 子として幅（最大 300px）を
   * 横方向に確保し続け、メインが右に押しつぶされる環境がある（異世界衰弱／シューティング等）。
   * ブロック化して固定サイドバーをフロー外にし、.main-area を全幅にする。
   */
  .page-wrapper {
    display: block !important;
    position: relative;
    min-height: 100vh;
    min-height: 100dvh;
    height: 100vh;
    height: 100dvh;
    max-height: 100vh;
    max-height: 100dvh;
    overflow: hidden;
  }

  .sidebar {
    position: fixed !important;
    left: 0;
    top: 0;
    bottom: 0;
    width: 300px;
    max-width: 85vw;
    /* ベース .sidebar の min-width:220px がこのブロックで上書きされず残ると、
       display:flex の page-wrapper 行方向で幅を確保し続けメインが右に寄る */
    min-width: 0 !important;
    z-index: 200;
    transform: translateX(-100%);
    transition: transform 0.25s ease-out;
    box-shadow: 4px 0 12px rgba(0,0,0,0.1);
  }
  .sidebar.open { transform: translateX(0); }
  #sidebar.sidebar {
    overflow: hidden;
    display: flex;
    flex-direction: column;
  }
  #sidebar .sidebar-nav {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  /* スマホでサイドバーを開いたとき、×で閉じるボタンを必ず表示（全ページ共通） */
  #sidebar.open .menu-close { display: flex !important; visibility: visible !important; align-items: center; justify-content: center; }
  /* メニュー行の a のみ（.sidebar-user-block 内へ display:flex が波及すると横幅・折り返し・矢印が崩れる） */
  .sidebar-nav > a,
  .sidebar-nav .sidebar-admin-block a {
    padding: 0.75rem 1rem;
    font-size: 1rem;
    line-height: 1.4;
    min-height: 44px;
    display: flex;
    align-items: center;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .sidebar-nav > a .nav-count {
    flex-shrink: 0;
  }
  .sidebar-overlay { position: fixed !important; }
  .menu-toggle {
    position: fixed !important;
    display: flex !important;
    top: 0 !important;
    left: 0 !important;
    height: 48px !important;
    width: 48px !important;
    border: none !important;
    border-radius: 0 !important;
    border-right: 1px solid var(--border) !important;
    box-shadow: none !important;
  }

  .main-area {
    flex: none;
    width: 100%;
    min-height: 0;
    height: 100%;
    margin: 0 !important;
    padding: 0 !important;
    padding-bottom: 1rem !important;
    overflow: hidden;
  }
  /* スマホ: ヘッダーはフロー内に置き、高さは折り返しに応じて可変。絶対指定で top 固定にしない。padding は控えめにして「フッター領域」のように見えないようにする */
  .main-area-scroll {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    padding-bottom: 1rem !important;
  }
  .main-area-scroll .main-content {
    padding-bottom: 2rem !important;
    min-height: auto !important;
  }

  /* ヘッダーは fixed にせずフロー内のまま。表示量が増えて折り返しても重ならない */
  .main-area > header,
  .header-sticky {
    flex-shrink: 0;
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
    background: var(--card, #fff) !important;
    border-bottom: 1px solid var(--border, #e2e4e8) !important;
  }
  .header-sticky .header-toolbar-wrap { flex-shrink: 0; }
  .main-area .top-bar,
  .header-sticky .top-bar {
    padding-left: 48px;
    padding-right: 1rem;
    min-height: 48px;
    display: flex !important;
    align-items: center;
  }
  .top-bar .page-title { font-size: 1rem; }
  .header-inner { padding-left: 0; }
  .container.main-content.main-below-header,
  main.main-content.main-below-header,
  div.main-content.main-below-header {
    padding: 1rem 1.5rem 2rem 1.5rem !important;
  }
}

/* トップページ: ヒーロー文（サイト説明） */
.top-hero {
  margin-bottom: 1.25rem;
}
.top-hero-line {
  font-size: 1.05rem;
  color: var(--muted);
  line-height: 1.45;
  margin: 0 0 0.4rem 0;
}
.top-hero-line:last-child {
  margin-bottom: 0;
}

/* トップページ最下部：法務リンク（他ページからはリンクしない方針のとき用） */
.top-legal-footer {
  margin-top: 2.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--border);
  font-size: 0.88rem;
  color: var(--muted);
}
.top-legal-footer a {
  color: var(--muted);
  text-decoration: none;
  margin-right: 1.25rem;
}
.top-legal-footer a:hover {
  color: var(--accent);
  text-decoration: underline;
}
.top-author-opinion {
  margin-top: 1.25rem;
}

/* 私の意見（制作者の個人的見解）。後で一括で色を変える場合もここだけ変更する */
.author-opinion {
  color: #c2410c;
  background: #f5f5f5;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  padding: 0.75rem 1rem;
  margin: 0.5rem 0;
}

/* サイドバー: 表示名編集 | 異世界ポイント を1行・左詰め（表示名と同じ 0.8rem） */
#sidebar .sidebar-user-block .sidebar-edit-name-row {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.35rem !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin-bottom: 0.5rem !important;
}
#sidebar .sidebar-user-block .sidebar-edit-name-row a {
  width: auto !important;
  max-width: none !important;
  min-height: auto !important;
  min-width: 0 !important;
  flex: 0 1 auto !important;
  justify-content: flex-start !important;
  text-align: left !important;
  white-space: nowrap !important;
}
#sidebar .sidebar-user-block .sidebar-edit-name-row .sidebar-edit-name-link {
  margin-bottom: 0 !important;
}
#sidebar .sidebar-user-block .sidebar-edit-name-row .sidebar-edit-name-sep {
  flex-shrink: 0 !important;
  width: 1px !important;
  height: 0.85em !important;
  align-self: center !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--border) !important;
  border: none !important;
}
/* 表示名を編集と同じ #sidebar .sidebar-edit-name-link 由来の色・ホバーを継承。行内用に上書きのみ */
#sidebar .sidebar-user-block .sidebar-edit-name-row .sidebar-fantasy-points-link {
  flex-shrink: 0 !important;
  text-align: left !important;
}
/* メニュー「AIストック」等: .sidebar-nav > a の flex gap:0.75rem とラベル〜件数の間隔を揃える */
#sidebar .sidebar-user-block .sidebar-fantasy-points-link .nav-count {
  font-size: 0.8em;
  font-weight: 700;
  color: var(--accent) !important;
  margin-left: 0.75rem !important;
  font-variant-numeric: tabular-nums;
}
/* 表示名編集・異世界ポイント: 該当ページ表示中は .sidebar-nav a[aria-current="page"] と同じ（太字・淡い青背景） */
#sidebar .sidebar-user-block .sidebar-edit-name-row .sidebar-edit-name-link[aria-current="page"] {
  background: #eef1f9 !important;
  color: var(--accent) !important;
  font-weight: 600 !important;
}
/* スマホ: 1行・nowrap だと「表示名を編集」と「異世界ポイント」が重なるため、縦に分けてエリア表示 */
@media (max-width: 768px) {
  /* .sidebar-user-block の左右パディングを相殺し、下の .sidebar-nav > a と同じ 1rem 基準で矢印位置を揃える */
  #sidebar .sidebar-user-block .sidebar-edit-name-row {
    flex-direction: column !important;
    align-items: stretch !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
    margin-left: -0.75rem !important;
    margin-right: -0.75rem !important;
    width: calc(100% + 1.5rem) !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
  #sidebar .sidebar-user-block .sidebar-edit-name-row .sidebar-edit-name-sep {
    display: none !important;
  }
  #sidebar .sidebar-user-block .sidebar-edit-name-row a {
    white-space: normal !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    flex-shrink: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    box-sizing: border-box !important;
    padding: 0 1rem !important;
    min-height: 48px !important;
    margin: 0 !important;
    border-radius: 0 !important;
    background: var(--card) !important;
    border-bottom: 1px solid var(--border) !important;
    font-size: 1rem !important;
    line-height: 1.4 !important;
    color: var(--text) !important;
  }
  /* トップ・AIストック等のメニュー行と同様、ホバー／タップ／キーボードフォーカスで背景が変わる */
  #sidebar .sidebar-user-block .sidebar-edit-name-row a:hover,
  #sidebar .sidebar-user-block .sidebar-edit-name-row a:focus-visible,
  #sidebar .sidebar-user-block .sidebar-edit-name-row a:active {
    background: var(--bg) !important;
    color: var(--accent) !important;
  }
  #sidebar .sidebar-user-block .sidebar-edit-name-row a:hover::after,
  #sidebar .sidebar-user-block .sidebar-edit-name-row a:focus-visible::after,
  #sidebar .sidebar-user-block .sidebar-edit-name-row a:active::after {
    border-right-color: var(--accent) !important;
    border-top-color: var(--accent) !important;
  }
  #sidebar .sidebar-user-block .sidebar-edit-name-row a:first-of-type {
    border-top: 1px solid var(--border) !important;
  }
  /* スマホのみ: メニュー行と同じ右矢印（.sidebar-user-block a::after の非表示より詳細度で上書き） */
  #sidebar .sidebar-user-block .sidebar-edit-name-row .sidebar-edit-name-link::after {
    content: "" !important;
    display: inline-block !important;
    width: 0.4em !important;
    height: 0.4em !important;
    margin-left: auto !important;
    border-right: 2px solid var(--muted) !important;
    border-top: 2px solid var(--muted) !important;
    transform: rotate(45deg) !important;
    flex-shrink: 0 !important;
  }
  #sidebar .sidebar-user-block .sidebar-edit-name-row .sidebar-fantasy-points-link .nav-count {
    flex-shrink: 0 !important;
  }
  #sidebar .sidebar-user-block .sidebar-edit-name-row .sidebar-fantasy-points-link {
    flex-shrink: 1 !important;
  }
}

/* 異世界ポイント交換ページ */
.fantasy-exchange-lead {
  font-size: 0.95rem;
  color: var(--muted);
  margin: 0 0 1rem 0;
  line-height: 1.5;
}
.fantasy-exchange-balance {
  font-size: 1rem;
  margin: 0 0 1rem 0;
}
.fantasy-exchange-balance-num {
  font-variant-numeric: tabular-nums;
}
.flash-msg {
  padding: 0.75rem;
  border-radius: 8px;
  margin-bottom: 1rem;
  line-height: 1.4;
}
.flash-msg--success {
  background: #dcfce7;
  color: #15803d;
}
.flash-msg--error {
  background: #fee2e2;
  color: #b91c1c;
}
.fantasy-exchange-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.fantasy-exchange-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1.25rem;
  margin-bottom: 1rem;
}
.fantasy-exchange-title {
  font-size: 1.05rem;
  margin: 0 0 0.5rem 0;
  font-weight: 600;
  color: var(--text);
  line-height: 1.35;
}
.fantasy-exchange-provider {
  font-size: 0.9rem;
  color: var(--muted);
  margin: 0 0 0.5rem 0;
}
.fantasy-exchange-provider-name {
  color: var(--text);
  font-weight: 600;
}
.fantasy-exchange-meta {
  font-size: 0.9rem;
  color: var(--muted);
  margin: 0 0 0.5rem 0;
}
.fantasy-exchange-desc {
  font-size: 0.9rem;
  color: var(--text);
  margin: 0 0 1rem 0;
  line-height: 1.5;
}
.fantasy-exchange-form {
  margin: 0;
}
/* 交換ボタン共通: button / a の UA 差を吸収し、一覧の「交換済み」と「交換する」・確認の「いいえ」「はい」を同一寸法に */
button.btn.fantasy-exchange-submit,
a.btn.fantasy-exchange-submit,
.btn.fantasy-exchange-btn-cancel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 44px;
  padding: 0.5rem 1rem;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.25;
  border-radius: 8px;
  vertical-align: middle;
  appearance: none;
  -webkit-appearance: none;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  margin: 0;
  font-family: inherit;
}
button.btn.fantasy-exchange-submit,
a.btn.fantasy-exchange-submit {
  border: 2px solid var(--accent);
  background: var(--accent);
  color: #fff;
}
.btn.fantasy-exchange-btn-cancel {
  border: 2px solid var(--border);
  background: var(--card);
  color: var(--text);
}
.btn.fantasy-exchange-btn-cancel:hover {
  background: var(--bg);
  color: var(--accent);
  border-color: var(--accent);
}
.btn.fantasy-exchange-submit:hover:not(:disabled) {
  background: var(--accent-hover);
}
a.btn.fantasy-exchange-submit:hover {
  background: var(--accent-hover);
  color: #fff;
}
.btn.fantasy-exchange-submit:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.fantasy-exchange-note {
  font-size: 0.85rem;
  color: var(--muted);
  margin: 0.5rem 0 0 0;
}
.fantasy-exchange-confirm-box .fantasy-exchange-balance {
  margin-top: 0.5rem;
}
.fantasy-exchange-confirm-q {
  font-size: 1rem;
  font-weight: 600;
  margin: 1rem 0 0.75rem 0;
  color: var(--text);
}
.fantasy-exchange-confirm-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 0.75rem;
  margin-top: 0.25rem;
}
.fantasy-exchange-confirm-actions .fantasy-exchange-form--inline {
  display: flex;
  align-items: stretch;
  align-self: stretch;
  margin: 0;
}
.fantasy-exchange-confirm-actions .fantasy-exchange-form--inline .btn.fantasy-exchange-submit {
  margin: 0;
  align-self: stretch;
  width: auto;
  min-height: 44px;
}
.btn.fantasy-exchange-submit.fantasy-exchange-submit--done {
  background: var(--muted);
  color: #fff;
  border-color: transparent;
  cursor: not-allowed;
  opacity: 1;
}
.btn.fantasy-exchange-submit.fantasy-exchange-submit--done:disabled {
  opacity: 1;
}

/* 管理画面: 異世界ポイント交換カタログ（更新・削除を横並び） */
.admin-fantasy-exchange-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-top: 0.75rem;
}
/* === /stock（index.html）RSS取得先一覧（枠は .u-panel-bordered） === */
.rss-sources-section {
  margin-top: 1rem;
}
.rss-sources-section h2 {
  font-size: 1.1rem;
  margin: 0 0 0.75rem 0;
  color: var(--accent);
  font-weight: 600;
}
.rss-sources-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 0.35rem;
}
.rss-sources-list li {
  font-size: 0.9rem;
  padding: 0.35rem 0;
  border-bottom: 1px solid var(--border);
}
.rss-sources-list li:last-child {
  border-bottom: none;
}
.rss-sources-list a {
  color: var(--accent);
  text-decoration: none;
}
.rss-sources-list a:hover {
  text-decoration: underline;
}
.rss-sources-list .source-name {
  font-weight: 500;
}
.rss-sources-list .source-url {
  font-size: 0.8rem;
  color: var(--muted);
  margin-left: 0.5rem;
  word-break: break-all;
}

/* /stock 検索結果カード（枠は .u-panel-bordered） */
.result-card {
  margin-bottom: 1rem;
}
.result-card h2 {
  font-size: 1.05rem;
  margin: 0 0 0.5rem 0;
  font-weight: 600;
}
.result-card h2 a {
  color: var(--accent);
  text-decoration: none;
}
.result-card h2 a:hover {
  text-decoration: underline;
}
.result-meta {
  font-size: 0.8rem;
  color: var(--muted);
  margin-bottom: 0.75rem;
}
.original-block,
.translation-block {
  margin-bottom: 0.75rem;
}
.block-label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  margin-bottom: 0.25rem;
}
.translation-block .content {
  background: var(--ja-bg);
  padding: 0.6rem 0.75rem;
  border-radius: 6px;
  border-left: 3px solid var(--accent);
}
.result-body {
  font-size: 0.9rem;
  color: var(--text);
  line-height: 1.6;
}
.result-body.clamp {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* === 事業者登録・カタログ管理（ログイン後） === */
.merchant-page-body .merchant-page {
  max-width: 640px;
}
.merchant-page-lead {
  margin: 0 0 1rem 0;
  line-height: 1.6;
  color: var(--text);
  font-size: 0.95rem;
}
.merchant-form {
  margin-top: 0.5rem;
}
/* 事業者登録: 入力〜送信を1枠に（枠本体は .u-panel-bordered） */
.merchant-form-panel {
  margin-top: 0;
}
/* 事業者カタログ（/merchant/catalog）: 1列目＝項目ラベル、2列目＝入力＋補足
   幅変更時にしわ寄せが入力列だけに偏らないよう、1列目も %＋clamp でビュー幅に連動 */
.merchant-catalog-add-form .merchant-form-field,
.merchant-catalog-edit-form .merchant-form-field {
  display: grid;
  grid-template-columns: clamp(9rem, 28vw, 17rem) minmax(0, 1fr);
  gap: 0.5rem 1rem;
  align-items: start;
}
.merchant-catalog-add-form .merchant-form-field > label,
.merchant-catalog-edit-form .merchant-form-field > label {
  margin-bottom: 0;
  padding-top: 0.4rem;
  line-height: 1.35;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.merchant-form-field-input {
  min-width: 0;
}
@media (max-width: 640px) {
  .merchant-catalog-add-form .merchant-form-field,
  .merchant-catalog-edit-form .merchant-form-field {
    grid-template-columns: 1fr;
  }
  .merchant-catalog-add-form .merchant-form-field > label,
  .merchant-catalog-edit-form .merchant-form-field > label {
    padding-top: 0;
  }
}
.merchant-form-field {
  margin-bottom: 1.25rem;
}
.merchant-form-field label {
  display: block;
  margin-bottom: 0.35rem;
  font-weight: 600;
  font-size: 0.95rem;
}
.merchant-form-required {
  color: #b91c1c;
  font-weight: 700;
}
.merchant-form-field input[type="text"],
.merchant-form-field input[type="email"],
.merchant-form-field input[type="tel"],
.merchant-form-field input[type="url"],
.merchant-form-field input[type="number"],
.merchant-form-field select,
.merchant-form-field textarea {
  width: 100%;
  max-width: 100%;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 1rem;
  box-sizing: border-box;
  background: var(--card);
  color: var(--text);
}
.merchant-form-field textarea {
  min-height: 8rem;
  resize: vertical;
  line-height: 1.5;
}
.merchant-form-field input:focus,
.merchant-form-field select:focus,
.merchant-form-field textarea:focus {
  outline: none;
  border-color: var(--accent);
}
.merchant-form-hint {
  font-size: 0.85rem;
  color: var(--muted);
  margin: 0.35rem 0 0 0;
}
.merchant-form-consent {
  margin: 1.25rem 0 0.5rem 0;
  padding: 0.75rem 1rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg);
}
.merchant-form-consent-label {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-weight: normal;
  cursor: pointer;
  margin: 0;
}
.merchant-form-consent-label input[type="checkbox"] {
  margin-top: 0.2rem;
  flex-shrink: 0;
}
.merchant-form-actions {
  margin-top: 1.5rem;
}
/* 事業者フォーム送信: .btn.btn-primary に統一（寸法・ホバーはメイン共通ボタン） */
.merchant-catalog-attention-banner {
  margin: 0 0 1rem 0;
  padding: 0.75rem 1rem;
  border-radius: 10px;
  border: 1px solid #f59e0b;
  background: #fffbeb;
  color: var(--text);
  line-height: 1.5;
}
.merchant-catalog-attention-banner__title {
  display: block;
  font-size: 0.95rem;
  margin-bottom: 0.35rem;
  color: #b45309;
}
.merchant-catalog-attention-banner__text {
  font-size: 0.9rem;
  color: var(--text);
}
.merchant-dashboard-stats-card {
  margin-top: 0.75rem;
}
.merchant-dashboard-stats {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(7rem, 1fr));
  gap: 0.75rem 1rem;
}
.merchant-dashboard-stat {
  margin: 0;
  padding: 0.65rem 0.75rem;
  border-radius: 8px;
  background: var(--bg-elevated, rgba(0, 0, 0, 0.12));
  border: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.merchant-dashboard-stat__label {
  font-size: 0.8rem;
  color: var(--muted);
  font-weight: 600;
}
.merchant-dashboard-stat__value {
  font-size: 1.35rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.merchant-dashboard-stat__value--ok {
  color: #15803d;
}
.merchant-dashboard-stat__value--pending {
  color: #b45309;
}
.merchant-dashboard-stat__value--rejected {
  color: #b91c1c;
}
.merchant-form-hint {
  margin: 0.25rem 0 0 0;
  font-size: 0.8rem;
  color: var(--muted);
  line-height: 1.45;
}
.merchant-form-date-input,
.merchant-cap-input {
  font-variant-numeric: tabular-nums;
}
.admin-fantasy-field-hint {
  margin: 0 0 0.5rem 0;
  font-size: 0.85rem;
  color: var(--muted);
}
.admin-fantasy-date-input,
.admin-fantasy-cap-input {
  font-variant-numeric: tabular-nums;
}
.fantasy-exchange-location,
.fantasy-exchange-period {
  font-size: 0.9rem;
  color: var(--muted);
  margin: 0.35rem 0 0 0;
}
.fantasy-exchange-period--continuous {
  font-size: 0.85rem;
}
.sidebar-merchant-suspended-note {
  margin: 0.5rem 0 0 0;
  padding: 0.5rem 0.65rem;
  font-size: 0.85rem;
  color: var(--muted);
  border: 1px solid var(--border);
  border-radius: 6px;
  background: rgba(185, 28, 28, 0.08);
}
.merchant-catalog-card {
  margin-top: 0.75rem;
}
.merchant-catalog-add-card {
  margin-top: 1rem;
}
.merchant-catalog-add-card .merchant-page-lead {
  margin-top: 0;
}
.merchant-catalog-add-card .merchant-catalog-section-title {
  margin-top: 0;
}
.merchant-catalog-heading {
  font-size: 1.15rem;
  margin: 0 0 0.75rem 0;
  color: var(--accent);
  font-weight: 600;
}
.merchant-catalog-dl {
  margin: 0 0 1rem 0;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.35rem 1rem;
  font-size: 0.95rem;
}
.merchant-catalog-dl dt {
  margin: 0;
  color: var(--muted);
  font-weight: 600;
}
.merchant-catalog-dl dd {
  margin: 0;
  word-break: break-word;
}
.merchant-catalog-placeholder {
  margin-top: 1rem;
  margin-bottom: 0;
}
.merchant-catalog-section {
  margin-top: 1.75rem;
}
.merchant-catalog-section-title {
  font-size: 1.1rem;
  margin: 0 0 0.75rem 0;
  color: var(--accent);
  font-weight: 600;
}
.merchant-catalog-add-form {
  margin-bottom: 0.5rem;
}
.merchant-catalog-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.merchant-catalog-item {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 1rem;
  margin-bottom: 1rem;
  background: var(--card);
}
.merchant-catalog-item-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.5rem 0.75rem;
  font-size: 0.85rem;
  color: var(--muted);
  margin: 0 0 0.75rem 0;
}
/* 登録済みカタログ行: 更新・削除は .btn / .btn-primary / .btn-danger の共通寸法に従う */
.merchant-catalog-delete-form {
  margin: 0;
  padding: 0;
  border: none;
  display: inline-block;
}
.merchant-catalog-empty {
  color: var(--muted);
  margin: 0;
  font-size: 0.95rem;
}
.admin-fantasy-exchange-source {
  font-size: 0.85rem;
  color: var(--muted);
  margin: 0 0 0.5rem 0;
}
.admin-fantasy-review-mode-form .admin-fantasy-review-mode-radios {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin: 0.5rem 0;
}
.admin-fantasy-review-mode-label {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  cursor: pointer;
  font-size: 0.95rem;
}
.admin-fantasy-review-badge {
  display: inline-block;
  padding: 0.1rem 0.4rem;
  border-radius: 6px;
  font-size: 0.75rem;
  font-weight: 600;
}
.admin-fantasy-review-badge--pending {
  background: #fef3c7;
  color: #b45309;
}
.admin-fantasy-review-badge--ok {
  background: #dcfce7;
  color: #15803d;
}
.admin-fantasy-review-badge--rejected {
  background: #fee2e2;
  color: #b91c1c;
}
.admin-merchant-status {
  display: inline-block;
  padding: 0.1rem 0.45rem;
  border-radius: 6px;
  font-size: 0.8rem;
  font-weight: 600;
}
.admin-merchant-status--active {
  background: #dcfce7;
  color: #15803d;
}
.admin-merchant-status--suspended {
  background: #fee2e2;
  color: #b91c1c;
}
.admin-merchant-status-form {
  display: inline;
}
.admin-merchant-suspend-btn {
  background: var(--error, #b91c1c);
  color: #fff;
}
.admin-merchant-suspend-btn:hover {
  filter: brightness(1.05);
}
/* /share/admin … PR記事タブ */
.share-admin-pr-hint {
  font-size: 0.88rem;
  color: var(--muted);
  margin: 0 0 0.75rem 0;
  line-height: 1.5;
}
/* 全PR記事一覧ブロック：枠幅をテーブル実幅に合わせる（max-width で縮めず一覧が枠からはみ出さない） */
.share-admin-pr-article-list-section {
  width: fit-content;
  box-sizing: border-box;
}
.share-admin-pr-th-catalog-clicks {
  text-align: center;
  white-space: normal;
}
.admin-pr-settings-form .admin-pr-settings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  gap: 0.65rem 1rem;
  margin-bottom: 0.85rem;
}
.admin-pr-settings-form label {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  font-size: 0.88rem;
  color: var(--text);
  font-weight: 600;
}
.admin-pr-settings-form input[type="number"] {
  width: 100%;
  max-width: 12rem;
  padding: 0.45rem 0.55rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 0.9rem;
  box-sizing: border-box;
  background: var(--card);
  color: var(--text);
}
.share-admin-pr-table-wrap {
  overflow-x: auto;
  margin-bottom: 0.5rem;
}
/* /share/admin?tab=pr_articles … メイン列のみ横スクロール（ヘッダー・タブは固定幅のまま） */
.page-wrapper .main-area-scroll > main.share-admin-main--pr-xscroll {
  overflow-x: auto;
  overflow-y: visible;
  max-width: 100%;
  box-sizing: border-box;
  min-width: 0;
}
/* PC のみ: PR記事タブ … ページ全体が縦に伸びないようビューポートに閉じ、縦スクロールは main-area-scroll 内だけにする（横バーが常に見える） */
@media (min-width: 769px) {
  .page-wrapper.share-admin-pr-viewport-lock {
    height: 100vh;
    height: 100dvh;
    max-height: 100vh;
    max-height: 100dvh;
    overflow: hidden;
    box-sizing: border-box;
    align-items: stretch;
  }
  /* flex 子の min-height:auto が中身の高さまで親を押し広げるのを防ぐ */
  .page-wrapper.share-admin-pr-viewport-lock .main-area {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    max-height: 100%;
    overflow: hidden;
  }
  .page-wrapper .main-area-scroll.share-admin-scroll--pr-xscroll {
    overflow-x: scroll;
    overflow-y: auto;
  }
  .page-wrapper .main-area-scroll.share-admin-scroll--pr-xscroll > main.share-admin-main--pr-xscroll {
    overflow-x: visible;
  }
}
.page-wrapper .main-area-scroll > main.share-admin-main--pr-xscroll .share-admin-pr-table-wrap {
  overflow-x: visible;
}
.page-wrapper .main-area-scroll > main.share-admin-main--pr-xscroll .share-admin-pr-table-wrap .u-table-rows {
  width: max-content;
  min-width: 100%;
}
/* 一覧：親の min-width:100% を打ち消し、列に必要な横幅＝枠の横幅に一致させる */
.page-wrapper .main-area-scroll > main.share-admin-main--pr-xscroll .share-admin-pr-article-list-section .share-admin-pr-table-wrap .u-table-rows {
  width: max-content;
  min-width: max-content;
}
.share-admin-pr-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}
.admin-inline-form {
  display: inline;
}
.admin-pagination {
  margin-top: 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.admin-pagination__current {
  padding: 0.25rem 0.5rem;
  font-weight: 600;
  color: var(--accent);
}
.admin-fantasy-pending-actions {
  margin-bottom: 0.75rem;
}
.admin-fantasy-reject-display {
  font-size: 0.9rem;
  color: var(--muted);
  margin: 0 0 0.5rem 0;
  line-height: 1.45;
}
.admin-fantasy-reject-form {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  flex: 1 1 220px;
  min-width: 0;
  max-width: 28rem;
}
.admin-fantasy-reject-label {
  font-size: 0.85rem;
  color: var(--muted);
  font-weight: 600;
}
.admin-fantasy-reject-textarea {
  width: 100%;
  max-width: 100%;
  padding: 0.45rem 0.55rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 0.9rem;
  box-sizing: border-box;
  background: var(--card);
  color: var(--text);
  resize: vertical;
}
.admin-fantasy-reject-submit {
  align-self: flex-start;
}
.admin-fantasy-pending-note {
  font-size: 0.9rem;
  color: #b45309;
  margin: 0 0 0.5rem 0;
}
.admin-fantasy-approve-form {
  margin-bottom: 0.75rem;
}
.admin-fantasy-pending-actions .admin-fantasy-approve-form {
  margin-bottom: 0;
}
/* 差し戻すは .btn-author（黄ボタン仕様） */
.merchant-review-status {
  display: inline-block;
  flex-shrink: 0;
  padding: 0.15rem 0.45rem;
  border-radius: 6px;
  font-size: 0.8rem;
  font-weight: 600;
}
.merchant-review-status--pending {
  background: #fef3c7;
  color: #b45309;
}
.merchant-review-status--approved {
  background: #dcfce7;
  color: #15803d;
}
.merchant-review-status--rejected {
  background: #fee2e2;
  color: #b91c1c;
}
.merchant-catalog-reject-box {
  margin: 0 0 1rem 0;
  padding: 0.75rem 1rem;
  border-radius: 10px;
  border: 1px solid #fecaca;
  background: #fef2f2;
}
.merchant-catalog-reject-heading {
  font-size: 0.95rem;
  margin: 0 0 0.5rem 0;
  color: #b91c1c;
  font-weight: 600;
}
.merchant-catalog-reject-body {
  font-size: 0.95rem;
  color: var(--text);
  line-height: 1.55;
  white-space: pre-wrap;
  word-break: break-word;
}
.merchant-catalog-reject-note {
  font-size: 0.9rem;
  color: var(--text);
  margin: 0 0 0.75rem 0;
  padding: 0.6rem 0.75rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
  line-height: 1.45;
}
.merchant-catalog-reject-note--empty {
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  color: var(--muted);
  font-size: 0.9rem;
}
@media (max-width: 768px) {
  .merchant-page-body .main-area-scroll {
    padding-bottom: 72px;
  }
}

/* メール・DM 受信トレイ: 1行目＝種類・相手メール・対象・日時、2行目＝本文プレビュー */
.mail-dm-inbox-wrap {
  width: 100%;
}
.mail-dm-inbox-grid {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.5rem 0.75rem;
  align-items: start;
}
.mail-dm-inbox-cb {
  padding-top: 0.2rem;
}
.mail-dm-inbox-select-all-row {
  padding-bottom: 0.65rem;
  margin-bottom: 0.35rem;
  border-bottom: 1px solid var(--border);
}
.mail-dm-inbox-select-all-label {
  min-width: 0;
}
.mail-dm-inbox-select-all-text {
  font-size: 0.85rem;
  color: var(--muted);
  cursor: pointer;
}
.mail-dm-inbox-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.mail-dm-inbox-item {
  border-bottom: 1px solid var(--border);
  padding: 0.75rem 0;
}
.mail-dm-inbox-item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.mail-dm-inbox-line1 {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.5rem;
  font-size: 0.9rem;
  line-height: 1.45;
}
.mail-dm-inbox-line1 .kind-badge {
  flex-shrink: 0;
}
.mail-dm-inbox-email {
  word-break: break-all;
  color: var(--text);
}
.mail-dm-inbox-sep {
  color: var(--muted);
  user-select: none;
  flex-shrink: 0;
}
.mail-dm-inbox-target {
  min-width: 0;
  flex: 1 1 12rem;
}
.mail-dm-inbox-target a {
  color: var(--accent);
  text-decoration: none;
}
.mail-dm-inbox-target a:hover {
  text-decoration: underline;
}
.mail-dm-inbox-datetime {
  color: var(--muted);
  font-size: 0.85rem;
  white-space: nowrap;
  flex-shrink: 0;
}
.mail-dm-inbox-line2 {
  margin-top: 0.45rem;
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--text);
  white-space: pre-wrap;
  word-break: break-word;
}
@media (max-width: 768px) {
  .mail-dm-inbox-datetime {
    white-space: normal;
  }
}

/* AI生成ファイル紹介・編集フォーム（/share/<id>/edit） */
.page-wrapper .main-area .share-edit-panel {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1.25rem 1.5rem;
  background: var(--card);
  box-sizing: border-box;
}
.page-wrapper .main-area .share-edit-panel .form-group:last-child {
  margin-bottom: 0;
}

/* PR記事（一覧・詳細・事業者編集） */
.pr-articles-manage-lead {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem 0.75rem;
}
.pr-articles-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (min-width: 769px) {
  .pr-articles-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 1.25rem;
    align-items: stretch;
  }
  .pr-articles-list .pr-article-card {
    height: 100%;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
  }
}
.pr-article-card {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1.1rem 1.25rem;
  background: var(--card);
  display: flex;
  flex-direction: column;
}
.pr-article-card__title {
  font-size: 1.15rem;
  font-weight: 600;
  margin: 0 0 0.35rem 0;
  color: var(--accent);
}
.pr-article-card__meta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem 0.75rem;
  margin-bottom: 0.5rem;
}
/* メタ行の見た目（事業者一覧・利用者一覧で共通） */
.pr-article-card__meta {
  font-size: 0.85rem;
  color: var(--muted);
  line-height: 1.45;
}
/* 事業者一覧のみ: 横並び .pr-article-card__meta-row 内でテキスト列が伸びる */
.pr-article-card__meta-row .pr-article-card__meta {
  margin: 0;
  flex: 1 1 12rem;
  min-width: 0;
}
/* 利用者向け /pr-articles: メタはカード直下の1行。flex-grow を効かせない（縦に無駄な空白が開くのを防ぐ） */
.pr-article-card > .pr-article-card__meta {
  margin: 0 0 0.5rem 0;
}
.pr-article-card__summary {
  font-size: 0.95rem;
  line-height: 1.55;
  color: var(--text);
  margin: 0.35rem 0 0 0;
}
.pr-article-card__read-more {
  font-weight: 600;
  white-space: nowrap;
}
.pr-article-card__edit-btn {
  flex-shrink: 0;
  align-self: flex-start;
}
.pr-article-card__secondary-actions {
  margin: 0;
}
.pr-article-card__secondary-actions .btn {
  margin-top: 0.15rem;
}
.pr-article-badge-ended {
  display: inline-block;
  padding: 0.15rem 0.45rem;
  border-radius: 6px;
  background: var(--muted);
  font-size: 0.8rem;
  margin-right: 0.35rem;
}
/* PR記事詳細：本文〜受取ボタンまでの外枠、カタログの内枠 */
.pr-article-frame--main {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1rem 1.2rem 1.15rem;
  margin: 0.75rem 0 1.25rem;
  background: var(--card);
  box-sizing: border-box;
}
.pr-article-frame--catalog {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 0.85rem 1rem 1rem;
  margin: 1.25rem 0;
  background: var(--bg);
  box-sizing: border-box;
}
.pr-article-catalog-points-caption {
  font-size: 0.88rem;
  color: var(--muted);
  line-height: 1.5;
  margin: 0.85rem 0 0 0;
  padding-top: 0.75rem;
  border-top: 1px solid var(--border);
}
.pr-article-frame--main .pr-article-actions {
  border-top-color: var(--border);
}

.pr-article-detail-meta {
  font-size: 0.9rem;
  color: var(--muted);
  margin-bottom: 0.75rem;
}
.pr-article-detail-body {
  line-height: 1.75;
  margin: 1rem 0;
  word-break: break-word;
}
/* PC のみ：本文が長い記事は 2 段組み（テンプレ側で --multicol-pc を付与） */
@media (min-width: 769px) {
  .pr-article-detail-body--multicol-pc {
    column-count: 2;
    column-gap: 2rem;
    column-rule: 1px solid var(--border);
    column-fill: balance;
    orphans: 2;
    widows: 2;
  }
}
.pr-article-cover-img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}
.pr-article-actions {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border);
}
.pr-article-hint {
  font-size: 0.88rem;
  color: var(--muted);
  margin-top: 0.5rem;
}
.pr-article-flash--hide {
  display: none;
}
/* 読了受取ボタン：白ボタン。無効時は交換確認の「この内容で交換する」と同様に禁止カーソル＋薄く表示 */
.page-wrapper main .pr-article-actions button.pr-article-claim-btn:disabled,
.page-wrapper .main-area .pr-article-actions button.pr-article-claim-btn:disabled,
.page-wrapper .main-content .pr-article-actions button.pr-article-claim-btn:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.page-wrapper main .pr-article-actions button.pr-article-claim-btn:disabled:hover,
.page-wrapper .main-area .pr-article-actions button.pr-article-claim-btn:disabled:hover,
.page-wrapper .main-content .pr-article-actions button.pr-article-claim-btn:disabled:hover {
  cursor: not-allowed;
}
/* 受取完了後（disabled のまま）：グレー表示・禁止カーソル（交換の fantasy-exchange-submit--done に準拠） */
.page-wrapper main .pr-article-actions .pr-article-claim-btn--done:disabled,
.page-wrapper .main-area .pr-article-actions .pr-article-claim-btn--done:disabled,
.page-wrapper .main-content .pr-article-actions .pr-article-claim-btn--done:disabled {
  cursor: not-allowed;
  opacity: 1;
  background: var(--muted);
  color: #fff;
  border-color: transparent;
}
.page-wrapper main .pr-article-actions .pr-article-claim-btn--done:disabled:hover,
.page-wrapper .main-area .pr-article-actions .pr-article-claim-btn--done:disabled:hover,
.page-wrapper .main-content .pr-article-actions .pr-article-claim-btn--done:disabled:hover {
  cursor: not-allowed;
  background: var(--muted);
  color: #fff;
}
.pr-article-read-status--hide {
  display: none !important;
}
.pr-article-related-list {
  list-style: none;
  padding: 0;
  margin: 0.5rem 0 0 0;
}
.pr-article-related-list li {
  margin-bottom: 0.5rem;
}
.pr-article-form-stats {
  font-size: 0.88rem;
  color: var(--muted);
  margin: 0.5rem 0 1rem 0;
}
/* PR記事編集: 状態〜公開ボタンを1枠に（.u-panel-bordered と併用） */
.pr-article-edit-panel .pr-article-form-stats {
  margin-top: 0;
}
.pr-article-edit-panel .merchant-form {
  margin-top: 0;
}
.pr-article-catalog-checkboxes {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  max-height: 220px;
  overflow-y: auto;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.5rem 0.75rem;
}
.pr-article-catalog-checkboxes label {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-size: 0.95rem;
  cursor: pointer;
}
.pr-article-catalog-checkboxes input[type="checkbox"] {
  margin-top: 0.2rem;
  flex-shrink: 0;
}

.pr-article-cover-current-wrap {
  margin: 0 0 0.5rem 0;
}
.pr-article-cover-preview {
  display: block;
  max-width: 100%;
  width: auto;
  height: auto;
  max-height: 200px;
  object-fit: contain;
  border-radius: 8px;
  border: 1px solid var(--border);
}
.pr-article-cover-file-input {
  display: block;
  width: 100%;
  max-width: 28rem;
  font-size: 0.9rem;
}
.pr-article-cover-file-hint {
  font-size: 0.85rem;
  color: var(--muted);
  margin: 0.35rem 0 0 0;
}
.pr-article-cover-bonus-hint {
  font-size: 0.88rem;
  color: var(--muted);
  line-height: 1.5;
  margin: 0 0 0.5rem 0;
}

/* Flatpickr（求人編集・受注フォーム・事業者カタログ等で共通） */
.flatpickr-calendar {
  border: 2px solid var(--border) !important;
  border-radius: 10px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12) !important;
}

/* === 異世界ポイント市場 /fantasy-market === */
.fantasy-market-lead {
  font-size: 0.95rem;
  line-height: 1.75;
  color: var(--text);
  margin: 0 0 1rem 0;
}
.fantasy-market-h2 {
  font-size: 1.1rem;
  margin: 0 0 0.75rem 0;
  color: var(--accent);
  font-weight: 600;
}
.fantasy-market-summary {
  margin-bottom: 1.25rem;
}
.fantasy-market-index-main {
  font-size: 1.5rem;
  margin: 0 0 0.5rem 0;
}
.fantasy-market-index-value {
  font-weight: 700;
}
.fantasy-market-index-diff {
  font-size: 1rem;
  font-weight: 600;
  margin-left: 0.35rem;
}
.fantasy-market-index-diff--up {
  color: #15803d;
}
.fantasy-market-index-diff--down {
  color: #b91c1c;
}
.fantasy-market-meta {
  font-size: 0.88rem;
  color: var(--muted);
  margin: 0 0 1rem 0;
}
.fantasy-market-chart-wrap {
  width: 100%;
  max-width: 100%;
  margin: 0;
}
.fantasy-market-chart-canvas {
  display: block;
  width: 100%;
  height: 260px;
  background: var(--bg, #f5f5f8);
  border-radius: 8px;
}
.fantasy-market-actions {
  margin: 0 0 1.5rem 0;
}
.fantasy-market-btn-my {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.5rem 1rem;
  text-decoration: none;
  border-radius: 8px;
  font-weight: 600;
}
/* 市場: 戻るリンクの余白のみ（色・ホバーは共通 .btn-cta-yellow 等に準拠） */
.page-wrapper main a.fantasy-market-back-link,
.page-wrapper .main-area a.fantasy-market-back-link,
.page-wrapper .main-content a.fantasy-market-back-link {
  margin-bottom: 1rem;
}
.fantasy-market-open-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  width: 100%;
  margin-top: 0.25rem;
}
.fantasy-market-side {
  display: inline-block;
  font-size: 0.72rem;
  padding: 0.12rem 0.45rem;
  border-radius: 6px;
  font-weight: 700;
  vertical-align: middle;
}
.fantasy-market-side--long {
  background: #dbeafe;
  color: #1d4ed8;
}
.fantasy-market-side--short {
  background: #fee2e2;
  color: #b91c1c;
}
.fantasy-market-news-note {
  font-size: 0.88rem;
  color: var(--muted);
  margin: 0 0 0.75rem 0;
}
.fantasy-market-news-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.fantasy-market-news-item {
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--border);
}
.fantasy-market-news-item:last-child {
  border-bottom: none;
}
.fantasy-market-news-title {
  font-weight: 600;
  margin: 0 0 0.35rem 0;
}
.fantasy-market-news-body {
  margin: 0 0 0.35rem 0;
  line-height: 1.65;
  font-size: 0.95rem;
}
.fantasy-market-news-model {
  font-size: 0.78rem;
  color: var(--muted);
  margin: 0 0 0.35rem 0;
  line-height: 1.45;
}
.fantasy-market-news-meta {
  font-size: 0.8rem;
  color: var(--muted);
  margin: 0;
}
.fantasy-market-news-src {
  color: var(--accent);
}
.fantasy-market-news-empty {
  color: var(--muted);
  list-style: none;
}
.fantasy-market-my-balance,
.fantasy-market-my-index {
  font-size: 1rem;
  margin: 0 0 0.5rem 0;
}
.fantasy-market-panel {
  margin-bottom: 1.25rem;
  padding: 1rem 1.25rem;
}
.fantasy-market-panel-note {
  font-size: 0.9rem;
  color: var(--muted);
  margin: 0 0 1rem 0;
  line-height: 1.6;
}
.fantasy-market-open-form {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.75rem;
}
.fantasy-market-open-label {
  display: block;
  width: 100%;
  font-size: 0.9rem;
  font-weight: 500;
}
.fantasy-market-open-input-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1rem;
  width: 100%;
}
.fantasy-market-open-input {
  min-width: 8rem;
  padding: 0.45rem 0.6rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 1rem;
}
.fantasy-market-points-equivalent {
  color: #2563eb;
  font-size: 0.95rem;
  font-weight: 500;
  line-height: 1.4;
  white-space: nowrap;
}
.fantasy-market-points-equivalent--placeholder {
  opacity: 0.72;
  font-weight: 400;
}
.fantasy-market-position-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.fantasy-market-position-card {
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--border);
}
.fantasy-market-position-card:last-child {
  border-bottom: none;
}
.fantasy-market-close-form {
  margin-top: 0.5rem;
}
.fantasy-market-empty {
  color: var(--muted);
  margin: 0;
}
.fantasy-market-ledger-section {
  margin-bottom: 2rem;
}
.fantasy-market-ledger-list {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.7;
  color: var(--muted);
}
.fantasy-market-ledger-kind {
  font-weight: 600;
  color: var(--text);
}

/* /login ログイン選択カード：説明を行として積む（Yahoo 帰属表示の3行目など） */
.login-option > span {
  display: block;
}
.login-option > span + span {
  margin-top: 0.35rem;
}
/* /login Yahoo：帰属リンクはカード内で通常リンクに（誤って「ログインURL＝リダイレクトURI」と混同されないよう、コールバックURLを別行で明示） */
.login-option-block {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.login-yahoo-callback-note {
  font-size: 0.82rem;
  color: var(--muted);
  margin: 0;
  line-height: 1.55;
  padding: 0 0.15rem 0 0.15rem;
}
.login-yahoo-callback-note code {
  font-size: 0.88em;
  word-break: break-all;
  background: var(--ja-bg);
  padding: 0.08em 0.3em;
  border-radius: 4px;
  color: var(--text);
}
.login-yahoo-callback-em {
  font-weight: 600;
  color: var(--text);
}
.login-yahoo-callback-url {
  margin: 0;
  padding: 0 0.15rem 0 0.15rem;
  font-size: 0.82rem;
}
.login-yahoo-callback-url code {
  display: block;
  font-size: 0.8rem;
  word-break: break-all;
  background: var(--ja-bg);
  padding: 0.45rem 0.55rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  color: var(--text);
}

/* /profile/display-name — 表示名・アカウント削除は各 .u-panel-bordered。外側は .profile-account-outer のみ（枠なし・縦並びの間隔）。戻るは共通 .back-link。 */
.profile-account-outer {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.profile-account-section-title {
  font-size: 1.05rem;
  margin: 0 0 0.5rem 0;
  color: var(--text);
  font-weight: 600;
}
.profile-account-section-text {
  font-size: 0.9rem;
  color: var(--muted);
  line-height: 1.6;
  margin: 0 0 1rem 0;
}
.profile-account-page .form-block {
  margin-bottom: 1.25rem;
}
.profile-account-page .form-block label {
  display: block;
  margin-bottom: 0.35rem;
  font-weight: 600;
}
.profile-account-page .form-block input {
  width: 100%;
  max-width: 320px;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 1rem;
  box-sizing: border-box;
}
.profile-account-page .form-block input:focus {
  outline: none;
  border-color: var(--accent);
}
.profile-account-name-form {
  margin: 0;
}
.profile-account-delete-form {
  margin: 0;
}

/* --- 異世界戦記（テスト） --- */
#senki-screen-stage {
  position: relative;
}
/* 全画面時 #senki-fs-target の直接子になったステージ画面を縦フレックス化（内側の .senki-canvas-wrap flex:1 が効く） */
#senki-fs-target.senki-fs-active > #senki-screen-stage.is-active,
#senki-fs-target:fullscreen > #senki-screen-stage.is-active,
#senki-fs-target:-webkit-full-screen > #senki-screen-stage.is-active,
#senki-fs-target:-moz-full-screen > #senki-screen-stage.is-active,
#senki-fs-target:-ms-fullscreen > #senki-screen-stage.is-active {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.senki-fs-target {
  position: relative;
}
.senki-stage-topbar.senki-actions {
  margin-top: 0;
  margin-bottom: 0.35rem;
}
.senki-stage-topbar {
  justify-content: flex-start;
  align-items: center;
}
.senki-stage-topbar .senki-btn-fullscreen {
  margin-left: auto;
}
.senki-stage-status-block {
  margin: 0 0 0.5rem 0;
  font-size: 0.88rem;
  line-height: 1.5;
  color: #111827;
  white-space: pre-line;
  word-break: break-word;
}
.senki-vitals-bar {
  margin: 0 0 0.45rem 0;
  max-width: 22rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.senki-vitals-stamina-row {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.senki-vitals-label {
  font-size: 0.82rem;
  color: #1e293b;
}
.senki-vitals-track {
  height: 10px;
  border-radius: 5px;
  background: rgba(0, 0, 0, 0.18);
  border: 1px solid var(--border);
  overflow: hidden;
  box-sizing: border-box;
}
.senki-vitals-fill {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: width 0.2s ease;
}
.senki-vitals-fill--stamina {
  background: linear-gradient(90deg, #4ade80, #22c55e);
  min-width: 0;
}
.senki-vitals-companion-row {
  display: flex;
  gap: 0.35rem;
  align-items: flex-end;
}
.senki-vitals-slot-wrap {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.12rem;
  border-radius: 4px;
  box-sizing: border-box;
}
/* いま戦闘に参加している編成枠（先頭生存同行＝遭遇画面の金色枠と同じ考え方） */
.senki-vitals-slot-wrap--lead {
  outline: 2px solid rgba(202, 138, 4, 0.95);
  outline-offset: 1px;
}
.senki-vitals-hp-meter-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
  width: 100%;
}
.senki-vitals-hp-fraction {
  flex-shrink: 0;
  font-size: 0.62rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: #1e293b;
  line-height: 1.2;
  white-space: nowrap;
}
.senki-vitals-companion-name {
  font-size: 0.58rem;
  font-weight: 600;
  color: #1e293b;
  text-align: center;
  line-height: 1.15;
  letter-spacing: 0.02em;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.senki-vitals-hp-meter-row .senki-vitals-mini-track {
  flex: 1;
  min-width: 0;
}
.senki-vitals-mini-track {
  height: 6px;
  border-radius: 3px;
  background: rgba(0, 0, 0, 0.18);
  border: 1px solid var(--border);
  overflow: hidden;
  display: block;
  box-sizing: border-box;
}
.senki-vitals-mini-track.senki-vitals-slot--dead {
  opacity: 0.72;
  border-style: dashed;
}
.senki-vitals-mini-fill {
  display: block;
  height: 100%;
  width: 100%;
  transform: scaleX(1);
  transform-origin: left center;
  border-radius: 2px;
  background: linear-gradient(90deg, #93c5fd, #60a5fa);
  transition: transform 0.2s ease;
  min-width: 0;
  box-sizing: border-box;
  will-change: transform;
}
.senki-combat-party-slot--dead {
  opacity: 0.4;
  filter: grayscale(0.9);
}
.senki-combat-party-slot--dead .senki-combat-party-thumb {
  filter: grayscale(1);
}
.senki-combat-party-slot--active {
  box-shadow:
    0 0 0 2px #ca8a04,
    0 0 0 4px rgba(234, 179, 8, 0.35),
    0 4px 14px rgba(0, 0, 0, 0.35);
}
.senki-combat-party-slot--active.senki-combat-party-slot--dead {
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
}
.senki-combat-party-thumb--compact {
  width: 48px;
}
.senki-combat-party-thumb--compact.senki-card-thumb--placeholder {
  width: 48px;
}
/* :fullscreen だけではスタイルが当たらない環境があるため .senki-fs-active を JS で同期（isekai-senki.js） */
#senki-fs-target:fullscreen,
#senki-fs-target:-webkit-full-screen,
#senki-fs-target:-moz-full-screen,
#senki-fs-target:-ms-fullscreen,
#senki-fs-target.senki-fs-active {
  width: 100%;
  height: 100%;
  max-height: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  min-height: -webkit-fill-available;
  box-sizing: border-box;
  /* var(--bg) は test-game-card-fantasybattle.css の :root 上書きの影響を受けるため固定色 */
  background: #0b0b10;
  color: #e8e8ee;
  display: flex;
  flex-direction: column;
  padding: 0.5rem;
  overflow: hidden;
}
/* ID + !important: body / .main-content の継承・詳細度より確実に白（全画面時） */
#senki-fs-target:fullscreen #senki-stage-status-block,
#senki-fs-target:-webkit-full-screen #senki-stage-status-block,
#senki-fs-target:-moz-full-screen #senki-stage-status-block,
#senki-fs-target:-ms-fullscreen #senki-stage-status-block,
#senki-fs-target.senki-fs-active #senki-stage-status-block {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff;
}
#senki-fs-target:fullscreen .senki-vitals-label,
#senki-fs-target:-webkit-full-screen .senki-vitals-label,
#senki-fs-target:-moz-full-screen .senki-vitals-label,
#senki-fs-target:-ms-fullscreen .senki-vitals-label,
#senki-fs-target.senki-fs-active .senki-vitals-label {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff;
}
#senki-fs-target:fullscreen .senki-vitals-companion-name,
#senki-fs-target:-webkit-full-screen .senki-vitals-companion-name,
#senki-fs-target:-moz-full-screen .senki-vitals-companion-name,
#senki-fs-target:-ms-fullscreen .senki-vitals-companion-name,
#senki-fs-target.senki-fs-active .senki-vitals-companion-name {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff;
}
#senki-fs-target:fullscreen .senki-vitals-hp-fraction,
#senki-fs-target:-webkit-full-screen .senki-vitals-hp-fraction,
#senki-fs-target:-moz-full-screen .senki-vitals-hp-fraction,
#senki-fs-target:-ms-fullscreen .senki-vitals-hp-fraction,
#senki-fs-target.senki-fs-active .senki-vitals-hp-fraction {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff;
}
#senki-fs-target:fullscreen .senki-canvas-wrap,
#senki-fs-target:-webkit-full-screen .senki-canvas-wrap,
#senki-fs-target:-moz-full-screen .senki-canvas-wrap,
#senki-fs-target:-ms-fullscreen .senki-canvas-wrap,
#senki-fs-target.senki-fs-active .senki-canvas-wrap {
  flex: 1 1 auto;
  min-height: max(200px, calc(100vh - 11rem));
  min-width: 0;
  margin-top: 0.35rem;
  margin-bottom: 0.35rem;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
@supports (height: 100dvh) {
  #senki-fs-target:fullscreen .senki-canvas-wrap,
  #senki-fs-target:-webkit-full-screen .senki-canvas-wrap,
  #senki-fs-target:-moz-full-screen .senki-canvas-wrap,
  #senki-fs-target:-ms-fullscreen .senki-canvas-wrap,
  #senki-fs-target.senki-fs-active .senki-canvas-wrap {
    min-height: max(200px, calc(100dvh - 11rem));
  }
}
#senki-fs-target:fullscreen .senki-dpad.senki-dpad--mobile-only,
#senki-fs-target:-webkit-full-screen .senki-dpad.senki-dpad--mobile-only,
#senki-fs-target:-moz-full-screen .senki-dpad.senki-dpad--mobile-only,
#senki-fs-target:-ms-fullscreen .senki-dpad.senki-dpad--mobile-only,
#senki-fs-target.senki-fs-active .senki-dpad.senki-dpad--mobile-only {
  flex-shrink: 0;
  margin-top: 0.35rem;
  margin-bottom: 0;
}
/* 全画面ラン内の中継画面（面クリア・エンディング・最終）：同じ #senki-fs-target 内でスクロール可能にし、暗背景上で読める色 */
#senki-fs-target:fullscreen > .senki-screen.is-active:not(#senki-screen-stage),
#senki-fs-target:-webkit-full-screen > .senki-screen.is-active:not(#senki-screen-stage),
#senki-fs-target:-moz-full-screen > .senki-screen.is-active:not(#senki-screen-stage),
#senki-fs-target:-ms-fullscreen > .senki-screen.is-active:not(#senki-screen-stage),
#senki-fs-target.senki-fs-active > .senki-screen.is-active:not(#senki-screen-stage) {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
  padding-bottom: 0.75rem;
}
#senki-fs-target.senki-fs-active > .senki-screen.is-active:not(#senki-screen-stage) .senki-screen-title,
#senki-fs-target:fullscreen > .senki-screen.is-active:not(#senki-screen-stage) .senki-screen-title {
  color: #f5f5f5 !important;
}
#senki-fs-target.senki-fs-active > .senki-screen.is-active:not(#senki-screen-stage) .senki-lead,
#senki-fs-target:fullscreen > .senki-screen.is-active:not(#senki-screen-stage) .senki-lead {
  color: #e4e4ea !important;
}
#senki-fs-target.senki-fs-active > .senki-screen.is-active:not(#senki-screen-stage) .senki-result-breakdown,
#senki-fs-target:fullscreen > .senki-screen.is-active:not(#senki-screen-stage) .senki-result-breakdown {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.22);
}
#senki-fs-target.senki-fs-active > .senki-screen.is-active:not(#senki-screen-stage) .senki-result-row,
#senki-fs-target:fullscreen > .senki-screen.is-active:not(#senki-screen-stage) .senki-result-row {
  border-bottom-color: rgba(255, 255, 255, 0.14);
}
#senki-fs-target.senki-fs-active > .senki-screen.is-active:not(#senki-screen-stage) .senki-result-row dt,
#senki-fs-target.senki-fs-active > .senki-screen.is-active:not(#senki-screen-stage) .senki-result-row dd,
#senki-fs-target:fullscreen > .senki-screen.is-active:not(#senki-screen-stage) .senki-result-row dt,
#senki-fs-target:fullscreen > .senki-screen.is-active:not(#senki-screen-stage) .senki-result-row dd {
  color: #f0f0f5 !important;
}
#senki-fs-target.senki-fs-active > .senki-screen.is-active:not(#senki-screen-stage) .senki-result-row--total dt,
#senki-fs-target.senki-fs-active > .senki-screen.is-active:not(#senki-screen-stage) .senki-result-row--total dd,
#senki-fs-target:fullscreen > .senki-screen.is-active:not(#senki-screen-stage) .senki-result-row--total dt,
#senki-fs-target:fullscreen > .senki-screen.is-active:not(#senki-screen-stage) .senki-result-row--total dd {
  border-top-color: rgba(255, 255, 255, 0.25);
}
#senki-fs-target.senki-fs-active > .senki-screen.is-active:not(#senki-screen-stage) a.lobby-ranking-link,
#senki-fs-target:fullscreen > .senki-screen.is-active:not(#senki-screen-stage) a.lobby-ranking-link {
  color: #c7d2fe !important;
}
.senki-combat-overlay {
  display: none;
  position: absolute;
  inset: 0;
  z-index: 40;
  box-sizing: border-box;
  background: rgba(12, 12, 18, 0.82);
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.senki-combat-overlay.is-open {
  display: flex;
}
.senki-combat-card {
  max-width: 22rem;
  width: 100%;
  padding: 1.1rem 1.15rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
}
.senki-combat-title {
  margin: 0 0 0.5rem 0;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text);
}
.senki-combat-party {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.45rem;
  margin: 0 0 0.65rem 0;
}
.senki-combat-party-slot {
  display: inline-block;
  line-height: 0;
  border-radius: 7px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
  border: 1px solid rgba(0, 0, 0, 0.1);
}
.senki-combat-party-thumb {
  width: 54px;
  height: auto;
  display: block;
  aspect-ratio: 213 / 320;
  object-fit: cover;
  vertical-align: top;
}
.senki-combat-party-thumb.senki-card-thumb--placeholder {
  width: 54px;
}
.senki-combat-body {
  margin: 0 0 0.5rem 0;
  font-size: 0.95rem;
  line-height: 1.5;
  color: var(--text);
}
.senki-combat-hint {
  margin: 0 0 0.85rem 0;
  font-size: 0.82rem;
  line-height: 1.45;
  color: var(--muted);
}
.senki-combat-actions {
  margin-top: 0.25rem;
  flex-direction: column;
  align-items: stretch;
}
.senki-combat-actions .btn {
  width: 100%;
  margin-bottom: 0.35rem;
}
.senki-combat-actions .btn:last-child {
  margin-bottom: 0;
}
@keyframes senki-screen-enter {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.senki-screen {
  display: none;
  margin-top: 1rem;
}
.senki-screen.is-active {
  display: block;
  animation: senki-screen-enter 0.34s ease-out both;
}
html.senki-prefers-reduced .senki-screen.is-active {
  animation: none;
}
.page-body-isekai-senki .lobby-status-row .lobby-ranking-link + .lobby-ranking-link {
  margin-left: 0.75rem;
}
.senki-msg--hidden {
  display: none;
}
.senki-race-desc {
  font-size: 0.8rem;
  opacity: 0.9;
}
.senki-stage-party {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  margin: 0 0 0.5rem 0;
  min-height: 0;
}
.senki-stage-party-slot {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  max-width: 4.75rem;
  line-height: 1.2;
  border-radius: 6px;
  padding: 0.2rem 0.25rem 0.35rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  border: 1px solid var(--border);
  background: var(--card);
}
.senki-stage-party-thumb-wrap {
  display: block;
  line-height: 0;
  border-radius: 4px;
  overflow: hidden;
  width: 44px;
}
.senki-stage-party-caption {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.12rem;
  width: 100%;
  margin-top: 0.3rem;
  text-align: center;
}
.senki-stage-party-name {
  display: block;
  width: 100%;
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
}
.senki-stage-party-camp {
  display: block;
  width: 100%;
  font-size: 0.62rem;
  color: var(--muted);
  line-height: 1.25;
}
.senki-stage-party-thumb {
  width: 44px;
  display: block;
  aspect-ratio: 213 / 320;
  object-fit: cover;
  vertical-align: top;
}
.senki-stage-party-thumb.senki-card-thumb--placeholder {
  width: 44px;
}
html.senki-prefers-reduced .senki-float-txt {
  transition-duration: 0.06s, 0.06s;
}
.senki-screen-title {
  font-size: 1.15rem;
  font-weight: 600;
  margin: 0 0 0.75rem 0;
  color: var(--text);
}
.senki-lead {
  font-size: 0.9rem;
  color: var(--muted);
  line-height: 1.55;
  margin: 0 0 1rem 0;
}
.senki-stage-result-hint {
  margin-top: 0.65rem;
}
.senki-race-grid,
.senki-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 0.6rem;
  margin-bottom: 1rem;
}
.senki-race-btn,
.senki-card-pick {
  text-align: left;
  padding: 0.65rem 0.75rem;
  border-radius: 8px;
  border: 2px solid var(--border);
  background: var(--card);
  color: var(--text);
  cursor: pointer;
  font-family: inherit;
  font-size: 0.9rem;
}
.senki-race-btn:hover,
.senki-card-pick:hover {
  border-color: var(--accent);
}
.senki-race-btn.is-selected,
.senki-card-pick.is-selected {
  border-color: var(--accent);
  background: #eef1f9;
  font-weight: 600;
}
/* 種族選択: 横4面スプライト（1列=元画像幅の1/4。aspect-ratio と max-height を併用しない＝縦潰れ防止） */
.senki-race-btn {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.35rem;
}
.senki-race-portrait-strip {
  display: block;
  flex-shrink: 0;
  align-self: center;
  width: 118px;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
  aspect-ratio: 256 / 683;
  background-repeat: no-repeat;
  background-size: 400% 100%;
  background-color: #fff;
  border-radius: 8px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}
.senki-race-btn-portrait {
  pointer-events: none;
}
.senki-race-variant-wrap {
  margin-bottom: 1rem;
}
.senki-race-variant-lead {
  margin-bottom: 0.5rem;
}
.senki-race-variant-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.45rem;
  max-width: 520px;
}
.senki-race-variant-btn {
  padding: 0.25rem;
  border-radius: 8px;
  border: 2px solid var(--border);
  background: var(--card);
  cursor: pointer;
  font: inherit;
  line-height: 0;
  min-width: 0;
}
.senki-race-variant-btn:hover {
  border-color: var(--accent);
}
.senki-race-variant-btn.is-selected {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent);
}
.senki-race-variant-preview {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
  aspect-ratio: 256 / 683;
  margin: 0;
}
.senki-combat-party-with-hero {
  flex-wrap: wrap;
  align-items: flex-end;
}
.senki-combat-hero-slot {
  display: inline-block;
  line-height: 0;
  border-radius: 7px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
  border: 1px solid rgba(0, 0, 0, 0.1);
}
.senki-combat-hero-portrait {
  flex-shrink: 0;
  display: block;
  width: 60px;
  max-width: 60px;
  height: auto;
  aspect-ratio: 256 / 683;
  margin: 0;
  border-radius: 0;
  border: none;
  box-shadow: none;
}
.senki-card-pick-inner {
  display: flex;
  gap: 0.55rem;
  align-items: flex-start;
  text-align: left;
}
.senki-card-thumb-frame {
  flex-shrink: 0;
  line-height: 0;
  border-radius: 7px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.14);
  border: 1px solid rgba(0, 0, 0, 0.08);
}
.senki-card-thumb {
  width: 62px;
  height: auto;
  display: block;
  aspect-ratio: 213 / 320;
  object-fit: cover;
  vertical-align: top;
}
.senki-card-thumb--placeholder {
  width: 62px;
  box-sizing: border-box;
  background: linear-gradient(155deg, #ececf2 0%, #d8dae6 100%);
  border: 1px dashed var(--border);
}
.senki-card-pick-meta {
  flex: 1;
  min-width: 0;
  font-size: 0.88rem;
  line-height: 1.35;
}
.senki-card-pick-id {
  font-weight: 600;
}
.senki-card-pick-sub {
  font-size: 0.75rem;
  color: var(--muted);
}
.senki-canvas-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  margin: 0.5rem 0 1rem 0;
  width: 100%;
  box-sizing: border-box;
  min-height: clamp(200px, 52vmin, 560px);
}
.senki-map-viewport {
  position: relative;
  display: inline-block;
  line-height: 0;
  max-width: 100%;
  vertical-align: top;
  border-radius: 8px;
  overflow: hidden;
}
/* G 目安：キャンバス枠内の端からはみ出さないよう % と max で抑える */
.senki-map-viewport .senki-compass {
  position: absolute;
  z-index: 3;
  box-sizing: border-box;
  top: 3%;
  right: 3%;
  left: auto;
  bottom: auto;
  margin: 0;
  max-width: min(26%, 6.75rem);
  width: max-content;
  max-height: 42%;
  min-width: 0;
  overflow: hidden;
  padding: clamp(0.18rem, 1vmin, 0.34rem) clamp(0.24rem, 1.2vmin, 0.4rem)
    clamp(0.22rem, 1.1vmin, 0.36rem);
  border-radius: 7px;
  border: 1px solid rgba(0, 0, 0, 0.35);
  background: rgba(12, 12, 18, 0.94);
  color: var(--text);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  pointer-events: none;
  user-select: none;
}
.senki-map-viewport .senki-compass.senki-compass--corner-tl {
  top: 3%;
  left: 3%;
  right: auto;
  bottom: auto;
}
.senki-map-viewport .senki-compass.senki-compass--corner-br {
  bottom: 3%;
  right: 3%;
  top: auto;
  left: auto;
}
.senki-map-viewport .senki-compass.senki-compass--corner-bl {
  bottom: 3%;
  left: 3%;
  top: auto;
  right: auto;
}
.senki-compass-caption {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--muted);
  text-align: center;
  margin-bottom: 0.2rem;
  line-height: 1.2;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.75);
}
.senki-compass-cross {
  display: grid;
  grid-template-columns: 1.65em 1.65em 1.65em;
  grid-template-rows: 1.65em 1.65em 1.65em;
  gap: 2px;
  align-items: center;
  justify-items: center;
}
.senki-compass-placeholder {
  width: 1.65em;
  height: 1.65em;
  visibility: hidden;
}
.senki-compass-dir {
  width: 1.65em;
  height: 1.65em;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1;
  border-radius: 5px;
  color: var(--muted);
  opacity: 0.65;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.85);
}
.senki-compass-dir.is-active {
  opacity: 1;
  color: #fef9c3;
  background: rgba(250, 204, 21, 0.42);
  box-shadow: inset 0 0 0 1px rgba(250, 204, 21, 0.55);
  text-shadow: 0 0 4px rgba(0, 0, 0, 0.9), 0 1px 2px #000;
}
.senki-compass-dir--center.is-active {
  color: #86efac;
  background: rgba(74, 222, 128, 0.38);
  box-shadow: inset 0 0 0 1px rgba(74, 222, 128, 0.55);
  text-shadow: 0 0 4px rgba(0, 0, 0, 0.9), 0 1px 2px #000;
}
.senki-summon-fab {
  display: block;
  width: 100%;
  margin-top: 0.35rem;
  padding: 0.28rem 0.3rem;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  border-radius: 6px;
  border: 1px solid rgba(196, 181, 253, 0.55);
  background: rgba(79, 70, 229, 0.45);
  color: #eef2ff;
  cursor: pointer;
  line-height: 1.2;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.75);
  /* 親 .senki-compass が pointer-events:none のため、クリックを子で受け取る */
  pointer-events: auto;
  position: relative;
  z-index: 2;
}
/* display:block が [hidden] の非表示を潰すため、条件付き表示は必ず隠す */
.senki-summon-fab[hidden] {
  display: none !important;
  pointer-events: none;
}
.senki-summon-fab:hover {
  background: rgba(99, 102, 241, 0.55);
}
.senki-summon-overlay {
  position: fixed;
  inset: 0;
  z-index: 12050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: rgba(3, 3, 8, 0.72);
  box-sizing: border-box;
}
.senki-summon-overlay[aria-hidden="true"] {
  display: none;
}
.senki-summon-card {
  max-width: 22rem;
  width: 100%;
  padding: 1rem 1.1rem;
  border-radius: 12px;
  background: var(--card, #1a1a22);
  border: 1px solid var(--border, #333);
  color: var(--text, #f4f4f8);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}
.senki-summon-title {
  margin: 0 0 0.5rem;
  font-size: 1.05rem;
}
.senki-summon-lead {
  margin: 0 0 0.75rem;
  font-size: 0.85rem;
  color: var(--muted, #a1a1aa);
  line-height: 1.45;
}
.senki-summon-label {
  display: block;
  font-size: 0.78rem;
  margin-bottom: 0.35rem;
}
.senki-summon-select {
  width: 100%;
  max-height: 12rem;
  font-size: 0.8rem;
  margin-bottom: 0.5rem;
}
.senki-summon-result {
  margin: 0.5rem 0;
  padding: 0.65rem 0.75rem;
  border-radius: 8px;
  background: rgba(99, 102, 241, 0.12);
  border: 1px solid rgba(129, 140, 248, 0.35);
  font-size: 0.82rem;
  line-height: 1.45;
}
.senki-summon-result.is-reveal {
  animation: senki-summon-reveal 0.75s ease-out;
}
@keyframes senki-summon-reveal {
  from {
    opacity: 0;
    transform: scale(0.94);
  }
  55% {
    opacity: 1;
    transform: scale(1.02);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
.senki-summon-result-caption {
  margin: 0 0 0.4rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: #c7d2fe;
}
.senki-summon-result-face {
  display: flex;
  justify-content: center;
  margin: 0.25rem 0 0.35rem;
}
.senki-summon-result-thumb {
  width: 4.25rem;
  height: auto;
  border-radius: 6px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
}
.senki-summon-result-name {
  margin: 0.15rem 0 0.25rem;
  text-align: center;
  font-size: 0.88rem;
}
.senki-summon-result-blurb,
.senki-summon-result-meta {
  margin: 0.2rem 0 0;
  font-size: 0.78rem;
  color: var(--muted, #a1a1aa);
}
.senki-summon-abilities-wrap {
  margin: 0.55rem 0 0;
  padding-top: 0.45rem;
  border-top: 1px solid rgba(129, 140, 248, 0.25);
}
.senki-summon-abilities-title {
  margin: 0 0 0.35rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #e0e7ff;
}
.senki-summon-abilities {
  margin: 0;
  padding-left: 1.1rem;
  font-size: 0.76rem;
  color: var(--muted, #a1a1aa);
  line-height: 1.5;
}
.senki-summon-abilities li {
  margin: 0.25rem 0 0;
}
.senki-summon-abilities li:first-child {
  margin-top: 0;
}
.senki-summon-abilities strong {
  color: var(--text, #f4f4f8);
  font-weight: 600;
}
.senki-summon-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 0.65rem;
}
#senki-fs-target:fullscreen .senki-compass,
#senki-fs-target:-webkit-full-screen .senki-compass,
#senki-fs-target:-moz-full-screen .senki-compass,
#senki-fs-target:-ms-fullscreen .senki-compass,
#senki-fs-target.senki-fs-active .senki-compass {
  background: rgba(6, 6, 10, 0.94);
  border-color: rgba(255, 255, 255, 0.28);
  color: #f4f4f8;
}
#senki-fs-target:fullscreen .senki-compass-caption,
#senki-fs-target:-webkit-full-screen .senki-compass-caption,
#senki-fs-target:-moz-full-screen .senki-compass-caption,
#senki-fs-target:-ms-fullscreen .senki-compass-caption,
#senki-fs-target.senki-fs-active .senki-compass-caption {
  color: rgba(255, 255, 255, 0.72) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.72);
}
#senki-fs-target:fullscreen .senki-compass-dir,
#senki-fs-target:-webkit-full-screen .senki-compass-dir,
#senki-fs-target:-moz-full-screen .senki-compass-dir,
#senki-fs-target:-ms-fullscreen .senki-compass-dir,
#senki-fs-target.senki-fs-active .senki-compass-dir {
  color: rgba(255, 255, 255, 0.45);
}
.senki-map-viewport.senki-map-shake {
  animation: senki-map-shake 0.28s ease;
}
html.senki-prefers-reduced .senki-map-viewport.senki-map-shake {
  animation: none;
}
@keyframes senki-map-shake {
  0%,
  100% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-5px);
  }
  75% {
    transform: translateX(5px);
  }
}
.senki-float-txt {
  position: absolute;
  left: 50%;
  top: 38%;
  transform: translate(-50%, 0);
  font-size: 1.35rem;
  font-weight: 700;
  color: #facc15;
  text-shadow: 0 0 6px rgba(0, 0, 0, 0.85), 0 1px 2px #000;
  opacity: 0;
  pointer-events: none;
  /* コンパス・召喚ボタン（z-index:3）より手前に出し、演出が隠れないようにする */
  z-index: 8;
  transition: opacity 0.2s ease, transform 0.35s ease;
  white-space: nowrap;
}
.senki-float-txt.is-on {
  opacity: 1;
  transform: translate(-50%, -18px);
}
.senki-float-txt.senki-float-ok {
  color: #86efac;
}
.senki-canvas-wrap canvas {
  border: 2px solid var(--border);
  border-radius: 8px;
  background: #1a1a22;
  touch-action: none;
  max-width: 100%;
  height: auto;
}
.senki-hud {
  font-size: 0.9rem;
  color: var(--text);
  margin-bottom: 0.5rem;
}
.senki-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.75rem;
}
.senki-actions.senki-ending-btns {
  flex-direction: column;
  align-items: stretch;
}
.senki-actions.senki-ending-btns .senki-ending-choice {
  margin-bottom: 0.35rem;
}
.senki-actions.senki-ending-btns .senki-ending-choice:last-child {
  margin-bottom: 0;
}
.senki-msg {
  padding: 0.75rem;
  border-radius: 8px;
  background: var(--bg);
  border: 1px solid var(--border);
  font-size: 0.9rem;
  margin-top: 0.75rem;
}
.senki-msg.is-error {
  border-color: #b91c1c;
  color: #7f1d1d;
}
.senki-msg.is-ok {
  border-color: #15803d;
  color: #14532d;
}
.senki-codex-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 0.65rem;
  font-size: 0.85rem;
}
.senki-codex-item {
  padding: 0.5rem 0.65rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg);
}
.senki-codex-inner {
  display: flex;
  gap: 0.65rem;
  align-items: flex-start;
}
.senki-codex-thumb-frame {
  flex-shrink: 0;
  line-height: 0;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.12);
  border: 1px solid var(--border);
}
.senki-codex-thumb {
  width: 78px;
  height: auto;
  display: block;
  aspect-ratio: 213 / 320;
  object-fit: cover;
}
.senki-codex-thumb.senki-card-thumb--placeholder {
  width: 78px;
}
.senki-codex-text {
  flex: 1;
  min-width: 0;
  font-size: 0.88rem;
  line-height: 1.4;
}
.senki-codex-meta {
  color: var(--muted);
  font-size: 0.85rem;
}
.senki-codex-maze {
  display: block;
  margin-top: 0.35rem;
  font-size: 0.8rem;
  color: var(--muted);
  line-height: 1.35;
}
.senki-final-links {
  margin-top: 0.25rem;
}
.senki-final-links-sep {
  color: var(--muted);
}
.senki-settings-block {
  margin-top: 0.75rem;
  font-size: 0.9rem;
}
.senki-settings-block label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
  cursor: pointer;
}

.senki-dpad.senki-dpad--mobile-only {
  display: none;
}
@media (max-width: 768px), (pointer: coarse) {
  .senki-dpad.senki-dpad--mobile-only {
    display: flex;
  }
}
.senki-dpad {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  margin: 0.75rem 0 0.5rem 0;
  user-select: none;
}
.senki-dpad-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
}
.senki-dpad-spacer {
  width: 48px;
  height: 44px;
  flex-shrink: 0;
}
.senki-dpad-spacer.senki-dpad-center {
  width: auto;
  min-width: 3rem;
  height: auto;
  font-size: 0.75rem;
  color: var(--muted);
  text-align: center;
  line-height: 1.2;
}
.senki-dpad-btn {
  min-width: 48px;
  min-height: 44px;
  padding: 0.35rem 0.5rem;
  font-size: 1.1rem;
}
.senki-stage-toolbar {
  justify-content: center;
  margin-top: 0.25rem;
  margin-bottom: 0.15rem;
}
.senki-help-overlay {
  display: none;
  position: absolute;
  inset: 0;
  z-index: 35;
  box-sizing: border-box;
  background: rgba(12, 12, 18, 0.82);
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.senki-help-overlay.is-open {
  display: flex;
}
.senki-help-card {
  max-width: 24rem;
  width: 100%;
  max-height: min(85vh, 32rem);
  overflow-y: auto;
  padding: 1rem 1.1rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
}
.senki-help-title {
  margin: 0 0 0.65rem 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text);
}
.senki-help-list {
  margin: 0 0 0.75rem 0;
  padding-left: 1.15rem;
  font-size: 0.88rem;
  line-height: 1.55;
  color: var(--text);
}
.senki-help-list li {
  margin-bottom: 0.4rem;
}
.senki-result-breakdown {
  margin: 0.5rem 0 1rem 0;
  padding: 0.65rem 0.75rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.senki-result-breakdown-inner {
  margin: 0;
}
.senki-result-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.5rem 0.75rem;
  align-items: baseline;
  font-size: 0.88rem;
  padding: 0.25rem 0;
  border-bottom: 1px solid var(--border);
}
.senki-result-row:last-child {
  border-bottom: none;
}
.senki-result-row dt {
  margin: 0;
  font-weight: 500;
  color: var(--text);
}
.senki-result-row dd {
  margin: 0;
  font-variant-numeric: tabular-nums;
  text-align: right;
  color: var(--text);
}
.senki-result-row--total dt,
.senki-result-row--total dd {
  font-weight: 700;
  padding-top: 0.35rem;
  margin-top: 0.15rem;
  border-top: 1px dashed var(--border);
}
.senki-card-affiliation,
.senki-codex-camp {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.72rem;
  color: var(--muted);
  line-height: 1.3;
}

/* 異世界戦記: メイン下部・音楽素材クレジット（右寄せ） */
.senki-audio-credit {
  text-align: right;
  margin-top: 1.75rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--border);
  font-size: inherit;
  line-height: 1.55;
  color: var(--muted);
  max-width: 100%;
}
.senki-audio-credit__lead,
.senki-audio-credit__line {
  margin: 0 0 0.35rem 0;
}
.senki-audio-credit__line:last-child {
  margin-bottom: 0;
}
.senki-audio-credit a {
  color: var(--accent);
  text-decoration: underline;
}
.senki-audio-credit a:hover {
  text-decoration: none;
}