/* ================================================
   管理画面専用スタイル — モダンダークUIリデザイン
   ================================================ */

/* --- レイアウト: サイドバー + コンテンツ --- */
.admin-wrap {
  display: flex;
  min-height: 100vh;
}

/* --- サイドバー --- */
.admin-sidebar {
  width: 220px;
  background: #111827;
  border-right: 1px solid #1f2937;
  display: flex;
  flex-direction: column;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  z-index: 100;
}
.admin-sidebar-brand {
  padding: 1.2rem 1rem;
  border-bottom: 1px solid #1f2937;
}
.admin-sidebar-brand a {
  color: #f9fafb !important;
  font-size: 1.05rem;
  font-weight: 700;
  text-decoration: none !important;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.admin-sidebar-brand .brand-icon {
  font-size: 1.3rem;
}
.admin-sidebar-nav {
  flex: 1;
  padding: 0.8rem 0;
  overflow-y: auto;
}
.admin-sidebar-nav a {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.55rem 1.2rem;
  color: #9ca3af !important;
  text-decoration: none !important;
  font-size: 0.88rem;
  transition: background 0.15s, color 0.15s;
  border-left: 3px solid transparent;
}
.admin-sidebar-nav a:hover {
  background: #1f2937;
  color: #e5e7eb !important;
}
.admin-sidebar-nav a.active {
  background: #1e293b;
  color: #60a5fa !important;
  border-left-color: #3b82f6;
  font-weight: 600;
}
.admin-sidebar-nav .nav-icon {
  font-size: 1rem;
  width: 1.4rem;
  text-align: center;
}
.admin-sidebar-nav .nav-divider {
  height: 1px;
  background: #1f2937;
  margin: 0.5rem 1rem;
}
.admin-sidebar-user {
  padding: 0.8rem 1rem;
  border-top: 1px solid #1f2937;
  font-size: 0.82rem;
  color: #6b7280;
}
.admin-sidebar-user .user-name {
  color: #d1d5db;
  font-weight: 600;
}
.admin-sidebar-user .user-role {
  font-size: 0.75rem;
  color: #6b7280;
  background: #1f2937;
  padding: 1px 6px;
  border-radius: 3px;
  margin-left: 4px;
}

/* --- メインコンテンツ --- */
.admin-content {
  flex: 1;
  margin-left: 220px;
  padding: 1.5rem 2rem 2rem;
  background: #0f172a;
  min-height: 100vh;
}

/* --- ページヘッダー --- */
.admin-page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #1e293b;
}
.admin-page-header h2 {
  font-size: 1.4rem;
  font-weight: 700;
  color: #f1f5f9;
  margin: 0;
}
.admin-page-header .breadcrumb {
  font-size: 0.82rem;
  color: #64748b;
}
.admin-page-header .breadcrumb a {
  color: #60a5fa !important;
}

/* --- カード --- */
.admin-card {
  background: #1e293b;
  border: 1px solid #334155;
  border-radius: 10px;
  padding: 1.2rem 1.5rem;
  margin-bottom: 1.2rem;
}
.admin-card h3 {
  font-size: 1rem;
  font-weight: 600;
  color: #e2e8f0;
  margin: 0 0 1rem;
  padding-bottom: 0.6rem;
  border-bottom: 1px solid #334155;
}

