/* ====== Lives ページ (セッション 11.1) ====== */

/* 必須マーク (フォーム共通として汎用化) */
.required-mark {
  color: var(--accent);
  font-size: var(--text-xs);
  margin-left: var(--space-1);
}

/* ====== /lives/ 一覧 (セッション 11.5.5 強化) ====== */
.live-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.live-card {
  display: block;
  padding: var(--space-4) var(--space-5);
  padding-left: calc(var(--space-5) + 4px);  /* 左ボーダー幅分のオフセット */
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-left-width: 4px;
  border-left-color: var(--border);
  border-radius: var(--radius-lg);
  text-decoration: none;
  color: inherit;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
  transition: border-color 200ms ease, transform 200ms ease, box-shadow 200ms ease;
}
.live-card:hover {
  border-color: var(--accent);
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
  text-decoration: none;
  color: inherit;
}
/* ステータスごとの左ボーダー色分け */
.live-card--scheduled        { border-left-color: var(--accent); }
.live-card--completed        { border-left-color: var(--success); }
.live-card--past_unconfirmed { border-left-color: var(--warning); }
.live-card--cancelled        { border-left-color: var(--error); }
.live-card--postponed        { border-left-color: var(--info, #9eb5c4); }

.live-card-head {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  margin-bottom: var(--space-2);
}
.live-card-date-block {
  margin-left: auto;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}
.live-card-date {
  color: var(--fg-muted);
  font-size: var(--text-sm);
}
.live-card-countdown {
  font-size: var(--text-sm);
  color: var(--accent);
  font-weight: 500;
}
.live-card-elapsed {
  font-size: var(--text-sm);
}
.live-card-title {
  font-size: var(--text-lg);
  font-weight: 600;
  color: var(--fg-base);
  letter-spacing: var(--tracking-tight);
  margin: var(--space-1) 0;
}
.live-card-meta {
  display: flex;
  gap: var(--space-4);
  flex-wrap: wrap;
  margin-top: var(--space-2);
  font-size: var(--text-sm);
  color: var(--fg-muted);
  align-items: center;
}
.live-card-meta i { margin-right: 4px; }
.live-card-profit {
  font-size: var(--text-base);
  font-weight: 500;
  display: inline-flex;
  align-items: center;
}
.live-card-profit.live-profit-pos { color: var(--success); }
.live-card-profit.live-profit-neg { color: var(--error); }

/* ステータスバッジ */
.live-status-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px var(--space-2);
  border-radius: var(--radius-sm);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: var(--tracking-wide);
}
.live-status--scheduled        { background: rgba(237, 180, 180, 0.18); color: var(--accent); }
.live-status--past_unconfirmed { background: var(--bg-surface-2); color: var(--warning); border: 1px dashed var(--warning); }
.live-status--completed        { background: var(--bg-surface-2); color: var(--fg-muted); }
.live-status--cancelled        { background: var(--bg-surface-2); color: var(--error); text-decoration: line-through; }
.live-status--postponed        { background: var(--bg-surface-2); color: var(--warning); }

.live-profit-pos { color: var(--success); }
.live-profit-neg { color: var(--error); }

/* ====== /lives/<id> 詳細 ====== */
.live-detail-headmeta {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: var(--space-1);
  flex-wrap: wrap;
}

/* サブタブ (identity と同じ視覚的方針) */
.lives-tabs {
  display: flex;
  gap: var(--space-1);
  border-bottom: 1px solid var(--border);
  margin-bottom: var(--space-5);
  overflow-x: auto;
}
.lives-tab {
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  padding: var(--space-3) var(--space-4);
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--fg-muted);
  cursor: pointer;
  white-space: nowrap;
  transition: color var(--transition-fast), border-color var(--transition-fast);
}
.lives-tab:hover { color: var(--fg-base); }
.lives-tab.is-active {
  color: var(--accent);
  border-bottom-color: var(--accent);
}
.lives-tab-panel[hidden] { display: none; }

/* 概要タブ */
.lives-overview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: var(--space-4);
}
.lives-overview-cell {
  padding: var(--space-3) var(--space-4);
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}
.lives-overview-label {
  font-size: var(--text-xs);
  color: var(--fg-subtle);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  margin-bottom: var(--space-1);
}
.lives-overview-value {
  font-size: var(--text-md);
  color: var(--fg-base);
}

