/* --- デザイントークン --- */
:root {
  --bg-primary: #0A0A0B;
  --bg-card: #141417;
  --bg-hover: #1A1A1E;
  --border: #1F1F23;
  --accent: #FF5C00;
  --text-primary: #FFFFFF;
  --text-secondary: #A0A0A8;
  --text-muted: #6B6B70;
  --green: #22C55E;
  --yellow: #F59E0B;
  --blue: #3B82F6;
  --red: #EF4444;
}

/* --- ステータスバッジ（pill型） --- */
.badge-firing {
  background: #22C55E18;
  color: #22C55E;
  border-radius: 100px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 500;
  display: inline-flex;
  justify-content: center;
  width: 100px;
}

.badge-alert {
  background: #FF5C0018;
  color: #FF5C00;
  border-radius: 100px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 500;
  display: inline-flex;
  justify-content: center;
  width: 100px;
}

.badge-watching {
  background: #6B6B7018;
  color: #6B6B70;
  border-radius: 100px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 500;
  display: inline-flex;
  justify-content: center;
  width: 100px;
}

/* --- Tier バッジ（背景色付き） --- */
.tier-a-badge {
  background: #22C55E20;
  color: #22C55E;
  font-family: 'DM Mono', monospace;
  font-size: 12px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 4px;
  display: inline-flex;
}
.tier-b-badge {
  background: #3B82F620;
  color: #3B82F6;
  font-family: 'DM Mono', monospace;
  font-size: 12px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 4px;
  display: inline-flex;
}
.tier-watch-badge {
  background: #F59E0B20;
  color: #F59E0B;
  font-family: 'DM Mono', monospace;
  font-size: 12px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 4px;
  display: inline-flex;
}
.tier-pass-badge {
  background: #6B6B7020;
  color: #6B6B70;
  font-family: 'DM Mono', monospace;
  font-size: 12px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 4px;
  display: inline-flex;
}

/* --- レポートセクションカード --- */
.report-card {
  background: #141417;
  border-radius: 12px;
  border: 1px solid #1F1F23;
  padding: 24px 28px;
}

/* --- セクション本文の微調整 --- */
.section-body h3 {
  font-size: 14px;
  font-weight: 600;
  color: #ADADB0;
  margin: 1rem 0 0.5rem;
}

.section-body h3:first-child {
  margin-top: 0;
}

/* テーブルをカード内でフル幅＆角丸 */
.section-body table {
  width: 100%;
  border-collapse: collapse;
  margin: 0.75rem 0;
}

.section-body th {
  background: #0A0A0B;
  border-bottom: 1px solid #1F1F23;
  text-align: left;
  padding: 10px 14px;
  font-size: 11px;
  color: #6B6B70;
  font-weight: 600;
  white-space: nowrap;
}

.section-body td {
  border-bottom: 1px solid #1F1F23;
  padding: 10px 14px;
  color: #ADADB0;
  font-size: 13px;
}

.section-body tr:hover {
  background: #1A1A1E;
}

.section-body a {
  color: #FF5C00;
  text-decoration: none;
}

.section-body a:hover {
  text-decoration: underline;
}

/* --- Tier セクション（レガシー: 単一HTML blob 用） --- */
.tier-a {
  border-left: 3px solid #FF5C0080;
  padding-left: 16px;
}

.tier-b {
  border-left: 3px solid #3B82F680;
  padding-left: 16px;
}

.tier-watch {
  border-left: 3px solid #F59E0B80;
  padding-left: 16px;
}

.tier-pass {
  border-left: 3px solid #6B6B7080;
  padding-left: 16px;
}

.tier-da {
  border-left: 3px solid #EF444480;
  padding-left: 16px;
  background: #EF444408;
}