/* --- 統計カード (ダッシュボード) --- */
.admin-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.stat-card {
  background: #1e293b;
  border: 1px solid #334155;
  border-radius: 10px;
  padding: 1.2rem;
  transition: transform 0.15s, box-shadow 0.15s;
}
.stat-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}
.stat-label {
  font-size: 0.78rem;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 0.3rem;
}
.stat-value {
  font-size: 1.8rem;
  font-weight: 700;
  color: #f1f5f9;
}
.stat-card.stat-users .stat-value { color: #60a5fa; }
.stat-card.stat-villages .stat-value { color: #34d399; }
.stat-card.stat-active .stat-value { color: #fbbf24; }
.stat-card.stat-bans .stat-value { color: #f87171; }
.stat-card.stat-reports .stat-value { color: #c084fc; }
a.stat-card-link { text-decoration: none; color: inherit; cursor: pointer; }
a.stat-card-link:hover { transform: translateY(-3px); box-shadow: 0 6px 16px rgba(0,0,0,0.4); border-color: #fbbf24; }
a.stat-card-link:visited { color: inherit; }

/* --- クイックリンク --- */
.admin-quicklinks {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-bottom: 1.5rem;
}
.admin-quicklinks a {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.5rem 1rem;
  background: #334155;
  color: #e2e8f0 !important;
  border-radius: 6px;
  font-size: 0.85rem;
  text-decoration: none !important;
  transition: background 0.15s;
}
.admin-quicklinks a:hover {
  background: #475569;
}

/* --- テーブル --- */
.admin-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.88rem;
}
.admin-table thead th {
  background: #0f172a;
  color: #94a3b8;
  font-weight: 600;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 0.7rem 0.8rem;
  border-bottom: 2px solid #334155;
  text-align: left;
  position: sticky;
  top: 0;
}
.admin-table tbody td {
  padding: 0.65rem 0.8rem;
  border-bottom: 1px solid #1e293b;
  color: #cbd5e1;
}
.admin-table tbody tr {
  transition: background 0.1s;
}
.admin-table tbody tr:hover {
  background: #1e293b;
}
.admin-table a {
  color: #60a5fa !important;
  text-decoration: none !important;
}
.admin-table a:hover {
  color: #93c5fd !important;
  text-decoration: underline !important;
}

/* --- バッジ --- */
.adm-badge {
  display: inline-block;
  font-size: 0.72rem;
  padding: 2px 8px;
  border-radius: 10px;
  font-weight: 600;
  letter-spacing: 0.3px;
}
.adm-badge-admin { background: #312e81; color: #a5b4fc; }
.adm-badge-super { background: #7c2d12; color: #fdba74; }
.adm-badge-master { background: #713f12; color: #fde68a; }
.adm-badge-user { background: #1e293b; color: #94a3b8; }
.adm-badge-frozen { background: #1e3a5f; color: #7dd3fc; }
.adm-badge-ban-active { background: #7f1d1d; color: #fca5a5; }
.adm-badge-ban-expired { background: #1e293b; color: #6b7280; }
.adm-badge-warning { background: #78350f; color: #fde68a; }
.adm-badge-success { background: #064e3b; color: #6ee7b7; }
.adm-badge-handled { background: #1e293b; color: #6b7280; }
.adm-badge-pending { background: #7c2d12; color: #fdba74; }

/* --- 検索バー --- */
.admin-search {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  margin-bottom: 1rem;
}
.admin-search input[type="text"],
.admin-search select {
  background: #0f172a;
  color: #e2e8f0;
  border: 1px solid #334155;
  border-radius: 6px;
  padding: 0.5rem 0.8rem;
  font-size: 0.88rem;
  transition: border-color 0.2s;
}
.admin-search input[type="text"]:focus,
.admin-search select:focus {
  border-color: #3b82f6;
  outline: none;
  box-shadow: 0 0 0 2px rgba(59,130,246,0.2);
}
.admin-search input[type="submit"] {
  background: #3b82f6;
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 0.5rem 1.2rem;
  font-size: 0.88rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s;
}
.admin-search input[type="submit"]:hover {
  background: #2563eb;
}

/* --- ボタン --- */
.admin-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.4rem 0.9rem;
  border: none;
  border-radius: 6px;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s, transform 0.1s;
  text-decoration: none !important;
}
.admin-btn:active { transform: scale(0.97); }
.admin-btn-primary { background: #3b82f6; color: #fff !important; }
.admin-btn-primary:hover { background: #2563eb; }
.admin-btn-danger { background: #dc2626; color: #fff !important; }
.admin-btn-danger:hover { background: #b91c1c; }
.admin-btn-success { background: #059669; color: #fff !important; }
.admin-btn-success:hover { background: #047857; }
.admin-btn-warning { background: #d97706; color: #fff !important; }
.admin-btn-warning:hover { background: #b45309; }
.admin-btn-ghost { background: #334155; color: #e2e8f0 !important; }
.admin-btn-ghost:hover { background: #475569; }
.admin-btn-sm { padding: 0.3rem 0.6rem; font-size: 0.78rem; }

/* --- アクションバー --- */
.admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 1rem 0;
}
.admin-actions form { display: inline; }
.admin-actions select.admin-role-select {
  background: #0f172a;
  color: #e2e8f0;
  border: 1px solid #334155;
  border-radius: 6px;
  padding: 0.3rem 0.6rem;
  font-size: 0.82rem;
}
.admin-actions button,
.admin-actions input[type="submit"] {
  padding: 0.4rem 0.9rem;
  border: none;
  border-radius: 6px;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s;
}

/* --- 定義リスト (詳細ページ) --- */
.admin-dl {
  display: grid;
  grid-template-columns: 8rem 1fr;
  gap: 0.5rem 1rem;
  margin-bottom: 1rem;
}
.admin-dl dt {
  color: #94a3b8;
  font-size: 0.85rem;
  font-weight: 600;
}
.admin-dl dd {
  color: #e2e8f0;
  margin: 0;
}

/* --- フォーム --- */
.admin-form .form-group {
  margin-bottom: 1rem;
}
.admin-form label {
  display: block;
  color: #94a3b8;
  font-size: 0.85rem;
  font-weight: 600;
  margin-bottom: 0.3rem;
}
.admin-form input[type="text"],
.admin-form input[type="email"],
.admin-form input[type="url"],
.admin-form input[type="number"],
.admin-form textarea,
.admin-form select {
  background: #0f172a;
  color: #e2e8f0;
  border: 1px solid #334155;
  border-radius: 6px;
  padding: 0.5rem 0.8rem;
  font-size: 0.9rem;
  width: 100%;
  max-width: 500px;
  box-sizing: border-box;
  transition: border-color 0.2s;
}
.admin-form input:focus,
.admin-form textarea:focus,
.admin-form select:focus {
  border-color: #3b82f6;
  outline: none;
  box-shadow: 0 0 0 2px rgba(59,130,246,0.2);
}
.admin-form .hint {
  font-size: 0.78rem;
  color: #64748b;
  margin-top: 0.2rem;
}
.admin-form textarea {
  resize: vertical;
  min-height: 80px;
}

/* --- フラッシュ --- */
.admin-flash {
  padding: 0.7rem 1rem;
  border-radius: 8px;
  margin-bottom: 1rem;
  font-size: 0.88rem;
  font-weight: 500;
}
.admin-flash-notice { background: #064e3b; color: #6ee7b7; border: 1px solid #065f46; }
.admin-flash-alert { background: #7f1d1d; color: #fca5a5; border: 1px solid #991b1b; }

/* --- プリフォーマットテキスト --- */
.admin-pre {
  background: #0f172a;
  color: #cbd5e1;
  border: 1px solid #334155;
  border-radius: 8px;
  padding: 1rem;
  font-size: 0.82rem;
  white-space: pre-wrap;
  max-height: 500px;
  overflow: auto;
  line-height: 1.5;
}

/* --- ページネーション --- */
.admin-content .pagination {
  display: flex;
  gap: 0.3rem;
  margin-top: 1rem;
  flex-wrap: wrap;
}
.admin-content .pagination a,
.admin-content .pagination em,
.admin-content .pagination span {
  padding: 0.35rem 0.7rem;
  border-radius: 4px;
  font-size: 0.82rem;
}
.admin-content .pagination a {
  background: #334155;
  color: #e2e8f0 !important;
  text-decoration: none !important;
}
.admin-content .pagination a:hover { background: #475569; }
.admin-content .pagination em,
.admin-content .pagination .current {
  background: #3b82f6;
  color: #fff;
  font-style: normal;
  font-weight: 600;
}
.admin-content .pagination .disabled {
  color: #475569;
}

/* --- サイドバー ログアウトボタン --- */
.admin-sidebar-logout {
  display: block;
  width: 100%;
  background: none;
  border: none;
  color: #9ca3af !important;
  text-align: left;
  padding: 0.55rem 1.2rem;
  font-size: 0.88rem;
  cursor: pointer;
  border-left: 3px solid transparent;
  transition: background 0.15s, color 0.15s;
}
.admin-sidebar-logout:hover { background: #1f2937; color: #e5e7eb !important; }
.admin-sidebar-nav form { margin: 0; }

/* --- 汎用ヒントテキスト --- */
.admin-card .hint,
.admin-debug .hint {
  font-size: 0.78rem;
  color: #64748b;
  margin-top: 0.2rem;
}

/* --- DEBUGモードセクション --- */
.admin-debug {
  margin-top: 1.5rem;
  padding-top: 1.2rem;
  border-top: 1px solid #334155;
}
.admin-debug-status {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 0.8rem;
  border-radius: 6px;
  font-weight: 600;
  font-size: 0.88rem;
}
.admin-debug-on { background: #422006; color: #fde68a; }
.admin-debug-off { background: #1e293b; color: #94a3b8; }

/* --- 通報: 処理済み行 --- */
.admin-table tr.row-handled { opacity: 0.5; }

/* --- レスポンシブ --- */
@media (max-width: 900px) {
  .admin-sidebar {
    position: static;
    width: 100%;
    border-right: none;
    border-bottom: 1px solid #1f2937;
  }
  .admin-sidebar-nav {
    display: flex;
    flex-wrap: wrap;
    padding: 0.5rem;
    gap: 0;
  }
  .admin-sidebar-nav a {
    border-left: none;
    border-bottom: 2px solid transparent;
    padding: 0.4rem 0.8rem;
    font-size: 0.82rem;
  }
  .admin-sidebar-nav a.active {
    border-bottom-color: #3b82f6;
    border-left-color: transparent;
  }
  .admin-sidebar-nav .nav-divider { display: none; }
  .admin-wrap { flex-direction: column; }
  .admin-content { margin-left: 0; padding: 1rem; }
  .admin-stats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .admin-stats { grid-template-columns: 1fr; }
  .admin-dl { grid-template-columns: 6rem 1fr; }
  .admin-table { font-size: 0.82rem; }
  .admin-table thead th,
  .admin-table tbody td { padding: 0.45rem 0.5rem; }
}
/* === ゲーム盤面 === */
.game-board { margin-top: 0; background: transparent; color: #ddd; padding: 0; border-radius: 0; overflow: clip; }
.game-board h3 { margin-top: 0; color: #e5e7eb; font-size: 1.05rem; background: #12161f; border: 1px solid #222838; padding: 10px 14px; border-radius: 6px; max-width: 100%; box-sizing: border-box; }
.game-board h3 .badge-epilogue { display: inline-block; padding: 2px 10px; background: #1a2a3a; color: #60a5fa; border-radius: 12px; font-size: 0.78rem; font-weight: 600; border: 1px solid #2a4060; margin-left: 8px; }
.game-board h4 { color: #ddd; margin: 0.2rem 0 0.4rem; max-width: 100%; box-sizing: border-box; }
.game-board small { color: #9ca3af; font-weight: normal; font-size: 0.82rem; }
/* game-layout: 旧版準拠 左サイドバー(参加者) + 右メイン(発言ログ) */
.msg-list { list-style: none; padding: 0; margin: 0; overflow-y: auto; background: transparent; color: #ddd; border: 0; border-radius: 0; }
.msg { display: flex; gap: 0.5rem; padding: 0.4rem 0.6rem; border-bottom: 1px solid #eee; }
.msg:last-child { border-bottom: none; }
.msg-face { width: 40px; height: 40px; object-fit: contain; background: #f4f4f4; border: 1px solid #ddd; border-radius: 3px; flex-shrink: 0; }
.msg-body { flex: 1; min-width: 0; }
.msg-meta { font-size: 0.82rem; color: #555; margin-bottom: 0.2rem; }
.msg-day  { display: inline-block; padding: 0 0.3rem; background: #34495e; color: #ffeaa7; border-radius: 2px; margin-right: 0.3rem; font-size: 0.75rem; }
.msg-kind { color: #2980b9; font-weight: bold; margin-right: 0.3rem; }
.msg-content { white-space: pre-wrap; word-break: break-word; }
.msg-say     { background: #fff; }
.msg-whisper { background: #ffe0e0; }
.msg-whisper .msg-kind { color: #c0392b; }
.msg-think   { background: #f0f0f0; color: #555; font-style: italic; }
.msg-groan   { background: #d6dbe0; color: #2c3e50; }
.msg-memo    { background: #fff7cc; }
.msg-system  { background: #2c3e50; color: #ffeaa7; text-align: center; font-weight: bold; }
.msg-system .msg-kind { color: #f39c12; }
.msg-result  { background: #e8f8e8; }

.msg-form { margin-top: 0.6rem; }
/* 旧版msg.html準拠: 発言フォーム＝アイコン＋吹き出し */
.action-box { display: flex; gap: 0; align-items: center; margin: 20px 0; width: 540px; max-width: 100%; box-sizing: border-box; }
.action-box-icon { flex-shrink: 0; text-align: center; }
.action-box-icon img { display: block; margin: 0 auto; }
/* 吹き出し: 旧版action_balloon準拠 — 白背景+角丸+CSS三角しっぽ */
.action-box-balloon { flex: 1; min-width: 0; background: #fff; margin-left: 12px; border-radius: 6px; position: relative; }
.action-box-balloon::before {
  content: '';
  position: absolute;
  left: -8px;
  top: 50%;
  transform: translateY(-50%);
  border: 8px solid transparent;
  border-right-color: #fff;
  border-left: 0;
}
.balloon-header {
  padding: 4px 8px;
  color: #000;
  font-size: 0.9rem;
  border-bottom: 1px solid #ccc;
}
/* 吹き出し内のフォーム行: 旧版 action_body 準拠 */
.balloon-row { padding: 2px 8px 4px; color: #000; }
.balloon-row textarea { width: 100%; box-sizing: border-box; margin: 2px 0; }
.balloon-controls { padding: 2px 0; display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.balloon-controls select { background: #eee; color: #000; border: 1px solid #999; border-radius: 3px; padding: 1px 4px; font-size: 0.85rem; }
.msg-form { margin: 0; }
.msg-form + .msg-form .balloon-row { border-top: 1px solid #eee; }
/* 旧版準拠: msg-form-row / msg-form-controls / msg-form-buttons */
.msg-form-row { padding: 2px 8px 4px; color: #000; }
.msg-form-row textarea { width: 100%; box-sizing: border-box; margin: 2px 0; }
.msg-form-controls { padding: 2px 0; display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.msg-form-buttons { padding: 4px 0 2px; display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
/* 独立action-box間のスペース */
.action-box + .action-box { margin-top: 8px; }
/* 吹き出しカラーバリエーション: 旧版textarea背景色から吹き出し全体の背景に反映 */
.balloon-whisper { background: #fcc; }
.balloon-whisper::before { border-right-color: #fcc; }
.balloon-telepathy { background: #a69abd; }
.balloon-telepathy::before { border-right-color: #a69abd; }
.balloon-sympathy { background: #8FBC8F; }
.balloon-sympathy::before { border-right-color: #8FBC8F; }
.balloon-flirt { background: #FFE4E1; }
.balloon-flirt::before { border-right-color: #FFE4E1; }
.balloon-scream { background: #BDB76B; }
.balloon-scream::before { border-right-color: #BDB76B; }
.balloon-secret { background: #6e4a55; color: #fff; }
.balloon-secret::before { border-right-color: #6e4a55; }
.balloon-secret .balloon-controls { color: #fff; }
.balloon-secret .balloon-controls select { background: #8b6b76; color: #fff; border-color: #9a7a85; }
.balloon-testament { background: #dcdddd; }
.balloon-testament::before { border-right-color: #dcdddd; }
.balloon-dolls { background: #e8d4f0; }
.balloon-dolls::before { border-right-color: #e8d4f0; }
/* 吹き出しカラー: 旧版準拠 — 吹き出し全体は白、textareaの色で種類を区別 */
.voice-option { font-size: 0.85rem; white-space: nowrap; color: #000; }
/* アクション入力行（旧版msg.html準拠: name + postpos + target + text） */
.action-sub-form { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; padding: 4px 0; }
.action-sub-form select { padding: 0.2rem; background: #eee; color: #000; border: 1px solid #999; border-radius: 3px; font-size: 0.85rem; }
.action-sub-form input[type="text"] { flex: 1; min-width: 120px; padding: 0.3rem; border: 1px solid #999; border-radius: 3px; font-family: inherit; background: #fff; color: #000; box-sizing: border-box; }
.action-sub-form .action-player-name { font-weight: bold; font-size: 0.85rem; }

.vote-grid { display: flex; flex-direction: column; gap: 0.3rem; }
.vote-btn { text-align: left; background: #34495e; color: #fff; border: 1px solid #4a6075; padding: 0.4rem 0.6rem; border-radius: 3px; cursor: pointer; }
.vote-btn:hover { background: #4a6075; }
.vote-btn.vote-current { background: #f39c12; border-color: #d35400; font-weight: bold; }
.vote-grid form { margin: 0; display: block; }
.vote-grid form input[type=submit] { width: 100%; }

.my-role { background: #34495e; padding: 0.6rem; border-radius: 4px; margin-bottom: 0.8rem; border: 1px solid #4a6075; clear: both; position: relative; z-index: 1; margin-top: 1rem; overflow: hidden; }
.my-role h4 { margin: 0 0 0.4rem; width: auto !important; box-sizing: border-box; }
.my-role-body { display: flex; gap: 0.6rem; align-items: flex-start; }
.my-role-body img { background: #fff; border-radius: 4px; border: 1px solid #ddd; flex-shrink: 0; }
.role-badge { display: inline-block; padding: 0.1rem 0.5rem; border-radius: 3px; font-weight: bold; font-size: 0.9rem; }
.role-villager { background: #ecf0f1; color: #2c3e50; }
.role-wolf     { background: #c0392b; color: #fff; }
.role-fortune  { background: #8e44ad; color: #fff; }
.role-guard    { background: #16a085; color: #fff; }
.role-medium   { background: #2980b9; color: #fff; }
.role-madman   { background: #e67e22; color: #fff; }
.role-fox      { background: #d35400; color: #fff; }
.role-twin     { background: #27ae60; color: #fff; }
.role-tough    { background: #7f8c8d; color: #fff; }
.role-cupid    { background: #e91e63; color: #fff; }
.role-psychic  { background: #3498db; color: #fff; }
.wolf-mates { font-size: 0.85rem; color: #ffcccc; margin-top: 0.2rem; }
.night-idle { color: #bdc3c7; font-style: italic; }


/* doc page */
.doc-toc { background: #1a1e2e; padding: 0.8rem; border-radius: 6px; margin-bottom: 1rem; border: 1px solid #2a3040; }
.doc-toc ul.toc-list { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; list-style: none; padding: 0.3rem 0; }
.doc-toc-section { margin-bottom: 10px; }
.doc-toc-section:last-child { margin-bottom: 0; }
.doc-toc-links { display: flex; flex-wrap: wrap; gap: 4px; }
.doc-toc-link { display: inline-block; background: #252a3a; color: #aab; padding: 3px 8px; border-radius: 4px; font-size: 0.82rem; text-decoration: none; transition: background 0.15s; }
.doc-toc-link:hover { background: #3a3f50; color: #fff; }
.doc-toc-role { color: #f1c40f; }
.doc-toc-sub { color: #a78bfa; }
.role-toc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 0.2rem 0.5rem; font-size: 0.85rem; margin-top: 0.4rem; }
.role-toc-grid a { color: #f1c40f; }
.role-doc-list .role-doc { background: #1a1e2e; padding: 0.8rem; border-radius: 6px; margin-bottom: 0.5rem; border-left: 3px solid #3498db; border: 1px solid #2a3040; }
.role-doc h4 { margin: 0 0 0.3rem; }
.role-flags { font-size: 0.85rem; color: #bdc3c7; }
.role-desc-html { background: #151520; padding: 0.5rem; margin-top: 0.4rem; border-radius: 4px; max-height: 400px; overflow-y: auto; font-size: 0.9rem; }
/* 旧版docコンテンツ表示 */
.legacy-doc-content { font-size: 0.9rem; line-height: 1.8; color: #d0d8e8; }
.legacy-doc-content a { color: #8ab4f8; }
.legacy-doc-content ul { margin: 0.3rem 0; padding-left: 1.5em; }
.legacy-doc-content li { margin-bottom: 0.2rem; }
.legacy-doc-content ol { margin: 0.3rem 0; padding-left: 1.5em; }
.legacy-doc-content .large_doc { font-size: 1.1rem; font-weight: bold; color: #f59e0b; }
.legacy-doc-content .small_voice { font-family: 'MS PGothic', 'ＭＳ Ｐゴシック', 'Osaka−等幅', 'IPAMonaPGothic', 'Mona', monospace; font-size: 12px; line-height: 14px; color: #d0d8e8; white-space: pre; overflow-x: auto; display: block; background: #0c0e14; padding: 10px 12px; border-radius: 6px; margin: 8px 0; border: 1px solid #1e2636; letter-spacing: 0; }
.legacy-doc-content .announce { background: #2a3040; padding: 4px 8px; border-radius: 4px; margin: 4px 0; font-size: 0.85rem; }
.legacy-doc-content .announce.cupid { border-left: 3px solid #ff6b9d; }
.legacy-doc-content .announce.revenge { border-left: 3px solid #ef4444; }
.legacy-doc-content .announce.death { border-left: 3px solid #6b7280; }
.legacy-doc-content strong { color: #f1c40f; }
.badge { display: inline-block; padding: 0.1rem 0.4rem; border-radius: 3px; font-size: 0.75rem; margin-left: 0.3rem; }
.badge-impl { background: #27ae60; color: #fff; }
.badge-legacy { background: #7f8c8d; color: #fff; }
.job-list td code { background: #2c3e50; padding: 0.1rem 0.3rem; border-radius: 3px; font-size: 0.85rem; }
.role-impl { background: rgba(39, 174, 96, 0.08); }
.search-form { margin-bottom: 0.6rem; display: flex; gap: 0.4rem; align-items: center; }
.search-form input, .search-form select { padding: 0.3rem; background: #34495e; color: #fff; border: 1px solid #4a6075; border-radius: 3px; }

.lover-info { margin-top: 0.2rem; color: #ff6b9d; font-size: 0.85rem; }
.role-desc { margin-top: 0.2rem; }

/* capability chips (joblist show) */
.cap-chip {
  display: inline-block;
  margin: 0 0.15rem 0.2rem 0;
  padding: 0.05rem 0.4rem;
  background: #3b556e;
  color: #cfe6ff;
  font-size: 0.78rem;
  border-radius: 10px;
  border: 1px solid #4c6d8a;
}

/* Payload rendering */
dl.kv { display: grid; grid-template-columns: max-content 1fr; gap: 4px 12px; margin: 0.5em 0; }
dl.kv dt { font-weight: bold; color: #bcd; }
dl.kv dd { margin: 0; }
table.kv-table { border-collapse: collapse; width: 100%; margin: 0.5em 0; }
table.kv-table th, table.kv-table td { border: 1px solid #444; padding: 4px 8px; vertical-align: top; }
table.kv-table th { background: #2a2f3a; text-align: left; font-weight: bold; }
table.dialog-list { border-collapse: collapse; width: 100%; margin: 0.5em 0; }
table.dialog-list th, table.dialog-list td { border: 1px solid #333; padding: 6px 10px; vertical-align: top; }
table.dialog-list th { background: #2a2f3a; width: 12em; text-align: left; }
pre.payload-inline { background: #1a1e26; padding: 4px 8px; border-radius: 3px; font-size: 0.85em; margin: 0; }
span.muted, p.muted { color: #789; }

/* 日別タブ + 種別フィルタ（旧版準拠: 同行に表示） */
nav.day-tabs { display: flex; flex-wrap: wrap; gap: 3px; margin: 10px 0 6px; padding: 6px; background: #0c0f16; border: 1px solid #1a1e2a; border-radius: 6px; }
nav.day-tabs .day-tab { padding: 5px 10px; background: #181c28; color: #9ca3af; text-decoration: none; border-radius: 4px; font-size: 0.82rem; border: 1px solid transparent; transition: all 0.12s; }
nav.day-tabs .day-tab.active { background: #3b82f6; color: #fff; font-weight: bold; border-color: #2563eb; }
nav.day-tabs .day-tab:hover { background: #1e2538; color: #e5e7eb; }
.kind-tabs { display: flex; flex-wrap: wrap; gap: 3px; margin: 0 0 8px; }
.kind-tab { padding: 3px 6px; background: #2a2f3a; color: #cdd; text-decoration: none; border-radius: 3px; font-size: 0.82rem; }
.kind-tab.active { background: #4a5566; color: #fff; font-weight: bold; }
.kind-tab:hover { background: #3a4250; }
.day-tab-sep { color: #666; padding: 4px 2px; align-self: center; }

/* メッセージ吹き出し */
.msg-list { display: flex; flex-direction: column; gap: 8px; }
.message { width: 540px; max-width: 100%; border-collapse: collapse; }
@media (max-width: 600px) { .message, .action-box { width: 100%; } }
.message td { padding: 0; }
.message .time { color: #bbb; font-size: 80%; margin-left: 0.4rem; }
.message .mes_number { margin-right: 0.5rem; }
.message .mes_res { display: none; margin-left: 0.3rem; }
.inline-ref-res { margin: 4px 0 8px 22px; padding: 4px 6px; border-left: 2px solid #577; background: transparent; }

/* 吹き出し尻尾: 各タイプbody色で着色した透過PNG（黒→透過、色→不透明）
   旧版仕様: 透過PNG + CSS background-color で着色（say00.jpg/watch00.png等は保持）
   レガシーHTML: <td><div class="mes_say"></div></td>
   新テンプレート: <td class="mes_say"></td> */
.mes_say       { background: transparent url(/data/img/say00.png) no-repeat right center; }
.mes_whisper   { background: transparent url(/data/img/whisper00.png) no-repeat right center; }
.mes_groan     { background: transparent url(/data/img/groan00.png) no-repeat right center; }
.mes_think     { background: transparent url(/data/img/think00.png) no-repeat right center; }
.mes_watch     { background: transparent url(/data/img/watch00.png) no-repeat right center; }
.mes_telepathy { background: transparent url(/data/img/telepathy00.png) no-repeat right center; }
.mes_sympathy  { background: transparent url(/data/img/sympathy00.png) no-repeat right center; }
.mes_flirt     { background: transparent url(/data/img/flirt00.png) no-repeat right center; }
.mes_scream    { background: transparent url(/data/img/scream00.png) no-repeat right center; }
.mes_secret    { background: transparent url(/data/img/secret00.png) no-repeat right center; }
.mes_unknown   { background: transparent url(/data/img/unknown00.png) no-repeat right center; }
.mes_gm        { background: none; }
/* レガシーHTML対応: divをtdの高さ全体に引き伸ばす */
.message td > div[class^="mes_"]:not([class*="_body"]) {
  padding: 0; position: absolute; top: 0; bottom: 0; width: 16px;
}
.message td:has(> div[class^="mes_"]:not([class*="_body"])) {
  position: relative; width: 16px;
}
/* body0/body1の角丸画像は不要（border-radiusで代替済み） */
[class$="_body0"], [class$="_body1"] { background-image: none !important; }

.message .mes_say_body0,
.message .mes_whisper_body0,
.message .mes_groan_body0,
.message .mes_think_body0,
.message .mes_watch_body0,
.message .mes_telepathy_body0,
.message .mes_sympathy_body0,
.message .mes_flirt_body0,
.message .mes_scream_body0,
.message .mes_secret_body0,
.message .mes_unknown_body0,
.message .mes_gm_body0,
.announce {
  word-break: break-word;
}

/* 旧版準拠: 各吹き出しの背景色 */
.mes_say_body0, .mes_say_body1 { background: #fff; color: #000; }
.mes_whisper_body0, .mes_whisper_body1 { background: #f77; color: #000; }
.mes_groan_body0, .mes_groan_body1 { background: #9fb7cf; color: #000; }
.mes_think_body0, .mes_think_body1 { background: #939393; color: #000; }
.mes_watch_body0, .mes_watch_body1 { background: #DEB887; color: #000; }
.mes_telepathy_body0, .mes_telepathy_body1 { background: #a69abd; color: #000; }
.mes_sympathy_body0, .mes_sympathy_body1 { background: #8FBC8F; color: #000; }
.mes_flirt_body0, .mes_flirt_body1 { background: #FFC0CB; color: #000; }
.mes_scream_body0, .mes_scream_body1 { background: #BDB76B; color: #000; }
.mes_secret_body0, .mes_secret_body1 { background: #6e4a55; color: #fff; }
.mes_secret_body0 .loud, .mes_secret_body0 .say, .mes_secret_body0 .url, .mes_secret_body0 .popsay { color: #fff !important; }
.mes_unknown_body0, .mes_unknown_body1 { background: #626063; color: #fff; }
.mes_unknown_body0 .loud, .mes_unknown_body0 .say, .mes_unknown_body0 .url, .mes_unknown_body0 .popsay { color: #fff !important; }
.mes_gm_body0 { background: #000; border: 3px solid #555; padding: 8px 10px; }
.mes_gm_body1 { color: #ccc; }
.mes_gm_body1 .popsay, .mes_gm_body1 a { color: #ccc !important; }
.mes_say_body0, .mes_whisper_body0, .mes_groan_body0, .mes_think_body0, .mes_watch_body0,
.mes_telepathy_body0, .mes_sympathy_body0, .mes_flirt_body0, .mes_scream_body0,
.mes_secret_body0, .mes_unknown_body0 { padding: 8px 0 0; border-radius: 12px; overflow: hidden; }
.mes_say_body1, .mes_whisper_body1, .mes_groan_body1, .mes_think_body1, .mes_watch_body1,
.mes_telepathy_body1, .mes_sympathy_body1, .mes_flirt_body1, .mes_scream_body1,
.mes_secret_body1, .mes_unknown_body1, .mes_gm_body1 { padding: 0 12px 8px; }

/* プレビュー: 吹き出し形式 */
.message-preview { margin: 8px 0 0 80px; max-width: calc(100% - 80px); }
.message-preview table.message { margin-bottom: 0; }

/* 秘話宛先表示 */
.secret_address { font-size: 85%; border-bottom: 1px dashed #fff; color: #fff; padding-bottom: 2px; margin-bottom: 3px; font-weight: bold; }

/* 発言フォーム textarea color 旧版 base.css 名 (action_textarea, whisper_textarea 等) で直接指定済み */

/* 通報セクション */
.report-box { background: #12161f; border: 1px solid #222838; border-radius: 6px; padding: 10px 14px; margin-top: 16px; }
.report-box > summary { cursor: pointer; color: #9ca3af; font-size: 0.9rem; padding: 4px 0; }
.report-box > summary:hover { color: #e5e7eb; }
.report-slot { margin: 10px 0; padding: 10px; background: #181c26; border: 1px solid #1a1e2a; border-radius: 4px; }
.report-slot strong { color: #e5e7eb; font-size: 0.9rem; display: block; margin-bottom: 6px; }
.report-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.report-form label { color: #bbb; font-size: 0.85rem; }
.report-form select { background: #1a1a22; color: #ddd; border: 1px solid #445; padding: 3px 6px; border-radius: 3px; font-size: 0.85rem; }
.report-form textarea { background: #1a1a22; color: #ddd; border: 1px solid #445; padding: 4px 6px; border-radius: 3px; font-size: 0.85rem; flex: 1; min-width: 120px; }
.report-form .btn { font-size: 0.85rem; }

/* サイドバー検索フォーム */
.sidebar-search { margin-bottom: 8px; }
.sidebar-search-form { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.sidebar-search-form .search-input { width: 100%; background: #1a1a22; color: #ddd; border: 1px solid #445; padding: 4px 6px; border-radius: 3px; font-size: 0.85rem; box-sizing: border-box; }
.sidebar-search-form .btn { font-size: 0.78rem; padding: 2px 8px; }
/* サイドの参加者リスト（旧版準拠: 左サイドバー） */
.participant-list { background: #0c0f16; padding: 0; margin-bottom: 12px; overflow: hidden; border: 1px solid #1a1e2a; border-radius: 6px; }
.participant-list h4 { margin: 0 0 6px; }
.participant-list ul { list-style: none; padding: 0; margin: 0; }
.participant { display: flex; align-items: center; gap: 4px; padding: 2px 0; font-size: 0.82em; flex-wrap: wrap; }
.participant.dead { opacity: 0.6; }
.participant.cancelled { opacity: 0.4; }
.participant-face { width: 38px; height: auto; object-fit: contain; border: 0; }
.participant-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 140px; font-size: 14px !important; display: inline; text-decoration: underline; }
a.participant-name:link, a.participant-name:visited { color: #bbb; }
a.participant-name:hover { color: #fff; }
.speaker-toggle { color: #bbb; text-decoration: none; cursor: pointer; margin-left: 2px; }
.speaker-toggle:hover { color: #fff; }
.participant-role { font-size: 0.85em; color: #aaa; }
.participant-status { color: #c66; font-weight: bold; }

/* レイアウト 2カラム（旧版準拠: 左サイドバー + 右メイン） */
.game-layout { display: grid; grid-template-columns: 240px 1fr; gap: 8px; }
.game-layout .composition-display { grid-column: 1 / -1; }
.game-left { grid-column: 2; }
.game-right { grid-column: 1; align-self: start; position: sticky; top: 8px; max-height: calc(100vh - 16px); overflow-y: auto; }
@media (max-width: 800px) { .game-layout { grid-template-columns: 1fr; } .game-left, .game-right { grid-column: auto; min-width: 0; } .game-right { position: static; } }
.game-left { order: 2; }
.game-right { order: 1; }
.composition-display { grid-column: 1 / -1; order: 0; }

/* === 村作成フォーム === */
.mkvil .form-vil fieldset { border: 1px solid #ddd; padding: 0.8rem 1rem; margin-bottom: 0.8rem; background: #fff; }
.mkvil .form-vil legend { font-weight: bold; padding: 0 0.4rem; color: #2c3e50; }
.mkvil .form-vil .row { display: flex; flex-wrap: wrap; gap: 0.6rem 1rem; align-items: center; margin: 0.3rem 0; }
.mkvil .form-vil label { display: inline-flex; align-items: center; gap: 0.2rem; }
.mkvil .form-vil input[type=number] { width: 5em; }
.mkvil .form-vil input[type=text] { max-width: 16em; }
.mkvil .form-actions { margin: 1rem 0; }

/* === トップ === */
.home-banner { text-align: center; padding: 1rem 0; background: linear-gradient(135deg, #2c3e50, #7d2a2a); color: #fff; border-radius: 6px; margin-bottom: 1rem; }
.home-banner h2 { margin: 0; font-size: 2rem; letter-spacing: 0.1em; }
.home-banner .tagline { margin: 0.2rem 0 0; opacity: 0.85; }
.home .actions { margin: 0.8rem 0; }
.home .vil-group { margin-top: 1.2rem; padding: 0.3rem 0.6rem; background: #edf2f7; border-left: 4px solid #2c3e50; }
.vil-opts .badge-op { display: inline-block; background: #eef; border: 1px solid #ccd; border-radius: 3px; padding: 0 0.3rem; margin: 0 0.1rem 0.2rem; font-size: 0.78rem; color: #246; }

/* === 編成UI === */
.comp-section .role-grid { width: 100%; border-collapse: collapse; margin: 0.4rem 0; font-size: 0.85rem; max-height: 420px; overflow-y: auto; display: block; }
.comp-section .role-grid thead { background: #1a1e2e; position: sticky; top: 0; }
.comp-section .role-grid th, .comp-section .role-grid td { border: 1px solid #334; padding: 0.1rem 0.3rem; }
.comp-section .role-grid-4col { display: table; }
.comp-section .role-grid-4col td.role-label { white-space: nowrap; text-align: right; padding-right: 0.2em; font-size: 0.82rem; border: none; color: #cdf; }
.comp-section .role-grid-4col td { border: none; padding: 0.15rem 0.3rem; }
.comp-section .role-grid-4col input[type=number] { width: 3em; background: #1a1e2e; color: #eee; border: 1px solid #334; border-radius: 3px; padding: 2px 4px; }
.comp-section .comp-block { margin: 0.5rem 0; padding: 0.5rem; background: #12151e; border: 1px dashed #334; border-radius: 4px; }
.comp-section .hint { color: #8ab; font-size: 0.85rem; margin: 0.2rem 0; }

/* === クレジット === */
.home-credit { background: #fff; border: 1px solid #ddd; padding: 0.6rem 1rem; margin-top: 1rem; font-size: 0.82rem; color: #444; }
.home-credit h3 { margin-top: 0; }
.home-changelog { background: #fff; border-left: 4px solid #7d2a2a; padding: 0.6rem 1rem; margin-top: 1rem; }
.home-changelog h3 { margin-top: 0; }
.home-changelog ul { margin: 0.2rem 0 0.4rem 1.2rem; padding: 0; }

/* === 旧サイト風 追加 === */
.site-header, .admin-header { background: #112; color: #ddd; }
.site-main, .admin-main { background: #000; color: #ddd; }
.site-main a:link, .site-main a:visited,
.admin-main a:link, .admin-main a:visited { color: #bcb; }
.site-main a:hover, .admin-main a:hover { color: #fee; }
table.list { background: #222; color: #ddd; }
table.list th { background: #334; color: #eef; }
table.list td { border-color: #445; }
table.list td a:visited, table.list td a:link { color: #bbb; line-height: 110%; }
table.list td a.vid:visited, table.list td a.vid:link, table.list td a.vid { color: #ddd; text-decoration: none; }
table.list td a.vid:hover { color: #f6b; }
table.list td a.vil-name:visited, table.list td a.vil-name:link { color: #bcb; text-decoration: underline; }
table.list td a.vil-name:hover { color: #fee; }
table.list td a:hover { color: #fee; }
.vote-result-table { table-layout: auto; width: 100%; }
.vote-result-table td { white-space: nowrap; padding: 0.2rem 0.5rem; }
.home-banner { background: #111 url(/data/img/ten_banner.jpg) center/cover no-repeat; min-height: 120px; border: 1px solid #334; }
.home-banner-img { display: none; }
.home-banner h2 { color: #ffe; text-shadow: 2px 2px 6px #000; }
.home-banner .tagline { color: #cec; }
.home-credit { background: #1a1a22; color: #aab; border-color: #334; }
.home-credit a { color: #bcd; }
.home-changelog { background: #181820; color: #cdc; border-left-color: #c33; }
.home-changelog a { color: #fdb; }
/* 旧版 base.css 準拠 announce 色 */
.announce { background: #0c0f16; border: 1px solid #1a1e2a; border-left: 3px solid #3b82f6; font-size: 90%; margin: 6px 0; padding: 6px 10px; width: 530px; max-width: 100%; color: #ddd; word-break: break-word; border-radius: 4px; }
.announce.system { color: #ddd; }
.announce.vote { color: #aa6; }
.announce.whisper { color: #b66; }
.announce.safety { color: #ddd; }
.announce.win { color: #c44; font-size: 130%; padding: 4px; font-weight: bold; }
.announce.revive { color: #6c0; }
.announce.result { color: #ddd; font-size: 0.9em; }
.announce.zap { color: #c85554; }
.announce.fortune { color: #96b; }
.announce.fortune_id { color: #b99; }
.announce.fortune_aura { color: #d0af4c; }
.announce.fortune_skill { color: #80aba9; }
.announce.fortune_judge { color: #7B68EE; }
.announce.fortune_god { color: #96b; }
.announce.fortune_sub { color: #D19275; }
.announce.guard { color: #5a5; }
.announce.guard_god { color: #5a5; }
.announce.defense { color: #5383c3; }
.announce.tarot { color: #9370DB; }
.announce.telepathy { color: #a69abd; }
.announce.scream { color: #9a8; }
.announce.tough { color: #fbca4d; }
.announce.sick { color: #B87333; }
.announce.muramasa { color: #a52a2a; }
.announce.youma { color: #a69abd; }
.announce.bat { color: #9790a4; }
.announce.hunter { color: #008B8B; }
.announce.guide { color: #00afcc; }
.announce.girl { color: #e198b4; }
.announce.mary { color: #8FBC8F; }
.announce.oko { color: #FF0000; }
.announce.calumon { color: #d4dcda; }
.announce.black { color: #7d7d7d; }
.announce.bartender { color: #B8860B; }
.announce.shogun { color: #5959AB; }
.announce.testament { color: #aa6; }
.announce.dragonball { color: #ffd700; }
/* 後追い死・特殊死・役職変化系 */
.announce.cupid { color: #b69; }
.announce.servant { color: #d13; }
.announce.bond { color: #ebd842; }
.announce.monster { color: #5F9EA0; }
.announce.cthulhu { color: #915c8b; }
.announce.immoral { color: #a69abd; }
.announce.imperial { color: #FFD700; }
.announce.apocalypse { color: #c44; }
/* オラクル・霊能・探偵系 */
.announce.oracle { color: #f6bfbc; }
.announce.oracle_aura { color: #e6cde3; }
.announce.oracle_skill { color: #e4ab9b; }
.announce.spirit_aura { color: #9079ad; }
.announce.spirit_skill { color: #a6a5c4; }
.announce.inspect { color: #BC8F8F; }
.announce.detective { color: #BC8F8F; }
.announce.prayer { color: #F4A460; }
.announce.reveal { color: #5F9EA0; }
/* --- 旧版 base.css 準拠: 不足していた announce サブクラス --- */
.announce.sympathy { color: #8FBC8F; }
.announce.free { color: #b96; }
.announce.vampire { color: #a22041; }
.announce.killer { color: #a25768; }
.announce.assassin { color: #6e7955; }
.announce.knight { color: #5a5; }
.announce.maid { color: #f09199; }
.announce.silver { color: #c0c0c0; }
.announce.founder { color: #282; }
.announce.gambler { color: #867ba9; }
.announce.judgment { color: #867ba9; }
.announce.lonely { color: #c99; }
.announce.predator { color: #9790a4; }
.announce.caution { color: #887938; }
.announce.fugitive { color: #887938; }
.announce.marshals { color: #887938; }
.announce.mania { color: #aa6; }
.announce.cosplay { color: #aa6; }
.announce.moon { color: #e0de94; }
.announce.mask { color: #bb5535; }
.announce.shadow { color: #888084; }
.announce.witch { color: #969; }
.announce.spy { color: #c72; }
.announce.thief { color: #a59aca; }
.announce.drunk { color: #F0E68C; }
.announce.neet { color: #887f7a; }
.announce.gacha { color: #6495ED; }
.announce.normal { color: #aa6; }
.announce.basic { color: #96b; }
.announce.rare { color: #e198b4; }
.announce.superrare { color: #c0c0c0; }
.announce.ultrarare { color: #FFD700; }
.announce.legendrare { color: #FFFF00; }
.announce.awakening { color: #f8e58c; }
.announce.trainee { color: #B384FF; }
.announce.return { color: #99CC66; }
.announce.trans { color: #c7dc68; }
.announce.irregular { color: #426579; }
.announce.stigmata { color: #8a2; }
.announce.baker { color: #D98719; }
.announce.dark { color: #696969; }
.announce.shine { color: #FFD700; }
.announce.yatagarasu { color: #f8b862; }
.announce.tengu { color: #FF6347; }
.announce.tanuki { color: #88cb7f; }
.announce.thunder { color: #DAA520; }
.announce.tsukumo { color: #20B2AA; }
.announce.flirt { color: #FFC0CB; }
.announce.secret { color: #FFC0CB; }
.announce.dolls { color: #A9A9A9; }
.announce.spirit { color: #69b; }
.mkvil .form-vil fieldset { background: #151520; color: #ddd; border-color: #334; }
.mkvil .form-vil legend { color: #cdf; }
.mkvil .form-vil input, .mkvil .form-vil select, .mkvil .form-vil textarea {
  background: #1a1e2e; color: #eee; border: 1px solid #334; padding: 5px 8px; border-radius: 4px;
}
/* --- 村作成フォーム --- */
.mkvil-fieldset { border: 1px solid #334; padding: 12px 16px; margin-bottom: 12px; background: #151520; border-radius: 6px; }
.mkvil-fieldset legend { font-weight: bold; color: #8ab4f8; padding: 0 6px; font-size: 0.92rem; }
.mkvil-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
.mkvil-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 8px; margin-bottom: 8px; }
.mkvil-field { display: flex; flex-direction: column; gap: 2px; }
.mkvil-field label { font-size: 0.85rem; color: #aab; }
.mkvil-field-wide { flex: 1; min-width: 200px; }
.mkvil-hint { font-size: 0.75rem; color: #666; }
.mkvil-radio { display: inline-flex; align-items: center; gap: 4px; font-size: 0.88rem; cursor: pointer; }
.mkvil-inline { display: flex; align-items: center; gap: 6px; }
.comp-section .role-grid { background: #1a1a22; color: #ddd; }
.comp-section .role-grid thead { background: #223; }
.comp-section .role-grid th, .comp-section .role-grid td { border-color: #334; }
.comp-section .comp-block { background: #15151c; border-color: #334; }
.btn { display: inline-flex; justify-content: center; align-items: center; padding: 0.3rem 0.8rem; border: 1px solid #556; background: #223; color: #dde; border-radius: 3px; cursor: pointer; text-align: center; text-indent: 0; box-sizing: border-box; line-height: 1.4; text-decoration: none; }
.btn:hover { background: #334; }
.btn-primary { background: #255; border-color: #488; color: #efe; }
.btn-primary:hover { background: #366; }
.btn-secondary { background: #223; border-color: #556; color: #dde; }
.btn-secondary:hover { background: #334; }
.btn-back { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; background: #1a2030; border: 1px solid #334; color: #8ab4f8; border-radius: 6px; font-size: 0.88rem; text-decoration: none; transition: background 0.15s, border-color 0.15s; }
.btn-back:hover { background: #253050; border-color: #4a6a9a; color: #a8ccff; }
.btn-back::before { content: '\2190'; font-size: 1.05em; }
.nav-back-bar { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.site-footer { color: #aaa; }
dl.vil-meta dt { color: #aab; }
dl.vil-meta { color: #ddd; }
.vil-summary-bar { background: #333; border: 1px solid #555; padding: 4px 8px; margin: 4px 0 8px; font-size: 90%; color: #ccc; line-height: 1.8; }
.vil-summary-item { margin-right: 1em; white-space: nowrap; }
.vil-summary-item strong { color: #bcb; }
/* === 村詳細ヒーローセクション === */
.vil-detail-hero { margin: 8px 0 16px; }
.vil-detail-status { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.vil-status-badge { display: inline-block; padding: 5px 16px; border-radius: 20px; font-weight: bold; font-size: 0.88rem; letter-spacing: 0.5px; }
.vil-status-0 { background: #0d2818; color: #4ade80; border: 1px solid #1a4a2a; }
.vil-status-1 { background: #2a1a0a; color: #fbbf24; border: 1px solid #4a3a1a; }
.vil-status-2, .vil-status-3, .vil-status-4 { background: #1a1a2a; color: #94a3b8; border: 1px solid #2a2a4a; }
.vil-detail-win { font-size: 0.95rem; color: #f59e0b; font-weight: bold; }
.vil-detail-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 6px; }
.vil-detail-card { display: flex; align-items: center; gap: 0; background: #12161f; border: 1px solid #222838; border-radius: 6px; overflow: hidden; transition: border-color 0.15s; }
.vil-detail-card:hover { border-color: #3a4a68; }
.vil-detail-card-accent { flex-shrink: 0; width: 4px; align-self: stretch; }
.vil-detail-card-accent-blue { background: #3b82f6; }
.vil-detail-card-accent-purple { background: #8b5cf6; }
.vil-detail-card-accent-green { background: #22c55e; }
.vil-detail-card-accent-amber { background: #f59e0b; }
.vil-detail-card-accent-red { background: #ef4444; }
.vil-detail-card-accent-cyan { background: #06b6d4; }
.vil-detail-card-accent-teal { background: #14b8a6; }
.vil-detail-card-accent-rose { background: #f43f5e; }
.vil-detail-card-body { padding: 8px 12px; min-width: 0; }
.vil-detail-card-label { font-size: 0.7rem; color: #6b7280; margin-bottom: 1px; }
.vil-detail-card-value { font-size: 0.88rem; color: #e5e7eb; font-weight: 500; }
.vil-detail-card-value a { color: #8ab4f8; }
.vil-detail-card-value a:hover { color: #aac8ff; }
.vil-info-details { margin-bottom: 0.8rem; }
.vil-info-details > summary { cursor: pointer; display: inline-block; padding: 7px 18px; background: #12161f; color: #8ab4f8; font-weight: 600; border: 1px solid #222838; border-radius: 6px; font-size: 0.86rem; transition: all 0.15s; }
.vil-info-details > summary:hover { background: #1a2030; color: #aac8ff; border-color: #3a4a68; }
.vil-info-details[open] > summary { background: #1a2538; border-color: #2a4a68; }
/* 村詳細テーブル */
.vil-detail-table { border-radius: 6px; overflow: hidden; }
.vil-detail-table thead { background: #12161f; }
.vil-detail-table th { background: #12161f; border-color: #1a1e2a; color: #9ca3af; font-size: 0.82rem; font-weight: 600; }
.vil-detail-table td { border-color: #1a1e2a; }
/* 村下部アクションバー */
.vil-bottom-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0; padding: 12px 0; border-top: 1px solid #1a1e2a; }
.flash-notice { background: #1a2a1a; color: #cfc; border: 1px solid #354; }
.flash-alert { background: #2a1a1a; color: #fcc; border: 1px solid #543; }

/* === メッセージ anchor & フィルタ === */
.game-board { margin-top: 0; background: transparent; color: #ddd; padding: 0; border-radius: 0; overflow: clip; }
.game-board h3 { margin-top: 0; color: #e5e7eb; font-size: 1.05rem; background: #12161f; border: 1px solid #222838; padding: 10px 14px; border-radius: 6px; max-width: 100%; box-sizing: border-box; }
.game-board h3 .badge-epilogue { display: inline-block; padding: 2px 10px; background: #1a2a3a; color: #60a5fa; border-radius: 12px; font-size: 0.78rem; font-weight: 600; border: 1px solid #2a4060; margin-left: 8px; }
.game-board h4 { color: #ddd; margin: 0.2rem 0 0.4rem; max-width: 100%; box-sizing: border-box; }
.game-board small { color: #9ca3af; font-weight: normal; font-size: 0.82rem; }
.filter-bar { margin: 0.3rem 0; padding: 0.3rem 0.5rem; background: #1a1a22; color: #ce8; border: 1px dashed #554; font-size: 0.85rem; min-height: 1.2em; }
.msg-num { font-family: monospace; color: #8ac; margin-right: 0.4rem; }
a.anchor { cursor: pointer; }

/* 発言ログは body (#000) と溶け込ませ、枠を浮かせない */
.msg-list { background: transparent; padding: 0; border-radius: 0; }

/* char_name/mes_number のクリック用スタイルのみ追加（base.css に任せ、ここでは font-size 等は設定しない） */
.msg-list .message .char_name,
.msg-popup .message .char_name { cursor: pointer; }
.msg-list .message .char_name:hover,
.msg-popup .message .char_name:hover { color: #fff; text-decoration: underline; }
.msg-list .message .msg-num-anchor:hover { color: #fff; text-decoration: underline; }

/* アイコン TD の縦中央揃え（base.css の td padding:0 はそのまま） */
.msg-list table.message > tbody > tr > td:first-child,
.msg-list table.message > tr > td:first-child,
.msg-popup table.message > tbody > tr > td:first-child,
.msg-popup table.message > tr > td:first-child {
  vertical-align: middle;
}
/* キャラアイコン：旧版準拠 — td width=64 に任せ、画像は自然サイズ表示 */
.msg-list table.message img.speaker-icon,
.msg-popup table.message img.speaker-icon { max-width: 64px; border: 0; border-radius: 0; display: block; }

.participant-name { cursor: pointer; }
.participant-name:hover { color: #fff; text-decoration: underline; }

/* アンカーのポップアップは旧版風に黒背景＋灰枠 */
.msg-popup {
  position: absolute;
  display: none;
  z-index: 1000;
  max-width: 560px;
  padding: 4px 6px;
  background: #000;
  border: 1px solid #888;
  box-shadow: 0 4px 10px rgba(0,0,0,0.7);
  color: #ddd;
}
.msg-popup .message, .msg-popup .announce { margin-bottom: 0; width: auto; }
.msg-popup-loading { color: #ccc; font-size: 0.85rem; padding: 4px; }
.msg-num-anchor { cursor: pointer; }
.inline-ref {
  margin: 4px 0 10px 22px;
  padding: 4px 6px;
  border-left: 2px solid #557;
  background: transparent;
  color: #ddd;
}
.inline-ref-head {
  color: #9bb;
  font-size: 0.78rem;
  margin: 0 0 2px 6px;
}
.inline-ref-close { color: #aac; margin-left: 6px; font-size: 0.78rem; text-decoration: none; }
.inline-ref-close:hover { color: #fdd; text-decoration: underline; }
.speaker-icon { cursor: pointer; transition: transform .1s; }
.speaker-icon:hover { transform: scale(1.08); outline: 2px solid #f8a; }
.participant-face { cursor: pointer; }
.participant-family { font-size: 0.78rem; margin-left: 0.2rem; }
.family-wolf    { color: #f77; }
.family-fox     { color: #fc8; }
.family-fanatic { color: #faa; }
.family-cult    { color: #c9f; }
.family-lover   { color: #f9c; }
.family-vampire { color: #b8f; }
.family-killer  { color: #f86; }
.family-assassin { color: #fd8; }
.family-friend  { color: #acd; }
.family-revenge { color: #fba; }

.village-index-page { max-width: none; }
.villist-banner { margin: 0 0 12px; text-align: center; }
.villist-banner-img { display: block; width: 100%; max-width: 728px; margin: 0 auto; border: 1px solid #334; }
.main-menu { margin-bottom: 12px; }
.menu-links { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.menu-links li { display: inline; }
.villist-tools {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}
.villist-tools .actions { margin: 0; padding: 0; }
.villist-search input[type=text] {
  min-width: 240px;
  background: #1a1a22;
  color: #ddd;
  border: 1px solid #445;
  padding: 4px 6px;
}
.stats li { background: #12161f; color: #ddd; border: 1px solid #222838; box-shadow: none; }
.vil-group { color: #ddd; background: #223; border-left-color: #556; }
.vil-list td, .vil-list th { white-space: nowrap; }
.vil-list td:nth-child(2) { white-space: normal; width: 100%; }
/* --- Village cards --- */
.vil-cards { display: flex; flex-direction: column; gap: 6px; }
.vil-card-link { display: block; text-decoration: none; color: inherit; border-radius: 6px; transition: transform 0.1s, box-shadow 0.15s; }
.vil-card-link:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.3); }
.vil-card-link:hover .vil-card { border-color: #4a5a80; }
.vil-card { background: #181c28; border: 1px solid #2a3040; border-radius: 6px; padding: 10px 14px; transition: border-color 0.15s; }
.vil-card:hover { border-color: #4a5060; }
.vil-card-header { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.vil-card-no { font-weight: bold; color: #8ab4f8; }
.vil-card-no a { color: #8ab4f8; }
.vil-card-name { color: #ddd; font-weight: 500; }
.vil-card-name a { color: #ddd; font-weight: 500; }
.vil-card-name a:hover, .vil-card-name:hover { color: #fff; }
.vil-card-count { margin-left: auto; color: #8ab4f8; font-weight: bold; font-size: 0.9rem; }
.vil-card-body { display: flex; flex-wrap: wrap; gap: 4px; }
.vil-tag { display: inline-block; background: #252a3a; color: #aab; font-size: 0.75rem; padding: 2px 6px; border-radius: 3px; }
.vil-tag-gm { background: #3a2a1a; color: #f0c060; }
.vil-tag-lock { background: #3a1a1a; color: #f06060; }
.vil-card-footer { margin-top: 4px; font-size: 0.78rem; color: #888; }
.vil-card-owner a { color: #9ca3af; }
.vil-card-owner a:hover { color: #ddd; }
.vil-card-summary { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 4px; align-items: center; }
.vil-summary-chip { display: inline-block; font-size: 0.8rem; padding: 2px 8px; border-radius: 4px; white-space: nowrap; }
.vil-chip-comp { background: #1a2a3a; color: #60a5fa; font-weight: 600; border: 1px solid #2a4060; }
.vil-chip-charset { background: #2a1a2a; color: #c084fc; font-weight: 600; border: 1px solid #4a2a5a; }
.vil-chip-start { color: #f59e0b; font-weight: 600; }
.vil-chip-time { color: #9ca3af; }
.vil-chip-owner { color: #666; font-size: 0.78rem; }
.vil-chip-owner a { color: #9ca3af; }
.vil-chip-owner a:hover { color: #ddd; }
.site-header nav a:link, .site-header nav a:visited { color: #bcb; }
.site-header nav a:hover { color: #fee; }
/* --- User settings --- */
.user-settings fieldset { border: 1px solid #334; padding: 12px 16px; margin-bottom: 12px; background: #151520; border-radius: 6px; }
.user-settings fieldset legend { font-weight: bold; color: #8ab4f8; padding: 0 6px; font-size: 0.9rem; }
.user-settings .row { margin-bottom: 8px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.user-settings .row label { font-size: 0.88rem; }
.user-settings input[type=number], .user-settings select { background: #1a1e2e; color: #ddd; border: 1px solid #334; padding: 4px 8px; border-radius: 4px; }
.user-settings textarea { background: #1a1e2e; color: #ddd; border: 1px solid #334; padding: 8px; border-radius: 4px; width: 100%; font-family: monospace; }
.user-settings .form-actions { margin-top: 16px; }
/* --- Loglist search --- */
.loglist-search { margin-bottom: 16px; }
.loglist-search input[type=text], .loglist-search select { background: #1a1e2e; color: #ddd; border: 1px solid #334; padding: 6px 10px; border-radius: 4px; }
.search-row { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.search-row input[type=text] { background: #1a1e2e; color: #ddd; border: 1px solid #334; padding: 6px 10px; border-radius: 4px; min-width: 100px; flex: 1; }
.search-row select { background: #1a1e2e; color: #ddd; border: 1px solid #334; padding: 6px 10px; border-radius: 4px; }

/* 大声・小声（旧版 base.css 準拠） */
.loud {
  color: #911;
  display: inline;
  font-size: 120%;
  font-weight: 700;
}
.small_voice {
  font-size: 9pt;
  line-height: 100%;
}

/* === 戦績カード === */
.recent-records-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px; }
.record-card-link { display: block; text-decoration: none; color: inherit; border-radius: 6px; transition: transform 0.1s, box-shadow 0.15s; }
.record-card-link:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.3); }
.record-card-link:visited { color: inherit; }
.record-card { display: flex; align-items: center; gap: 10px; background: #181c28; border: 1px solid #2a3040; border-radius: 6px; padding: 8px 14px; transition: border-color 0.15s; }
.record-card-link:hover .record-card { border-color: #4a5a80; }
.record-card-name { font-weight: 600; color: #8ab4f8; font-size: 0.95rem; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.record-card-count { display: inline-block; background: #252a3a; color: #aab; font-size: 0.78rem; padding: 2px 8px; border-radius: 3px; white-space: nowrap; }
.record-card-date { color: #666; font-size: 0.78rem; white-space: nowrap; margin-left: auto; }

/* === エントリー状況セクション === */
.entry-section { margin-top: 1rem; }
.entry-section h3 { margin-top: 0; color: #e5e7eb; font-size: 1.05rem; background: #12161f; border: 1px solid #222838; padding: 10px 14px; border-radius: 6px; max-width: 100%; box-sizing: border-box; }
/* === 旧版 info.html 準拠: 村情報テーブル === */
table.mkvil_index { border-collapse: collapse; margin-bottom: 0.3em; width: 100%; }
table.mkvil_index td { padding: 4px 8px; font-size: 0.85rem; }
table.vil_index { border-collapse: collapse; width: 100%; margin-bottom: 0.5em; border-radius: 6px; overflow: hidden; table-layout: fixed; word-break: break-word; }
table.vil_index td { padding: 4px 8px; font-size: 0.85rem; border: 1px solid #1a1e2a; color: #d0d4dc; background: #181c26; overflow: hidden; text-overflow: ellipsis; }
td.vil_title2 { background: #12161f !important; color: #9ca3af; font-weight: 600; padding: 5px 10px !important; font-size: 0.82rem; border-color: #1a1e2a; }
on { color: #f94; font-weight: bold; }
table.skill-table { border-collapse: collapse; margin: 0.3em 0; }
table.skill-table td { padding: 2px 8px; font-size: 0.85rem; border: 1px solid #555; }
.team-village { color: #6f6; } .team-wolf { color: #f66; } .team-fox { color: #ff6; }
.team-other { color: #aaf; } .team-special { color: #faf; }

/* === インラインエントリーフォーム（アイコングリッド選択） === */
.entry-inline { margin: 0.5em 0; padding: 1em; background: #1a1d28; border-radius: 8px; border: 1px solid #334; }
.entry-inline .entry-fieldset { border: 1px solid #334; padding: 0.8rem; margin-bottom: 1rem; background: #151520; border-radius: 6px; }
.entry-inline .entry-fieldset legend { font-weight: bold; padding: 0 0.4rem; color: #eee; }
.entry-inline .entry-fieldset legend a { color: #8af; }
.entry-inline .entry-preview { display: flex; align-items: center; gap: 1rem; padding: 0.6rem 0.8rem; margin-bottom: 0.8rem; background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%); border-radius: 6px; }
.entry-inline .entry-preview img { background: #fff; border: 3px solid #f1c40f; border-radius: 6px; box-shadow: 0 2px 6px rgba(0,0,0,0.4); width: 80px; height: auto; }
.entry-inline .entry-preview-name { font-size: 1.1rem; font-weight: bold; color: #ffeaa7; }
.entry-inline .entry-name-row { margin-bottom: 0.5em; }
.entry-inline .entry-name-row label { color: #ccc; margin-right: 0.3em; }
.entry-inline .entry-name-row input { background: #222; color: #eee; border: 1px solid #445; padding: 0.3em 0.5em; border-radius: 3px; }
.entry-inline .char-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 4px; max-height: 400px; overflow-y: auto; border: 1px solid #34495e; padding: 8px; background: #2c3e50; border-radius: 4px; }
.entry-inline .char-cell { display: flex; flex-direction: column; align-items: center; padding: 4px 2px; border: 2px solid transparent; border-radius: 4px; cursor: pointer; background: #1f2330; font-size: 0.76rem; line-height: 1.2; transition: background 0.1s, border-color 0.1s; }
.entry-inline .char-cell:hover { background: #2a3040; border-color: #f39c12; }
.entry-inline .char-cell input[type="radio"] { display: none; }
.entry-inline .char-cell img { display: block; width: 48px; height: auto; background: #0f1118; border-radius: 3px; }
.entry-inline .char-cell .char-name { margin-top: 2px; text-align: center; word-break: break-all; max-width: 68px; color: #d9e0f0; font-weight: 500; }
.entry-inline .char-cell.char-selected { background: #f39c12; border-color: #d35400; }
.entry-inline .char-cell.char-selected .char-name { color: #fff; text-shadow: 0 1px 1px rgba(0,0,0,0.4); }
.entry-inline .char-cell.char-used { opacity: 0.3; cursor: not-allowed; filter: grayscale(95%); }

/* 希望役職グリッド */
.role-select-tabs { margin-bottom: 0.5em; }
.role-tab-label { margin-right: 1em; color: #ccc; cursor: pointer; font-size: 0.85rem; }
.role-tab-label input[type="radio"] { margin-right: 0.2em; }
.role-grid, .role-grid-team { display: flex; flex-wrap: wrap; gap: 3px; padding: 6px; background: #2c3e50; border-radius: 4px; border: 1px solid #34495e; max-height: 300px; overflow-y: auto; }
.role-pick { display: inline-block; padding: 3px 8px; background: #1f2330; border: 1px solid #445; border-radius: 3px; cursor: pointer; font-size: 0.8rem; color: #ccc; transition: background 0.1s, border-color 0.1s; }
.role-pick:hover { background: #2a3040; border-color: #f39c12; color: #fff; }
.role-pick.role-pick-selected { background: #f39c12; border-color: #d35400; color: #fff; font-weight: bold; }
.role-team-header { width: 100%; background: #335; color: #eee; font-weight: bold; padding: 2px 8px; font-size: 0.8rem; border-radius: 3px; margin-top: 4px; }

.action_textarea { width: 100%; min-height: 3em; margin: 2px 0; background: #fff; color: #000; border: 1px solid #999; border-radius: 3px; padding: 0.4em; font-size: 10pt; line-height: 100%; box-sizing: border-box; }
/* 旧版 base.css 準拠: textarea の種別別背景色 */
.whisper_textarea { width: 100%; min-height: 3em; margin: 2px 0; background: #fcc; color: #000; border: 1px solid #999; border-radius: 3px; padding: 0.4em; font-size: 10pt; line-height: 100%; box-sizing: border-box; }
.groan_textarea { width: 100%; min-height: 3em; margin: 2px 0; background: #bde; color: #000; border: 1px solid #999; border-radius: 3px; padding: 0.4em; font-size: 10pt; line-height: 100%; box-sizing: border-box; }
.secret_textarea { width: 100%; min-height: 3em; margin: 2px 0; background: #6e4a55; color: #fff; border: 1px solid #999; border-radius: 3px; padding: 0.4em; font-size: 10pt; line-height: 100%; box-sizing: border-box; }
.telepathy_textarea { width: 100%; min-height: 3em; margin: 2px 0; background: #a69abd; color: #000; border: 1px solid #999; border-radius: 3px; padding: 0.4em; font-size: 10pt; line-height: 100%; box-sizing: border-box; }
.sympathy_textarea { width: 100%; min-height: 3em; margin: 2px 0; background: #8FBC8F; color: #000; border: 1px solid #999; border-radius: 3px; padding: 0.4em; font-size: 10pt; line-height: 100%; box-sizing: border-box; }
.flirt_textarea { width: 100%; min-height: 3em; margin: 2px 0; background: #FFC0CB; color: #000; border: 1px solid #999; border-radius: 3px; padding: 0.4em; font-size: 10pt; line-height: 100%; box-sizing: border-box; }
.scream_textarea { width: 100%; min-height: 3em; margin: 2px 0; background: #BDB76B; color: #000; border: 1px solid #999; border-radius: 3px; padding: 0.4em; font-size: 10pt; line-height: 100%; box-sizing: border-box; }
.testament_textarea { width: 100%; min-height: 3em; margin: 2px 0; background: #dcdddd; color: #000; border: 1px solid #999; border-radius: 3px; padding: 0.4em; font-size: 10pt; line-height: 100%; box-sizing: border-box; }
select.testament_id { background: #eee; color: #000; border: 1px solid #999; border-radius: 3px; padding: 1px 4px; font-size: 0.85rem; }
.textarea-think { background: #939393; color: #000; }
/* 入村挨拶用: ダークテーマに合わせた別スタイル */
.entry-textarea { width: 100%; min-height: 3em; margin: 0.3em 0; background: #222; color: #eee; border: 1px solid #445; border-radius: 3px; padding: 0.4em; }
.entry-submit-row { margin-top: 0.5em; }

/* === エントリー後の変更フォーム === */
.vil-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 8px; padding: 6px 0; }
.vil-actions .btn { margin: 0; }
.vil-actions .inline-form { display: flex; align-items: center; gap: 4px; }
.entry-change-info { margin: 0.5em 0; padding: 0.5em 0.8em; background: #1a1d28; border-radius: 4px; border-left: 3px solid #f39c12; }
.entry-change-details { margin: 0.5em 0; }
.entry-change-details > summary { cursor: pointer; display: inline-block; padding: 6px 16px; background: #34495e; color: #fff; border: 1px solid #4a6075; border-radius: 4px; font-size: 0.9rem; font-weight: bold; list-style: none; }
.entry-change-details > summary::-webkit-details-marker { display: none; }
.entry-change-details > summary::marker { display: none; content: ''; }
.entry-change-details > summary:hover { background: #3d566e; color: #fee; }
.entry-change-details[open] > summary { background: #2a3d52; border-color: #5a7a95; }
.change-entry-form { padding: 0.5em; background: #1a1d28; border-radius: 8px; border: 1px solid #334; }
.change-entry-form .entry-fieldset { border: 1px solid #334; padding: 0.6rem; margin-bottom: 0.8rem; background: #151520; border-radius: 6px; }
.change-entry-form .entry-fieldset legend { font-weight: bold; padding: 0 0.4rem; color: #eee; }
.change-entry-form .entry-fieldset legend a { color: #8af; }
.change-entry-form .entry-preview { display: flex; align-items: center; gap: 1rem; padding: 0.5rem 0.8rem; margin-bottom: 0.5rem; background: linear-gradient(135deg, #2c3e50, #34495e); border-radius: 6px; }
.change-entry-form .entry-preview img { background: #fff; border: 3px solid #f1c40f; border-radius: 6px; width: 80px; height: auto; }
.change-entry-form .entry-preview-name { font-size: 1rem; font-weight: bold; color: #ffeaa7; }
.change-entry-form .char-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(68px, 1fr)); gap: 3px; max-height: 300px; overflow-y: auto; border: 1px solid #34495e; padding: 6px; background: #2c3e50; border-radius: 4px; }
.change-entry-form .char-cell { display: flex; flex-direction: column; align-items: center; padding: 3px 2px; border: 2px solid transparent; border-radius: 4px; cursor: pointer; background: #1f2330; font-size: 0.74rem; transition: background 0.1s, border-color 0.1s; }
.change-entry-form .char-cell:hover { background: #2a3040; border-color: #f39c12; }
.change-entry-form .char-cell input[type="radio"] { display: none; }
.change-entry-form .char-cell img { display: block; width: 44px; height: auto; background: #0f1118; border-radius: 3px; }
.change-entry-form .char-cell .char-name { margin-top: 2px; text-align: center; word-break: break-all; max-width: 64px; color: #d9e0f0; }
.change-entry-form .char-cell.char-selected { background: #f39c12; border-color: #d35400; }
.change-entry-form .char-cell.char-selected .char-name { color: #fff; }
.change-entry-form .char-cell.char-used { opacity: 0.3; cursor: not-allowed; filter: grayscale(95%); }
.change-entry-form input[type="text"] { background: #222; color: #eee; border: 1px solid #445; padding: 0.3em 0.5em; border-radius: 3px; }

/* === 旧版準拠: サイドバー追加情報 === */
.say-count { font-size: 0.75rem; color: #bbb; }
.say-remain { font-size: 0.75rem; color: #a80; }
.comp_vote { color: #dd2; font-weight: 700; font-size: 0.75rem; line-height: 110%; }
.participant-id { font-size: 0.72rem; color: #bbb; }
.participant-id a { color: #bcb; }
.participant-id a:hover { color: #fff; }

/* 旧版準拠: 特殊スパンカラー */
.cupid-tag { color: #b69; }
.revenge-tag { color: #c44; }

/* === 旧版base.css準拠: テキスト色クラス === */
.whisper { color: #b66; }
.telepathy { color: #a69abd; }
.fortune { color: #96b; }
.fortune_id { color: #b99; }
.guard { color: #5a5; }
.spirit { color: #69b; }
.free { color: #b96; }
.cupid { color: #b69; }
.human { color: #2bb; line-height: 110%; }
.wolf { color: #c44; line-height: 110%; }
.love { color: #f6b; }
.revenge { color: #c44; }
.servant { color: #96b; }
.cthulhu { color: #a69abd; }
.loyal { color: #5a5; }
.bond { color: #69b; }
.successor { color: #b96; }
.slave { color: #c44; }
.monster { color: #c44; }
.mad { color: #c44; }
.vote, .conf, .flash { color: #aa6; }
.win_res { color: #e00; font-weight: bold; }
.lose_res { color: #00e; font-weight: bold; }
.loud { color: #911; display: inline; font-size: 120%; font-weight: 700; }
/* 旧版: announce系 — 統合済み（上部の .announce ルールを参照） */
.announce a:visited, .announce a:link { color: #bcb; }
/* 旧版: メッセージ内リンク色 */
table.message td a:visited.say, table.message td a:link.say,
table.message td a:visited.url, table.message td a:link.url, .popsay { color: #200; font-size: 100%; text-decoration: underline; }
table.message span.char_name, table.message span.mes_number, table.message span.mes_res,
table.message a.mes_number, table.message a.mes_res { color: #bbb; font-size: 80%; }
table.message span.char_name { font-weight: bold; }
table.message span.mes_number, table.message a.mes_number { font-size: 14px !important; padding: 2px 4px; display: inline-block; min-width: 2em; text-align: center; }
table.message span.mes_number:hover, table.message span.mes_res:hover,
table.message a.mes_number:hover, table.message a.mes_res:hover { text-decoration: underline; cursor: pointer; color: #fff; }
td span.cut a:visited.say, td span.cut a:link.say, td span.cut a:visited.url, td span.cut a:link.url, .cut { color: #cc9; }
.howl-text { color: #bbb; font-style: italic; }
.servant-tag { color: #9a8; }

/* 旧版準拠: h2見出し */
h2 { background-color: #444; border: #666 solid 1px; color: #ccc; font-size: 130%; margin: 0; padding: 2px 8px; }

/* 旧版準拠: 勝利表示 */
.badge-win { color: #e00; font-weight: bold; }

/* 旧版準拠: サイドバー参加者リスト */
.participant-list { border: 1px solid #1a1e2a; font-size: 0.85rem; }
.participant-list h4 { background: #12161f; border-bottom: 1px solid #1a1e2a; padding: 6px 10px; margin: 0; color: #e5e7eb; font-size: 0.88rem; }
.participant-list ul { list-style: none; padding: 0.3em; margin: 0; }
.participant-list li { padding: 0.2em 0; color: #bbb; }
.participant-list li a { color: #bbb; }
.participant-list li a:hover { color: #fff; }
.participant-face { cursor: pointer; }
.participant-face:hover { opacity: 0.8; }
.participant-name { color: #bbb; cursor: pointer; }
.participant-name:hover { color: #fff; }
.participant-role { font-size: 0.8rem; }
.participant-status { font-weight: bold; }

/* 旧版 base.css 準拠: 不足していた announce サブクラス（settarget全117エントリ対応） */
.announce.possessed { color: #5db; }
.announce.song { color: #DEB887; }
.announce.dance { color: #FFA07A; }
.announce.artist { color: #E9967A; }
.announce.support { color: #4682B4; }
.announce.geisha { color: #DDA0DD; }
.announce.oiran { color: #eb6ea5; }
.announce.cook { color: #cb8347; }
.announce.flower { color: #f4b3c2; }
.announce.flute { color: #b88884; }
.announce.coffin { color: #5b7e91; }
.announce.shoes { color: #c37854; }
.announce.executioner { color: #8b968d; }
.announce.tyrant { color: #e9546b; }
.announce.bearer { color: #f19072; }
.announce.reset { color: #B0C4DE; }
.announce.match_girl { color: #df7163; }
.announce.nadeshiko { color: #eebbcb; }
.announce.gargoyle { color: #898880; }
.announce.gachapin { color: #93ca76; }
.announce.mukku { color: #ec6d71; }
.announce.dog { color: #3e62ad; }
.announce.serpent { color: #47885e; }
.announce.death { color: #7d7d7d; }
.announce.ookami { color: #ec6d51; }
.announce.joker { color: #7d7d7d; }
.announce.soul { color: #c7dc68; }
.announce.loyal { color: #84b9cb; }
.announce.slave { color: #d0576b; }
.announce.trader { color: #e6b422; }
.announce.trap { color: #008B8B; }
.announce.heat { color: #a25768; }
.announce.cold { color: #87CEEB; }
.announce.steinsgate { color: #8491c3; }
.announce.sacrifice { color: #95859c; }
.announce.taboo { color: #BA55D3; }
.announce.leader { color: #6c9bd2; }
.announce.sales { color: #b96; }
.announce.student { color: #b96; }
.announce.dictator { color: #5959AB; }
.announce.ruler { color: #706caa; }
.announce.warden { color: #888e7e; }
.announce.grave { color: #a6a5c4; }
.announce.liar { color: #9e8b8e; }
.announce.curse { color: #aa4c8f; }
.announce.phantom { color: #9d5b8b; }
.announce.exorcist { color: #87CEEB; }
.announce.beacon { color: #6c848d; }
.announce.wisp { color: #895b8a; }
.announce.fear { color: #aa4c8f; }
.announce.lantern { color: #9a8; }
.announce.ddd { color: #a69abd; }
.announce.fang { color: #c53d43; }
.announce.fake { color: #9d5b8b; }
.announce.fate { color: #9079ad; }
.announce.anti { color: #a58f86; }
.announce.lvupper { color: #84a2d4; }
.announce.change { color: #9d5b8b; }
.announce.predator { color: #9790a4; }
.announce.revenge { color: #c99; }

/* --- サイドバー能力結果タグ（旧版準拠） --- */
.participant .wolf { color: #c33; font-weight: bold; }
.participant .human { color: #393; }
.participant .aura { color: #c60; font-weight: bold; }
.participant .guard { color: #36c; }
.participant .defense { color: #669; }
.participant .dance { color: #c6c; }
.participant .pharmacist { color: #696; }
.participant .cure { color: #699; }
.participant .shoes { color: #963; }
.participant .cupid { color: #f6c; }
.participant .founder { color: #c90; }
.participant .zombie { color: #696; }
.participant .revenge { color: #c99; }
.participant .servant { color: #969; }
.participant .cthulhu { color: #696; }
.participant .loyal { color: #699; }
.participant .slave { color: #966; }
.participant .monster { color: #933; }
.participant .bond { color: #69c; }
.participant .successor { color: #996; }
.participant .follower { color: #9c9; }
.participant .remove { color: #c66; }
.participant .mad { color: #c33; font-weight: bold; }
.participant .poison { color: #9c3; }
.participant .paralyze { color: #cc9; }
.participant .tough { color: #c63; }
.participant .heat { color: #c30; }
.participant .cold { color: #36c; }
.participant .sick { color: #996; }
.participant .dragonball { color: #fc3; }
.participant .fortune_id { color: #669; }
.participant .fortune_skill { color: #696; }
.participant .fortune_aura { color: #c60; }
.participant .fortune_judge { color: #393; }
.participant .fortune_sub { color: #966; }
.participant .research { color: #699; }

/*


 */

body { font-family: -apple-system, "Hiragino Kaku Gothic ProN", sans-serif; background: #000; color: #ddd; margin: 0; padding: 0; overflow-x: hidden; }
a:visited, a:link { color: #bcb; text-decoration: none; }
a:hover { color: #fee; text-decoration: underline; }
.site-header, .admin-header { background: #2c3e50; color: #fff; padding: 0.6rem 1rem; }
.admin-header { background: #7d2a2a; }
.site-header .inner, .admin-header .inner { max-width: 1100px; margin: 0 auto; display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.site-header h1, .admin-header h1 { font-size: 1.2rem; margin: 0; white-space: nowrap; }
.site-header a, .admin-header a { color: #fff; }
.nav-main { display: flex; align-items: center; gap: 0.1rem; flex-wrap: wrap; flex: 1; }
.nav-main a { padding: 3px 6px; border-radius: 4px; font-size: 0.85rem; white-space: nowrap; margin: 0; }
.nav-main a:hover { background: rgba(255,255,255,0.15); }
.nav-main a.nav-active { background: rgba(255,255,255,0.18); color: #fff; font-weight: 600; border-bottom: 2px solid #60a5fa; }
.nav-user a.nav-active { background: rgba(255,255,255,0.15); color: #fff; font-weight: 600; border-radius: 4px; }
.nav-create { background: #27ae60 !important; color: #fff !important; font-weight: bold; }
.nav-create:hover { background: #2ecc71 !important; }
.nav-create.nav-active { background: #2ecc71 !important; box-shadow: 0 0 0 2px rgba(46,204,113,0.4); }
.nav-sep { color: #5a6a7a; font-size: 0.7rem; margin: 0 2px; }
.nav-user { display: flex; align-items: center; gap: 0.3rem; margin-left: auto; white-space: nowrap; }
.nav-user a { font-size: 0.82rem; padding: 3px 6px; margin: 0; }
.nav-logout { opacity: 0.7; font-size: 0.78rem !important; background: none; border: none; color: #fff; cursor: pointer; padding: 3px 6px; }
.nav-logout:hover { opacity: 1; text-decoration: underline; }
.nav-user form { display: inline; }
.nav-login { background: #3498db; padding: 4px 12px !important; border-radius: 4px; }
.site-main, .admin-main { max-width: 1100px; margin: 1rem auto; padding: 0 1rem; }
.stats { list-style: none; display: flex; gap: 1.5rem; padding: 0; }
.stats li { background: #1a1a22; color: #ddd; padding: 0.5rem 1rem; border-radius: 4px; border: 1px solid #334; }
table.list { width: 100%; border-collapse: collapse; }
table.list th, table.list td { border: 1px solid #1a1e2a; padding: 0.3rem 0.6rem; text-align: left; font-size: 0.92rem; color: #bbb; }
table.list thead { background: #12161f; }
table.list th { background: #12161f; border: 1px solid #1a1e2a; color: #9ca3af; }
.search { margin: 0.5rem 0; }
.flash { padding: 0.5rem 1rem; border-radius: 4px; margin-bottom: 0.5rem; }
.flash-notice { background: #dff0d8; color: #1e4620; }
.flash-alert  { background: #f2dede; color: #8a1f1f; }
dl.vil-meta { display: grid; grid-template-columns: 7em 1fr; gap: 0.2rem 1rem; max-width: 600px; }
dl.vil-meta dt { color: #666; }
.actions button, .actions form { display: inline-block; margin-right: 0.5rem; }
button, input[type=submit] { padding: 0.3rem 0.8rem; cursor: pointer; }
.btn-danger { background: #a01; color: #fff; border: 1px solid #c22; }
.btn-danger:hover { background: #c22; }
pre { background: #f4f4f4; padding: 0.5rem; overflow: auto; }
.site-footer { text-align: center; color: #888; padding: 1rem; font-size: 0.85rem; }

/* === Card === */
.card { background: #1e2230; border: 1px solid #2a3040; border-radius: 8px; }
.input-field { background: #2a3040; color: #dde; border: 1px solid #3a4050; border-radius: 4px; padding: 6px 10px; }

/* === 個人設定 === */
.user-settings { max-width: 720px; margin: 0 auto; padding: 24px 28px; }
.user-settings h2 { margin-top: 0; font-size: 1.4rem; color: #e8eaed; border-bottom: 2px solid #3b82f6; padding-bottom: 8px; margin-bottom: 20px; }
.user-settings fieldset { border: 1px solid #2a3040; border-radius: 8px; padding: 16px 20px; margin-bottom: 16px; background: #161a26; }
.user-settings legend { color: #8ab4f8; font-size: 0.92rem; font-weight: 600; padding: 0 8px; }
.user-settings .row { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.user-settings .row label { color: #c0c6d0; font-size: 0.9rem; cursor: pointer; }
.user-settings label { color: #c0c6d0; font-size: 0.9rem; }
.user-settings input[type="number"],
.user-settings input[type="text"],
.user-settings input[type="password"],
.user-settings select {
  background: #1e2538; color: #e0e4ea; border: 1px solid #3a4050; border-radius: 6px;
  padding: 8px 12px; font-size: 0.92rem; width: auto; min-width: 180px;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.user-settings input[type="number"]:focus,
.user-settings input[type="text"]:focus,
.user-settings input[type="password"]:focus,
.user-settings select:focus {
  border-color: #3b82f6; outline: none; box-shadow: 0 0 0 2px rgba(59,130,246,0.25);
}
.user-settings textarea {
  background: #1e2538; color: #e0e4ea; border: 1px solid #3a4050; border-radius: 6px;
  padding: 10px 12px; font-size: 0.88rem; width: 100%; box-sizing: border-box;
  resize: vertical; font-family: monospace; transition: border-color 0.2s, box-shadow 0.2s;
}
.user-settings textarea:focus {
  border-color: #3b82f6; outline: none; box-shadow: 0 0 0 2px rgba(59,130,246,0.25);
}
.user-settings input[type="checkbox"] {
  accent-color: #3b82f6; width: 16px; height: 16px; cursor: pointer;
}
.user-settings .form-actions { margin-top: 16px; }
.user-settings .btn { display: inline-block; padding: 10px 24px; border: none; border-radius: 6px; font-size: 0.95rem; font-weight: 600; cursor: pointer; transition: background 0.2s, transform 0.1s; }
.user-settings .btn:active { transform: scale(0.98); }
.user-settings .btn-primary { background: linear-gradient(135deg, #3b82f6, #2563eb); color: #fff; }
.user-settings .btn-primary:hover { background: linear-gradient(135deg, #60a5fa, #3b82f6); }
.user-settings .btn-secondary { background: #374151; color: #d1d5db; border: 1px solid #4b5563; }
.user-settings .btn-secondary:hover { background: #4b5563; }
.user-settings .badge-success { display: inline-block; background: #065f46; color: #6ee7b7; font-size: 0.78rem; padding: 2px 8px; border-radius: 4px; font-weight: 600; }
.user-settings .pw-current { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.user-settings .pw-legacy { background: #1e293b; padding: 5px 10px; border-radius: 4px; color: #6ee7b7; font-family: monospace; font-size: 0.9rem; }
.user-settings .pw-note { color: #94a3b8; font-size: 0.82rem; }
.user-settings .pw-encrypted { color: #94a3b8; font-size: 0.88rem; }

/* === ユーザ一覧グリッド === */
.user-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px 12px; }
.user-grid-item { display: flex; align-items: center; gap: 4px; padding: 3px 6px; font-size: 0.88rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.user-grid-item a { color: #8ab4f8; text-decoration: none; overflow: hidden; text-overflow: ellipsis; }
.user-grid-item a:hover { text-decoration: underline; }
.badge { font-size: 0.68rem; padding: 1px 5px; border-radius: 3px; white-space: nowrap; }
.badge-frozen { background: #1e6091; color: #b0d4f1; }
.badge-ban { background: #7f1d1d; color: #fca5a5; }

/* === BAN一覧 === */
.ban-table { width: 100%; border-collapse: collapse; }
.ban-table th { background: #1a1e2e; color: #8ab4f8; font-size: 0.82rem; text-align: left; padding: 8px 10px; border-bottom: 2px solid #2a3040; }
.ban-table td { padding: 8px 10px; border-bottom: 1px solid #2a3040; font-size: 0.88rem; }
.ban-table tr:hover { background: #252a3a; }
.ban-status-active { color: #ef4444; font-weight: bold; }
.ban-status-expired { color: #6b7280; }
.admin-section { margin-top: 24px; padding-top: 16px; border-top: 1px solid #2a3040; }
.admin-section h3 { color: #8ab4f8; font-size: 0.95rem; margin-bottom: 12px; }
.admin-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px 12px; }
.admin-grid-item { display: flex; align-items: center; gap: 6px; padding: 3px 6px; font-size: 0.88rem; }
.admin-grid-item a { color: #8ab4f8; text-decoration: none; }
.rank-master { color: #f59e0b; font-weight: bold; }
.rank-admin { color: #a78bfa; font-weight: bold; }
.rank-senior { color: #34d399; }
.rank-middle { color: #60a5fa; }
.rank-junior { color: #9ca3af; }

/* === 役職一覧グリッド === */
.job-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px 8px; }
.job-grid-item { font-size: 0.88rem; padding: 3px 6px; }
.job-grid-item a { color: #8ab4f8; text-decoration: none; }
.job-grid-item a:hover { text-decoration: underline; }

/* === 役職戦歴テーブル === */
.job-stats-table { width: 100%; border-collapse: collapse; margin-bottom: 16px; }
.job-stats-table th { background: #1a1e2e; color: #8ab4f8; font-size: 0.82rem; text-align: center; padding: 6px 8px; border-bottom: 2px solid #2a3040; }
.job-stats-table td { padding: 6px 8px; border-bottom: 1px solid #2a3040; font-size: 0.82rem; text-align: center; }
.job-stats-table tr:hover { background: #252a3a; }
.win_rec { color: #34d399; font-weight: bold; }
.lose_rec { color: #ef4444; font-weight: bold; }
.alive_rec { color: #60a5fa; font-weight: bold; }
.dead_rec { color: #9ca3af; font-weight: bold; }
.mania { color: #aa6; }
.love { color: #f472b6; }
.revenge { color: #fb923c; }
.servant { color: #a78bfa; }
.cthulhu { color: #4ade80; }
.loyal { color: #60a5fa; }
.slave { color: #9ca3af; }
.believe { color: #fbbf24; }
.zombie { color: #6ee7b7; }
.bond { color: #c084fc; }
.monster { color: #f87171; }
.ddd { color: #818cf8; }
.black { color: #fca5a5; }
.mad { color: #f97316; }

/* === 認証画面（ログイン・新規登録） === */
.auth-container { display: flex; justify-content: center; align-items: flex-start; padding: 3rem 1rem 2rem; }
.auth-card { max-width: 420px; width: 100%; padding: 2rem 2.5rem; }
.auth-header { text-align: center; margin-bottom: 1.5rem; }
.auth-header h2 { font-size: 1.6rem; color: #e8eaed; margin: 0 0 0.3rem; }
.auth-subtitle { color: #8a8f9a; font-size: 0.9rem; margin: 0; }
.auth-alert { background: #3a1f1f; border: 1px solid #7f1d1d; color: #fca5a5; padding: 0.6rem 1rem; border-radius: 6px; margin-bottom: 1rem; font-size: 0.88rem; }
.auth-errors { margin: 0; padding-left: 1.2rem; }
.auth-form { display: flex; flex-direction: column; gap: 1rem; }
.auth-field { display: flex; flex-direction: column; gap: 0.3rem; }
.auth-label { color: #9ca3af; font-size: 0.85rem; font-weight: 600; }
.auth-input { width: 100%; padding: 10px 14px; font-size: 0.95rem; box-sizing: border-box; transition: border-color 0.2s; }
.auth-input:focus { border-color: #3b82f6; outline: none; box-shadow: 0 0 0 2px rgba(59,130,246,0.25); }
.auth-remember { display: flex; align-items: center; gap: 0.5rem; }
.auth-remember-label { color: #9ca3af; font-size: 0.85rem; cursor: pointer; }
.auth-actions { margin-top: 0.5rem; }
.auth-btn { width: 100%; padding: 10px; border: none; border-radius: 6px; font-size: 1rem; font-weight: 600; cursor: pointer; transition: background 0.2s, transform 0.1s; }
.auth-btn:active { transform: scale(0.98); }
.auth-btn-primary { background: linear-gradient(135deg, #3b82f6, #2563eb); color: #fff; }
.auth-btn-primary:hover { background: linear-gradient(135deg, #60a5fa, #3b82f6); }
.auth-footer { text-align: center; margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid #2a3040; }
.auth-footer p { color: #6b7280; font-size: 0.88rem; margin: 0; }
.auth-link { color: #60a5fa !important; font-weight: 600; }
.auth-link:hover { color: #93c5fd !important; text-decoration: underline; }

/* === エントリー画面 キャラグリッド === */
.entry .form-entry fieldset { border: 1px solid #334; padding: 0.8rem; margin-bottom: 1rem; background: #151520; color: #ddd; }
.entry .form-entry legend { font-weight: bold; padding: 0 0.4rem; }
.entry-preview {
  display: flex; align-items: center; gap: 1rem;
  padding: 0.8rem 1rem; margin-bottom: 0.8rem;
  background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
  color: #fff; border-radius: 6px;
  box-shadow: inset 0 2px 6px rgba(0,0,0,0.3);
}
.entry-preview img {
  background: #fff;
  border: 3px solid #f1c40f;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.4);
  width: 80px; height: auto; object-fit: contain;
}
.entry-preview-name { font-size: 1.25rem; font-weight: bold; color: #ffeaa7; text-shadow: 0 1px 2px rgba(0,0,0,0.5); }

.char-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(76px, 1fr));
  gap: 4px;
  border: 1px solid #34495e; padding: 8px;
  background: #2c3e50;
  border-radius: 4px;
}
.char-cell {
  display: flex; flex-direction: column; align-items: center;
  padding: 4px 2px; border: 2px solid transparent; border-radius: 4px;
  cursor: pointer; background: #1f2330;
  font-size: 0.78rem; line-height: 1.2; color: #dde;
  transition: background 0.1s, border-color 0.1s, transform 0.1s;
}
.char-cell:hover { background: #2a3040; border-color: #f39c12; transform: translateY(-1px); }
.char-cell input[type="radio"] { display: none; }
.char-cell img { display: block; width: 52px; height: auto; object-fit: contain; background: #0f1118; border-radius: 3px; }
.char-cell .char-name { margin-top: 3px; text-align: center; word-break: break-all; max-width: 72px; color: #d9e0f0; font-weight: 500; }
.char-cell.char-selected { background: #f39c12; border-color: #d35400; }
.char-cell.char-selected .char-name { color: #fff; text-shadow: 0 1px 1px rgba(0,0,0,0.4); }
.char-cell.char-used { opacity: 0.3; cursor: not-allowed; filter: grayscale(95%); }
.char-cell.char-used:hover { background: #1f2330; border-color: transparent; transform: none; }

.entry .form-entry input,
.entry .form-entry textarea,
.entry .form-entry select {
  background: #222;
  color: #eee;
  border: 1px solid #445;
}

/* 参加者リストのキャラアイコン */
.player-list { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 6px; }
.player-list li { display: flex; align-items: center; gap: 8px; padding: 6px 10px; background: #181c28; color: #dde; border: 1px solid #2a3040; border-radius: 6px; }
.player-list img { width: 36px; height: 36px; object-fit: cover; background: #223; border-radius: 4px; border: 1px solid #334; }

/* お知らせ: 全行1em左余白、text-indent:0（base.cssのp{text-indent:1em}を上書き） */
.announce p { text-indent: 0; padding-left: 1em; }

/* 発言吹き出し内: 全行1em左余白（base.cssのp{text-indent:1em}で1行目だけずれる問題を修正） */
.message [class$="_body1"] p { text-indent: 0; padding-left: 1em; }

/* ===== レスポンシブ対応 ===== */
@media (max-width: 768px) {
  /* ヘッダー */
  .site-header .inner { flex-direction: column; align-items: flex-start; gap: 4px; }
  .nav-main { gap: 2px; }
  .nav-main a { font-size: 0.78rem; padding: 2px 4px; }
  .nav-user { margin-left: 0; flex-wrap: wrap; }
  .nav-sep { display: none; }

  /* メイン */
  .site-main, .admin-main { padding: 0 8px; overflow-x: hidden; }

  /* 統計 */
  .stats { flex-wrap: wrap; gap: 0.5rem; }
  .stats li { padding: 0.3rem 0.6rem; font-size: 0.85rem; }

  /* 村カード */
  .vil-card { padding: 6px 8px; }
  .vil-card-header { flex-wrap: wrap; gap: 4px; }
  .vil-card-summary { gap: 4px; }
  .vil-summary-chip { font-size: 0.75rem; padding: 1px 5px; }
  .vil-card-body { gap: 3px; }
  .vil-tag { font-size: 0.7rem; padding: 1px 4px; }

  /* 村作成フォーム */
  .mkvil-grid { grid-template-columns: 1fr 1fr; }
  .mkvil-row { flex-direction: column; align-items: flex-start; }

  /* 説明書 */
  .doc-toc-links { gap: 3px; }
  .doc-toc-link { font-size: 0.75rem; padding: 2px 6px; }

  /* テーブル */
  .job-stats-table { font-size: 0.75rem; }
  .job-stats-table th, .job-stats-table td { padding: 4px 4px; }

  /* 設定フォーム */
  .user-settings .row { flex-direction: column; align-items: flex-start; }

  /* 過去ログ検索 */
  .villist-search input[type=text], .loglist-search input[type=text] { width: 100%; }
  .search-row { flex-direction: column; }
  .search-row input[type=text], .search-row select { width: 100%; }

  /* 村show: ゲーム画面 */
  .msg { gap: 0.3rem; padding: 0.3rem 0.4rem; }
  .msg-face { width: 32px; height: 32px; }
  .msg-meta { font-size: 0.75rem; }
  .msg-content { font-size: 0.88rem; }
  nav.day-tabs { gap: 2px; }
  nav.day-tabs .day-tab { padding: 3px 6px; font-size: 0.78rem; }
  .player-list { gap: 4px; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
  .player-list li { padding: 0.3rem 0.5rem; font-size: 0.85rem; }
  .player-list img { width: 28px; height: 28px; }
  .vote-result-table { font-size: 0.8rem; }
  .vote-result-table td { padding: 0.15rem 0.3rem; }
  .legacy-log-embed { padding: 4px; }
  .vil-info-details > summary { font-size: 0.88rem; }

  /* 発言テーブル・フォーム・アナウンス レスポンシブ */
  .message { width: 100% !important; max-width: 100% !important; border-collapse: collapse; overflow-wrap: break-word; box-sizing: border-box; }
  .message td[width="64"] { width: 40px; }
  .message td[width="464"] { width: auto !important; max-width: 0; }
  .message td[width="16"] { width: 16px; }
  .message td:not([width]) { width: 0; padding: 0; overflow: hidden; }
  .message .speaker-icon { max-width: 40px; height: auto; }
  .message .char_name { font-size: 0.82rem; }
  .message .time { font-size: 0.7rem; }
  .action-box { width: 100% !important; max-width: 100% !important; box-sizing: border-box; }
  .action-box-balloon { max-width: calc(100% - 76px); margin-left: 6px; }
  .announce { width: 100% !important; max-width: 100% !important; box-sizing: border-box; }
  .balloon-row, .msg-form-row { padding: 2px 4px 4px; }
  .balloon-controls, .msg-form-controls, .msg-form-buttons { gap: 3px; }
  .voice-option { font-size: 0.78rem; }
  .action-sub-form { gap: 0.3rem; }
  .action-sub-form input[type="text"] { min-width: 80px; }
  /* プレビュー */
  .message-preview { margin-left: 0; max-width: 100%; }
  .message-preview .message { width: 100% !important; }
  .message-preview .message td[width="464"] { width: auto; }
  .message-preview .message td:not([width]) { width: 0; padding: 0; overflow: hidden; }
  .announce { font-size: 0.85rem; word-break: break-word; }
  .announce p { padding-left: 1em; text-indent: 0; }
  .vil-summary-bar { flex-wrap: wrap; gap: 4px 8px; }
  .vil-summary-item { font-size: 0.82rem; }
  .vil-detail-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 6px; }
  .vil-detail-card { padding: 8px 10px; }
  .vil-detail-card-icon { font-size: 1.1rem; width: 28px; }
  .msg-pagination { flex-wrap: wrap; gap: 0.2rem; }
  .mkvil_index { font-size: 0.82rem; }
  .mkvil_index td { padding: 2px 4px; }
  .participant-face { width: 28px; }
  .participant-name { max-width: 100px; font-size: 12px !important; }
  /* 見出し帯・検索・エントリー */
  .game-board { overflow-x: clip; max-width: 100%; box-sizing: border-box; }
  .game-board h3 { overflow: hidden; word-break: break-word; max-width: 100%; box-sizing: border-box; }
  .game-board h3 small { display: block; margin-top: 4px; }
  .vil-group { max-width: 100%; box-sizing: border-box; word-break: break-word; }
  .villist-search input[type=text] { min-width: 0; width: 100%; }
  .search-row { flex-wrap: wrap; }
  table.vil_index { font-size: 0.75rem; }
  table.vil_index td { padding: 3px 4px; }
}

@media (max-width: 480px) {
  .site-header { padding: 0.4rem 0.5rem; }
  .nav-main a { font-size: 0.72rem; }
  .mkvil-grid { grid-template-columns: 1fr; }
  .vil-card-count { font-size: 0.8rem; }
  .stats { flex-direction: column; gap: 4px; }
  .stats li { text-align: center; }
  h2 { font-size: 1.1rem; }
  .game-board h3 { font-size: 0.95rem; }
  .msg-face { width: 24px; height: 24px; }
  .msg { font-size: 0.82rem; }
  nav.day-tabs .day-tab { padding: 2px 4px; font-size: 0.72rem; }
  .player-list img { width: 24px; height: 24px; }
  .player-list li { font-size: 0.8rem; padding: 0.2rem 0.4rem; }
  .player-list { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }

  /* 発言テーブル・フォーム 480px */
  .message { width: 100% !important; max-width: 100% !important; }
  .message td[width="64"] { width: 28px; }
  .message td[width="464"] { width: auto !important; max-width: 0; }
  .message td[width="16"] { width: 16px; }
  .message td:not([width]) { width: 0; padding: 0; overflow: hidden; }
  .message .speaker-icon { max-width: 28px; height: auto; }
  .message .char_name { font-size: 0.75rem; }
  .message .time { font-size: 0.65rem; }
  .action-box-balloon { max-width: calc(100% - 76px); }
  .voice-option { font-size: 0.72rem; }
  .balloon-controls, .msg-form-controls { gap: 2px; }
  .action-sub-form { flex-direction: column; align-items: stretch; }
  .action-sub-form input[type="text"] { min-width: unset; width: 100%; }
  /* プレビュー */
  .message-preview { margin-left: 0; max-width: 100%; }
  .message-preview .message { width: 100% !important; }
  .message-preview .message td[width="64"] { width: 28px; }
  .message-preview .message td[width="464"] { width: auto; }
  .message-preview .message .speaker-icon { max-width: 28px; height: auto; }
  .message-preview .message td:not([width]) { width: 0; padding: 0; overflow: hidden; }
  /* 通報 */
  .report-form { flex-direction: column; align-items: stretch; }
  .report-form select, .report-form textarea { width: 100%; }
  .announce { font-size: 0.8rem; padding: 4px 6px; width: 100% !important; max-width: 100% !important; box-sizing: border-box; }
  .vil-summary-bar { gap: 3px 6px; }
  .vil-summary-item { font-size: 0.78rem; }
  .vil-detail-grid { grid-template-columns: 1fr 1fr; gap: 5px; }
  .vil-detail-card-label { font-size: 0.68rem; }
  .vil-detail-card-value { font-size: 0.82rem; }
  .participant-face { width: 22px; }
  .participant-name { max-width: 80px; font-size: 11px !important; }
  .participant { gap: 2px; font-size: 0.75em; }
  /* 見出し帯・検索・エントリー 480px */
  .game-board h3 small { font-size: 0.8rem; }

  table.vil_index { font-size: 0.7rem; }
  table.vil_index td { padding: 2px 3px; }
  .recent-records-grid { gap: 4px; grid-template-columns: 1fr; }
}