/* セットリストタブ */
.lives-setlist-list {
  list-style: none;
  margin: 0 0 var(--space-5) 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  counter-reset: setlist;
}
.lives-setlist-item {
  display: grid;
  /* drag-handle / num / body / duration / delete-form の 5 列(Phase 3.x 3.x-4 で duration を独立) */
  grid-template-columns: auto auto 1fr auto auto;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-2) var(--space-3);
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  transition: border-color var(--transition-fast);
}
.lives-setlist-item:hover { border-color: var(--border-strong); }
.lives-setlist-item.is-ghost { opacity: 0.5; }
.lives-setlist-item.is-dragging { background: var(--bg-surface-2); }
.lives-setlist-num {
  width: 28px;
  text-align: right;
  color: var(--fg-muted);
  font-size: var(--text-sm);
}
.lives-setlist-body { min-width: 0; }
.lives-setlist-title { color: var(--fg-base); font-size: var(--text-base); }
.lives-setlist-title a { color: var(--fg-base); text-decoration: none; border-bottom: 1px solid transparent; }
.lives-setlist-title a:hover { border-bottom-color: var(--accent); }
.lives-setlist-notes { font-size: var(--text-xs); margin-top: 2px; }

.lives-setlist-add {
  padding: var(--space-4);
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.lives-setlist-add-actions {
  display: flex;
  justify-content: flex-end;
}

/* 収支タブ */
.lives-finance-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: var(--space-4);
  margin-bottom: var(--space-5);
}
.lives-finance-cell {
  padding: var(--space-4);
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}
.lives-finance-label {
  font-size: var(--text-xs);
  color: var(--fg-subtle);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  margin-bottom: var(--space-1);
}
.lives-finance-value {
  font-size: var(--text-2xl);
  font-weight: 500;
  color: var(--fg-base);
  font-variant-numeric: tabular-nums;
}

.lives-finance-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-5);
}
.lives-finance-col {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.lives-finance-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.lives-finance-item {
  position: relative;
  padding: var(--space-3) var(--space-4);
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}
.lives-finance-item-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-3);
}
.lives-finance-cat {
  font-size: var(--text-sm);
  color: var(--fg-muted);
}
.lives-finance-amount {
  font-size: var(--text-md);
  font-weight: 500;
  color: var(--fg-base);
}
.lives-finance-delete {
  position: absolute;
  top: var(--space-2);
  right: var(--space-2);
  visibility: hidden;
  color: var(--fg-subtle);
}
.lives-finance-item:hover .lives-finance-delete { visibility: visible; }
.lives-finance-delete:hover { color: var(--error); }

.lives-finance-add {
  padding: var(--space-4);
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

/* E-1: 768→767 に正規化(標準のモバイル上限は 767px。768px はデスクトップ側) */
@media (max-width: 767px) {
  .lives-finance-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .lives-overview-grid { grid-template-columns: 1fr; }
  .lives-finance-summary { grid-template-columns: 1fr 1fr; }
  .lives-finance-delete { visibility: visible; }
}


/* ====== 5分刻みの時刻ピッカー (hour + minute select) ======
   <input type="time"> は Native picker が 1分刻みで表示してしまうため、
   2つの <select> + hidden input で実装。 */
.time-picker {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
}
.time-picker .input {
  display: inline-block;
  width: auto;
  min-width: 64px;
  /* select の右側矢印スペースを確保 */
  padding-right: var(--space-3);
  text-align: center;
  text-align-last: center; /* Chrome/Edge: select の表示テキスト中央揃え */
}
.time-picker-sep {
  color: var(--fg-muted);
  font-family: var(--font-mono);
  font-size: var(--text-md);
  user-select: none;
}


/* ====== セッション 11.2: 声掛けリスト ====== */

.outreach-privacy-note {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  padding: var(--space-2) var(--space-3);
  background: var(--bg-surface-2);
  border-radius: var(--radius-sm);
  font-size: var(--text-xs);
  margin-bottom: var(--space-4);
}

.outreach-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: var(--space-3);
  margin-bottom: var(--space-4);
}
.outreach-stat-cell {
  padding: var(--space-3);
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}
.outreach-stat-label {
  font-size: var(--text-xs);
  color: var(--fg-subtle);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
}
.outreach-stat-value {
  font-size: var(--text-xl);
  font-weight: 500;
  color: var(--fg-base);
  font-variant-numeric: tabular-nums;
  margin-top: var(--space-1);
}
.outreach-stat-sub {
  font-size: var(--text-xs);
  color: var(--fg-muted);
}