/* --- セクション別 箇条書きマーカー色 --- */
[data-section="risk"] .md-content li::marker { color: #F59E0B; }
[data-section="da"] .md-content li::marker { color: #EF4444; }
[data-section="eval"] .md-content li::marker { color: #FF5C00; }
[data-section="hard-guard"] .md-content li::marker { color: #22C55E; }
[data-section="judgment"] .md-content li::marker { color: #FF5C00; }
[data-section="tier-a"] .md-content li::marker { color: #22C55E; }
[data-section="tier-b"] .md-content li::marker { color: #3B82F6; }
[data-section="watch"] .md-content li::marker { color: #F59E0B; }
[data-section="pass"] .md-content li::marker { color: #6B6B70; }
[data-section="default"] .md-content li::marker { color: #FF5C00; }

/* --- MDコンテンツ --- */
.md-content h1 {
  font-family: 'Instrument Serif';
  font-size: 2rem;
  margin: 1.5rem 0 1rem;
}

.md-content h2 {
  font-family: 'Instrument Serif';
  font-size: 1.5rem;
  margin: 1.5rem 0 0.75rem;
  color: #A0A0A8;
}

.md-content h3 {
  font-size: 1.125rem;
  font-weight: 600;
  margin: 1rem 0 0.5rem;
}

.md-content p {
  color: #A0A0A8;
  line-height: 1.75;
  margin-bottom: 0.75rem;
}

.md-content ul {
  list-style: disc;
  padding-left: 1.5rem;
  color: #A0A0A8;
}

.md-content ol {
  list-style: decimal;
  padding-left: 1.5rem;
  color: #A0A0A8;
}

.md-content li {
  margin-bottom: 0.25rem;
  line-height: 1.75;
}

.md-content strong {
  color: #FFFFFF;
}

.md-content a {
  color: #FF5C00;
  text-decoration: none;
}

.md-content a:hover {
  text-decoration: underline;
}

.md-content blockquote {
  border-left: 3px solid #1F1F23;
  padding-left: 1rem;
  color: #6B6B70;
  margin: 1rem 0;
}

.md-content code {
  font-family: 'DM Mono', monospace;
  background: #141417;
  padding: 0.125rem 0.375rem;
  border-radius: 0.25rem;
  font-size: 0.875rem;
  color: #FF5C00;
}

.md-content pre {
  background: #141417;
  border: 1px solid #1F1F23;
  border-radius: 0.5rem;
  padding: 1rem;
  overflow-x: auto;
  margin: 1rem 0;
}

.md-content pre code {
  background: transparent;
  padding: 0;
  color: #A0A0A8;
}

/* --- MDテーブル（ダークテーマ） --- */
.md-content table,
.md-table {
  width: 100%;
  border-collapse: collapse;
  margin: 1rem 0;
}

.md-content th,
.md-table th {
  background: #141417;
  border-bottom: 2px solid #1F1F23;
  text-align: left;
  padding: 8px 12px;
  font-size: 0.75rem;
  color: #6B6B70;
  text-transform: uppercase;
}

.md-content td,
.md-table td {
  border-bottom: 1px solid #1F1F23;
  padding: 8px 12px;
  color: #A0A0A8;
}

.md-content tr:hover,
.md-table tr:hover {
  background: #1A1A1E;
}

/* --- フラッシュアニメーション（SSE株価更新） --- */
@keyframes flash-green {
  0% { background: #22C55E30; }
  100% { background: transparent; }
}

@keyframes flash-red {
  0% { background: #EF444430; }
  100% { background: transparent; }
}

.flash-up {
  animation: flash-green 0.8s ease-out;
}

.flash-down {
  animation: flash-red 0.8s ease-out;
}

/* --- スクロールバー非表示 --- */
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }
.scrollbar-hide::-webkit-scrollbar { display: none; }

/* --- フィルタータグ（角丸6px） --- */
.filter-tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 12px;
  border: 1px solid #2A2A2E;
  color: #ADADB0;
  cursor: pointer;
  transition: all 0.15s;
  background: #1A1A1D;
}

.filter-tag:hover {
  border-color: #FF5C00;
  color: #FF5C00;
}

.filter-tag.active {
  background: #FF5C00;
  color: white;
  border-color: #FF5C00;
  font-weight: 600;
}

/* --- テーブルコンテナ --- */
.table-container {
  background: #111113;
  border-radius: 12px;
  border: 1px solid #1F1F23;
  overflow: hidden;
}

.table-container table {
  width: 100%;
  table-layout: fixed;
}

.table-container thead {
  background: #141417;
}

.table-container thead th {
  padding: 14px 24px;
  font-size: 11px;
  font-weight: 600;
  color: #6B6B70;
  letter-spacing: 0.5px;
  text-align: left;
  border-bottom: 1px solid #1F1F23;
  white-space: nowrap;
}

.table-container tbody td {
  padding: 16px 24px;
  border-bottom: 1px solid #1F1F23;
}

.table-container tbody tr:hover {
  background: #1A1A1E;
}

/* --- フィルタラベル --- */
.filter-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #6B6B70;
  font-size: 12px;
  font-weight: 500;
}

/* --- 判定タグドット --- */
.tag-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
  flex-shrink: 0;
}

/* --- カタリストドット（小） --- */
.cat-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  display: inline-block;
  flex-shrink: 0;
}

/* --- 展開行詳細パネル --- */
.detail-pane {
  display: flex;
  gap: 24px;
  padding: 20px 24px;
  box-sizing: border-box;
}

.detail-info-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.detail-info-label {
  color: #6B6B70;
  font-size: 12px;
}

.detail-info-value {
  font-family: 'DM Mono', monospace;
  font-size: 12px;
  font-weight: 500;
  color: #FFFFFF;
}

/* --- セクションヘッダー --- */
.section-header {
  display: flex;
  align-items: center;
  gap: 8px;
}

.section-header-icon {
  color: #FF5C00;
}

.section-header-title {
  font-size: 14px;
  font-weight: 600;
  color: #FFFFFF;
}

.section-header-count {
  font-size: 12px;
  color: #6B6B70;
}

/* --- Tier 評価ボックス --- */
.tier-eval-box {
  border-radius: 8px;
  padding: 12px 14px;
}

.tier-eval-box.go {
  background: #22C55E10;
  border: 1px solid #22C55E20;
}

.tier-eval-box.watch {
  background: #F59E0B10;
  border: 1px solid #F59E0B20;
}

.tier-eval-box.pass {
  background: #6B6B7010;
  border: 1px solid #6B6B7020;
}

/* --- スクロールバー（ダークテーマ） --- */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: #0A0A0B;
}

::-webkit-scrollbar-thumb {
  background: #1F1F23;
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: #6B6B70;
}

/* --- ポジション入力フィールド --- */
.pos-input {
  background: #111113;
  border: 1px solid #2A2A2E;
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 12px;
  color: #FFFFFF;
  font-family: 'DM Mono', monospace;
  outline: none;
  transition: border-color 0.15s;
  width: 100%;
}

.pos-input::placeholder {
  color: #4A4A4E;
}

.pos-input:focus {
  border-color: #FF5C00;
}

/* --- Exit Monitor 展開パネル --- */
.exit-detail-pane {
  display: flex;
  gap: 24px;
  padding: 20px 24px;
  box-sizing: border-box;
}

/* --- Exit danger badge アニメーション --- */
@keyframes pulse-exit {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.6; }
}

.animate-pulse {
  animation: pulse-exit 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

/* --- Active catalyst card --- */
@keyframes pulse-active-border {
  0%, 100% { border-color: rgba(255, 92, 0, 0.3); }
  50% { border-color: rgba(255, 92, 0, 0.7); }
}

@keyframes pulse-active-dot {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255, 92, 0, 0.6); }
  50% { box-shadow: 0 0 0 3px rgba(255, 92, 0, 0); }
}

.catalyst-active {
  animation: pulse-active-border 3s ease-in-out infinite;
  box-shadow: 0 0 12px rgba(255, 92, 0, 0.08);
}

.active-badge {
  background: linear-gradient(135deg, #FF5C00, #FF8A3D);
  color: #fff;
  letter-spacing: 0.05em;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.active-dot {
  animation: pulse-active-dot 2s ease-in-out infinite;
}

.scrollbar-hide {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.scrollbar-hide::-webkit-scrollbar {
  display: none;
}