.outreach-actions {
  display: flex;
  gap: var(--space-2);
  flex-wrap: wrap;
  margin-bottom: var(--space-3);
}
.outreach-actions button[disabled] { opacity: 0.5; cursor: not-allowed; }

.outreach-add-form {
  padding: var(--space-4);
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  margin-bottom: var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.outreach-add-form[hidden] { display: none; }
.outreach-add-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--space-3);
}

.outreach-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.outreach-item {
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  transition: border-color var(--transition-fast);
}
.outreach-item:hover { border-color: var(--border-strong); }
.outreach-item.is-ghost { opacity: 0.5; }
.outreach-item.is-dragging { background: var(--bg-surface-2); }

.outreach-item-head {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
}
.outreach-item-toggle {
  flex: 1;
  display: flex;
  align-items: center;
  gap: var(--space-3);
  background: transparent;
  border: none;
  text-align: left;
  cursor: pointer;
  padding: var(--space-1) 0;
  color: var(--fg-base);
  font-family: inherit;
  font-size: inherit;
}
.outreach-item-name { font-weight: 500; }
.outreach-item-rel { font-size: var(--text-sm); }
.outreach-thanks-mark { color: var(--accent); font-size: 14px; }
.outreach-item-caret {
  margin-left: auto;
  color: var(--fg-subtle);
  transition: transform var(--transition-fast);
}
.outreach-item.is-expanded .outreach-item-caret { transform: rotate(180deg); }

.outreach-item-body {
  padding: var(--space-3) var(--space-4);
  border-top: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.outreach-item-body[hidden] { display: none; }
.outreach-item-footer {
  display: flex;
  justify-content: space-between;
  gap: var(--space-2);
}
.outreach-item-delete:hover { color: var(--error); }

/* ステータスバッジ (色分け) */
.outreach-status-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px var(--space-2);
  border-radius: var(--radius-sm);
  font-size: var(--text-xs);
  font-weight: 500;
}
.outreach-status--not_yet     { background: var(--bg-surface-2); color: var(--fg-muted); }
.outreach-status--reached_out { background: var(--bg-surface-2); color: var(--fg-base); border: 1px solid var(--border); }
.outreach-status--confirmed   { background: rgba(168, 200, 154, 0.18); color: var(--success); }
.outreach-status--tentative   { background: rgba(232, 200, 150, 0.18); color: var(--warning); }
.outreach-status--declined    { background: rgba(212, 149, 149, 0.18); color: var(--error); }
.outreach-status--attended    { background: rgba(237, 180, 180, 0.18); color: var(--accent); }

.checkbox-label {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-sm);
  cursor: pointer;
  padding-top: var(--space-3);  /* label の高さ合わせ */
}

/* ====== セッション 11.2: チケットタブ ====== */

.ticket-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: var(--space-3);
  margin-bottom: var(--space-4);
}
.ticket-summary-cell {
  padding: var(--space-3) var(--space-4);
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}
.ticket-summary-label {
  font-size: var(--text-xs);
  color: var(--fg-subtle);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  margin-bottom: var(--space-1);
}
.ticket-summary-value {
  font-size: var(--text-xl);
  font-weight: 500;
  color: var(--fg-base);
  font-variant-numeric: tabular-nums;
}

.ticket-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--space-3);
  margin-bottom: var(--space-4);
}
.ticket-card {
  padding: var(--space-4);
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  transition: border-color var(--transition-fast);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.ticket-card:hover { border-color: var(--border-strong); }
.ticket-card.is-ghost { opacity: 0.5; }
.ticket-card.is-dragging { background: var(--bg-surface-2); }
.ticket-card-head {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
.ticket-type-input {
  flex: 1;
  font-weight: 500;
}
.ticket-card-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-3);
}
.ticket-card-sales {
  font-size: var(--text-md);
  color: var(--accent);
  font-weight: 500;
  padding-top: var(--space-3);
}
.ticket-card-progress { width: 100%; }
.ticket-card-progress-bar {
  width: 100%;
  height: var(--space-1);
  background: var(--bg-surface-2);
  border-radius: 1px;
  overflow: hidden;
}
.ticket-card-progress-fill {
  height: 100%;
  background: var(--accent);
  transition: width var(--transition-slow);
}

.ticket-add-form {
  padding: var(--space-4);
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.ticket-add-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: var(--space-3);
}

/* 収支タブの内訳表示 */
.lives-finance-breakdown {
  display: flex;
  gap: var(--space-3);
  flex-wrap: wrap;
  margin-top: var(--space-2);
  font-size: var(--text-xs);
  color: var(--fg-muted);
}

/* ====== ノルマ式入力 (セッション 11.2 改善2) ====== */

.quota-input {
  margin-top: var(--space-4);
  padding-top: var(--space-4);
  border-top: 1px solid var(--border);
}
.quota-input-mode-row {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  flex-wrap: wrap;
  margin-bottom: var(--space-3);
}
.form-field-label {
  font-size: var(--text-sm);
  color: var(--fg-muted);
  font-weight: 500;
}
.quota-mode-radio {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  font-size: var(--text-sm);
  cursor: pointer;
  color: var(--fg-base);
}
.quota-fields-fixed[hidden],
.quota-fields-unit[hidden] { display: none; }
.quota-fields-unit-grid {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  align-items: end;
  gap: var(--space-2);
}
.quota-mul, .quota-eq {
  font-size: var(--text-lg);
  color: var(--fg-muted);
  padding-bottom: var(--space-2);
  text-align: center;
}
.quota-total {
  padding: var(--space-2) var(--space-3);
  background: var(--bg-surface-2);
  border-radius: var(--radius-md);
  font-size: var(--text-md);
  font-weight: 500;
  color: var(--fg-base);
  text-align: right;
  min-height: calc(var(--text-base) + var(--space-4) + 2px);
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

@media (max-width: 480px) {
  .quota-fields-unit-grid {
    grid-template-columns: 1fr;
    gap: var(--space-2);
  }
  .quota-mul, .quota-eq { display: none; }
  .ticket-card-grid { grid-template-columns: 1fr; }
}


/* ====== 過去ライブからコピー モーダル (セッション 11.2) ====== */
.outreach-copy-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-4);
}
.outreach-copy-modal[hidden] { display: none; }
.outreach-copy-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  border: none;
  cursor: pointer;
}
.outreach-copy-card {
  position: relative;
  width: 100%;
  max-width: 560px;
  max-height: 80vh;
  background: var(--bg-surface);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-xl);
  padding: var(--space-5);
  display: flex;
  flex-direction: column;
  z-index: 1;
}
.outreach-copy-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin-bottom: var(--space-2);
}
.outreach-copy-title {
  margin: 0;
  font-size: var(--text-md);
  font-weight: 600;
  color: var(--fg-base);
  letter-spacing: var(--tracking-tight);
}
.outreach-copy-note {
  font-size: var(--text-sm);
  margin-bottom: var(--space-3);
}
.outreach-copy-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  overflow-y: auto;
}
.outreach-copy-item form { margin: 0; }
.outreach-copy-source {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  align-items: center;
  gap: var(--space-3);
  width: 100%;
  padding: var(--space-3) var(--space-4);
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  cursor: pointer;
  text-align: left;
  color: var(--fg-base);
  font-family: inherit;
  font-size: var(--text-sm);
  transition: border-color var(--transition-fast), background var(--transition-fast);
}
.outreach-copy-source:hover {
  border-color: var(--accent);
  background: var(--bg-surface-2);
}
.outreach-copy-source:focus-visible {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--focus-ring);
}
.outreach-copy-source-date { color: var(--fg-muted); }
.outreach-copy-source-title {
  color: var(--fg-base);
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.outreach-copy-source-count { color: var(--accent); }
.outreach-copy-source-arrow { color: var(--fg-subtle); }

@media (max-width: 480px) {
  .outreach-copy-source {
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
  }
  .outreach-copy-source-arrow { display: none; }
}


/* ====== セッション 11.6: 概要タブ整理 + インライン編集 ====== */

/* ツールバー (編集ボタン + 編集中バナー) */
.overview-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--space-4);
  gap: var(--space-3);
}
.overview-toolbar-status {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  padding: 2px var(--space-2);
  background: var(--bg-surface-2);
  color: var(--accent);
  border-radius: var(--radius-sm);
  font-size: var(--text-xs);
  letter-spacing: var(--tracking-wide);
}
.overview-toolbar-status[hidden] { display: none; }
.overview-toolbar-actions { margin-left: auto; }

/* 編集モード中の panel 背景 */
[data-overview-panel].is-editing {
  position: relative;
}
[data-overview-panel].is-editing > .overview-edit {
  background: var(--bg-surface-2);
  border-radius: var(--radius-lg);
  padding: var(--space-3);
}

/* 6グループ表示 */
/* セッション 11.5.5: 2カラムレイアウト + 重要度別差別化
   PC幅 (>=1024): 左 (基本/出演/メモ) / 右 (タイムス/集客/経済)
   モバイル: 1カラム、DOM順 (基本→タイムス→出演→集客→経済→メモ) を維持 */
.overview-groups {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4);
  align-items: start;
}
@media (min-width: 1024px) {
  .overview-groups {
    grid-template-columns: 1fr 1fr;
    grid-auto-flow: row dense;
  }
  .overview-groups [data-overview-col="left"]  { grid-column: 1; }
  .overview-groups [data-overview-col="right"] { grid-column: 2; }
}
.overview-group {
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: var(--space-4) var(--space-5);
}
/* 重要度: 大カード (基本情報、経済) — 強調 */
.overview-group--major {
  background: var(--bg-surface);
  border-color: var(--border-strong);
  padding: var(--space-5);
}
/* 重要度: 中カード (出演、集客) — デフォルト */
.overview-group--mid { /* デフォルト維持 */ }
/* 重要度: 補助カード (タイムスケジュール、メモ) — 控えめ */
.overview-group--minor {
  background: var(--bg-surface-2);
  border-color: var(--border);
  padding: var(--space-3) var(--space-4);
}
.overview-group--minor .overview-group-title {
  font-size: var(--text-sm);
  color: var(--fg-muted);
}

.overview-group-title {
  margin: 0 0 var(--space-3) 0;
  font-size: var(--text-base);
  font-weight: 600;
  color: var(--fg-base);
  letter-spacing: var(--tracking-tight);
  padding-bottom: var(--space-2);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
.overview-group-icon {
  font-size: var(--text-base);
  color: var(--fg-muted);
}
/* 大カード内の重要値を強調表示 */
.overview-cell-value--lg {
  font-size: var(--text-lg);
  font-weight: 500;
}
.overview-group-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: var(--space-4);
}
.overview-cell--wide { grid-column: 1 / -1; }
.overview-cell-label {
  font-size: var(--text-xs);
  color: var(--fg-subtle);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  margin-bottom: var(--space-1);
}
.overview-cell-value {
  font-size: var(--text-md);
  color: var(--fg-base);
}

.overview-memo {
  margin-top: var(--space-3);
}
.overview-memo-body {
  margin-top: var(--space-2);
  font-size: var(--text-base);
  color: var(--fg-base);
  line-height: var(--leading-relaxed);
}
.overview-memo--accent {
  border-left: 2px solid var(--accent);
  padding-left: var(--space-3);
}

/* 編集モード フォーム */
.overview-edit[hidden] { display: none; }
.overview-edit {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}
.overview-edit > .stats-form-section {
  margin: 0;
}
.overview-edit-error {
  padding: var(--space-2) var(--space-3);
  background: var(--bg-surface);
  border: 1px solid var(--error);
  border-radius: var(--radius-sm);
  color: var(--error);
  font-size: var(--text-sm);
}
.overview-edit-error[hidden] { display: none; }

.overview-edit-bar {
  position: sticky;
  bottom: var(--space-3);
  display: flex;
  justify-content: flex-end;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4);
  background: var(--bg-surface);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  z-index: 10;
}

/* ====== セッション 11.6: セットリスト拡張 ====== */

/* サマリーバー */
.setlist-summary {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-5);
  padding: var(--space-3) var(--space-4);
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-3);
  font-size: var(--text-sm);
}
.setlist-summary-cell {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-2);
}
.setlist-summary-value {
  font-size: var(--text-md);
  font-weight: 500;
  color: var(--fg-base);
}
.setlist-summary-sub {
  font-size: var(--text-xs);
}

/* アイテムタイプ別表示 */
.setlist-item-icon {
  margin-right: var(--space-1);
  color: var(--fg-muted);
}
.setlist-item-type-tag {
  display: inline-block;
  padding: 1px var(--space-2);
  margin-right: var(--space-2);
  background: var(--bg-surface-2);
  border-radius: var(--radius-sm);
  font-size: var(--text-xs);
  color: var(--fg-muted);
  letter-spacing: var(--tracking-wide);
}

/* タイプ別の色キー (controlled by template) */
.setlist-item--default { /* 通常の楽曲、デフォルト維持 */ }
.setlist-item--muted {
  background: var(--bg-surface-2);
  opacity: 0.85;
}
.setlist-item--muted .lives-setlist-title { color: var(--fg-muted); }
.setlist-item--muted .setlist-item-icon { color: var(--fg-subtle); }
.setlist-item--info {
  border-left: 2px solid var(--info, var(--fg-muted));
}
.setlist-item--info .setlist-item-icon { color: var(--info, var(--fg-muted)); }
.setlist-item--accent {
  border-left: 2px solid var(--accent);
}
.setlist-item--accent .setlist-item-icon { color: var(--accent); }

.setlist-item-duration {
  color: var(--fg-muted);
  font-size: var(--text-sm);
  padding: 0 var(--space-2);
}

/* encore_marker 専用デザイン */
.setlist-encore-marker {
  display: grid;
  grid-template-columns: auto 1fr auto 1fr auto;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-2) var(--space-3);
  margin: var(--space-2) 0;
}
.setlist-encore-marker.is-ghost { opacity: 0.5; }
.setlist-encore-marker.is-dragging { background: var(--bg-surface-2); }
.setlist-encore-line {
  height: 1px;
  background: repeating-linear-gradient(
    to right,
    var(--accent) 0 6px,
    transparent 6px 12px
  );
}
.setlist-encore-label {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  color: var(--accent);
  font-weight: 600;
  letter-spacing: var(--tracking-wide);
  font-size: var(--text-sm);
  padding: var(--space-1) var(--space-3);
}

/* --info 用フォールバック (theme.css に未定義の場合) */
:root { --info: #9eb5c4; }
[data-theme="light"] { --info: #5e7585; }

@media (max-width: 480px) {
  .overview-toolbar { flex-direction: row; }
  .setlist-summary { gap: var(--space-3); }
  .setlist-encore-marker {
    grid-template-columns: auto 1fr auto;
    grid-template-rows: auto auto;
  }
  .setlist-encore-line { display: none; }
}

/* ============================================================
   Phase 3.x サブセッション 3.x-4: セットリスト入力 UI 拡張
   - 予定時間の 分:秒 2 input
   - 連番チェックボックス(楽曲以外)
   - 連番から外れたアイテムのスタイル
   ============================================================ */
.setlist-duration-input {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  max-width: 14rem;
}
.setlist-duration-input .input {
  flex: 1;
  min-width: 0;
}
.setlist-duration-sep {
  font-weight: 600;
  color: var(--fg-muted);
}

/* Phase 3.x 3.x-4 Step C: 予定時間のインライン編集 */
.setlist-item-duration[data-duration-display] {
  cursor: pointer;
  padding: 2px 6px;
  border-radius: var(--radius-sm);
  border: 1px dashed transparent;
  transition: border-color 120ms, background 120ms;
}
.setlist-item-duration[data-duration-display]:hover,
.setlist-item-duration[data-duration-display]:focus-visible {
  border-color: var(--border-strong, var(--bg-surface-2));
  background: var(--bg-surface-2);
  outline: none;
}
.setlist-item-duration[data-duration-display].is-editing {
  cursor: text;
  background: var(--bg-surface-2);
  border-color: var(--accent);
}
.setlist-duration-edit {
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
.setlist-duration-edit input {
  width: 3em;
  padding: 1px 4px;
  font: inherit;
  font-family: var(--font-mono);
  border: 1px solid var(--border-strong, var(--bg-surface-2));
  background: var(--bg-base);
  color: inherit;
  border-radius: var(--radius-sm);
  text-align: center;
  -moz-appearance: textfield;
}
.setlist-duration-edit input::-webkit-outer-spin-button,
.setlist-duration-edit input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.setlist-numbering-toggle {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  font-size: var(--text-xs);
  cursor: pointer;
  margin-top: var(--space-1);
}
.setlist-numbering-toggle input[type="checkbox"] {
  cursor: pointer;
}
.lives-setlist-item.no-number .lives-setlist-num {
  /* 連番から外れたアイテムは番号欄を視覚的に薄く(画面のみ) */
  opacity: 0.25;
}

/* ============================================================
   Phase 3.x サブセッション 3.x-4: ステージ用印刷
   主用途: ステージ上での視認(演奏中の確認、最優先)
   副用途: 楽屋・リハでの事前確認
   ============================================================ */

/* ===== 画面表示時(印刷バー)===== */
.setlist-print-bar {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  background: var(--bg-surface-2);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-3);
  flex-wrap: wrap;
}
.setlist-print-bar-label {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  font-size: var(--text-sm);
}
.setlist-print-fit-toggle {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-sm);
  margin-left: auto;
  cursor: pointer;
}
.setlist-print-fit-toggle input[type="checkbox"] {
  cursor: pointer;
}

/* 印刷ヘッダー・合計時間: 画面では非表示、印刷時のみ表示 */
.setlist-print-header,
.setlist-print-total {
  display: none;
}

/* ===== @media print: 印刷専用スタイル ===== */
@media print {
  /* 全要素に色出力を強制(ブラウザの「背景色を出力しない」デフォルトを上書き).
     これがないと黒背景 + 白文字が「白背景 + 黒文字」に変換されてしまう. */
  * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* --- 全画面の chrome を非表示 --- */
  .app-sidebar,
  .app-header,
  .mobile-header,
  .mobile-tabs,
  .mobile-more-sheet,
  .lives-tabs,
  .page-header,
  .breadcrumb,
  .back-link,
  .setlist-print-bar,            /* 印刷ボタン自体は印刷時に不要 */
  .setlist-summary,              /* 画面用サマリは印刷時非表示(末尾の print-total に置換) */
  .lives-setlist-add,            /* 追加フォーム不要 */
  .drag-handle,                  /* 並べ替えハンドル不要 */
  .lives-setlist-item form,      /* 削除ボタン不要 */
  .setlist-encore-marker form,   /* アンコール削除ボタン不要 */
  .lives-setlist-notes,          /* コメント不要(設計原則7: 情報を絞る) */
  .setlist-item-icon,            /* タイプアイコン不要 */
  .setlist-item-type-tag,        /* タイプタグ不要 */
  .setlist-numbering-toggle {    /* 連番チェックボックス不要 */
    display: none !important;
  }
  /* 連番から外れたアイテムは番号欄を空表示(スペースは確保して左端を揃える) */
  .lives-setlist-item.no-number .lives-setlist-num {
    visibility: hidden !important;
    opacity: 1 !important;       /* 画面用の薄い opacity を解除 */
  }

  /* --- セットリストパネルだけ表示(他タブは設計原則18 含めて非表示)--- */
  .lives-tab-panel:not([data-lives-panel="setlist"]) {
    display: none !important;
  }
  .lives-tab-panel[data-lives-panel="setlist"][hidden] {
    display: block !important;
  }

  /* --- ベースレイアウトをリセット --- */
  body,
  .app-shell,
  .app-main,
  .app-content,
  .lives-tab-panel,
  .lives-setlist-wrapper {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    max-width: none !important;
    width: 100% !important;
    background: white !important;
    color: black !important;
  }

  /* --- 印刷ヘッダー(ライブタイトル + 日付・会場、scale 連動)--- */
  .setlist-print-header {
    display: block !important;
    margin-bottom: calc(8mm * var(--print-font-scale, 1));
    padding-bottom: calc(3mm * var(--print-font-scale, 1));
    border-bottom: 1pt solid #999;
  }
  .setlist-print-title {
    font-size: calc(20pt * var(--print-font-scale, 1));
    font-weight: 600;
    margin: 0 0 2mm 0;
    line-height: 1.2;
  }
  .setlist-print-meta {
    font-size: calc(10pt * var(--print-font-scale, 1));
    opacity: 0.6;
  }

  /* --- セットリスト本体(--print-font-scale で 1 ページ収め対応)--- */
  .lives-setlist-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .lives-setlist-item {
    display: flex !important;
    align-items: baseline !important;
    gap: calc(8mm * var(--print-font-scale, 1)) !important;
    /* 縦詰め: 5mm → 3.5mm で 1 ページに収まる項目数を増やす */
    padding: calc(3.5mm * var(--print-font-scale, 1)) 0 !important;
    border-bottom: none !important;
    background: transparent !important;
    page-break-inside: avoid;
    border-left: none !important;
  }
  .lives-setlist-num {
    font-size: calc(24pt * var(--print-font-scale, 1)) !important;
    font-weight: 600 !important;
    min-width: 1.6em !important;
    text-align: right !important;
    color: inherit !important;
  }
  .lives-setlist-body {
    flex: 1 !important;
  }
  .lives-setlist-title {
    font-size: calc(24pt * var(--print-font-scale, 1)) !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    display: block !important;
  }
  .lives-setlist-title a,
  .lives-setlist-title span {
    color: inherit !important;
    text-decoration: none !important;
  }
  /* 時間表示: タイトルの約 55%、控えめ(黒背景時は opacity 補正で見やすく) */
  .setlist-item-duration {
    font-size: calc(13pt * var(--print-font-scale, 1)) !important;
    opacity: 0.55 !important;
    margin-left: auto !important;
    font-weight: 400 !important;
  }

  /* --- アンコール区切り --- */
  .setlist-encore-marker {
    display: flex !important;
    align-items: center !important;
    gap: calc(6mm * var(--print-font-scale, 1)) !important;
    padding: calc(8mm * var(--print-font-scale, 1)) 0 calc(3mm * var(--print-font-scale, 1)) !important;
    page-break-after: avoid;
    background: transparent !important;
  }
  .setlist-encore-label {
    font-size: calc(16pt * var(--print-font-scale, 1)) !important;
    font-weight: 500 !important;
    letter-spacing: 0.12em !important;
    color: inherit !important;
  }
  .setlist-encore-label i {
    display: none !important;
  }
  .setlist-encore-line {
    flex: 1 !important;
    border-bottom: 1pt solid currentColor !important;
    opacity: 0.5;
    height: 0;
  }

  /* --- 末尾の合計時間(控えめ、scale 連動)--- */
  .setlist-print-total {
    display: block !important;
    text-align: right;
    font-size: calc(10pt * var(--print-font-scale, 1));
    opacity: 0.6;
    margin-top: calc(6mm * var(--print-font-scale, 1));
    padding-top: calc(3mm * var(--print-font-scale, 1));
    border-top: 1pt solid #999;
  }

  /* --- 配色テーマ A: 白背景 + 黒文字(明るい照明下、デフォルト)--- */
  body.print-stage-light,
  body.print-stage-light .lives-tab-panel,
  body.print-stage-light .lives-setlist-wrapper,
  body.print-stage-light .lives-setlist-item {
    background: white !important;
    color: black !important;
  }

  /* --- 配色テーマ B: 黒背景 + 白文字(暗いステージ照明、眩しくない)
     全要素・全子孫(<a> 含む)に color: white を強制継承する.
     ブラウザの a タグ色や Lethonaut の --accent ピンクが優先されない対策. --- */
  body.print-stage-dark,
  body.print-stage-dark .lives-tab-panel,
  body.print-stage-dark .lives-setlist-wrapper,
  body.print-stage-dark .lives-setlist-item,
  body.print-stage-dark .setlist-print-header,
  body.print-stage-dark .setlist-print-total,
  body.print-stage-dark .setlist-encore-marker {
    background: black !important;
  }
  /* 文字色は子孫まで全部 white に. (label, span, a, i すべて) */
  body.print-stage-dark,
  body.print-stage-dark *,
  body.print-stage-dark a,
  body.print-stage-dark a:link,
  body.print-stage-dark a:visited,
  body.print-stage-dark .lives-setlist-num,
  body.print-stage-dark .lives-setlist-title,
  body.print-stage-dark .lives-setlist-title a,
  body.print-stage-dark .lives-setlist-title span,
  body.print-stage-dark .setlist-item-duration,
  body.print-stage-dark .setlist-encore-label,
  body.print-stage-dark .setlist-encore-label span,
  body.print-stage-dark .setlist-print-title,
  body.print-stage-dark .setlist-print-meta,
  body.print-stage-dark .setlist-print-total,
  body.print-stage-dark .setlist-print-total span {
    color: white !important;
  }
  body.print-stage-dark .setlist-print-header,
  body.print-stage-dark .setlist-print-total {
    border-color: #ccc !important;
  }
  body.print-stage-dark .setlist-encore-line {
    border-bottom-color: white !important;
    opacity: 0.85 !important;
  }
  /* font-weight を太く(印刷時の細線レンダリング対策) */
  body.print-stage-dark .lives-setlist-num,
  body.print-stage-dark .lives-setlist-title,
  body.print-stage-dark .lives-setlist-title a,
  body.print-stage-dark .lives-setlist-title span,
  body.print-stage-dark .setlist-print-title,
  body.print-stage-dark .setlist-encore-label {
    font-weight: 700 !important;
  }
  body.print-stage-dark .setlist-item-duration {
    opacity: 0.9 !important;
    font-weight: 500 !important;
  }
  body.print-stage-dark .setlist-print-meta  { opacity: 0.85 !important; }
  body.print-stage-dark .setlist-print-total { opacity: 0.95 !important; font-weight: 500 !important; }
  /* print-color-adjust: ブラウザに背景色を出力するよう要求(プリンタ依存)*/
  body.print-stage-dark {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  /* --- A4 想定の余白(ユーザー印刷設定で上書き可)--- */
  @page {
    margin: 15mm 15mm 18mm 15mm;
  }
}