/* ── KabuBase 共通CSS変数・コンポーネント ── */
/* 段階的に各ページから移行していく基盤ファイル */

:root {
  /* Colors */
  --kb-bg:         #0a0f1e;
  --kb-surface:    #0f172a;
  --kb-surface-2:  #111827;
  --kb-border:     #1e293b;
  --kb-border-2:   #334155;
  --kb-border-3:   #475569;

  --kb-text:       #f1f5f9;
  --kb-text-2:     #e2e8f0;
  --kb-text-3:     #cbd5e1;
  --kb-text-muted: #94a3b8;
  --kb-text-dim:   #64748b;
  --kb-text-dimmer:#475569;
  --kb-text-faint: #334155;

  --kb-blue:       #60a5fa;
  --kb-blue-2:     #93c5fd;
  --kb-blue-3:     #3b82f6;

  --kb-green:      #4ade80;
  --kb-yellow:     #fbbf24;
  --kb-red:        #f87171;

  /* Radius */
  --kb-r-sm:  4px;
  --kb-r-md:  6px;
  --kb-r-lg:  8px;
  --kb-r-xl:  10px;

  /* Transitions */
  --kb-t-fast: all .15s ease;
}

/* ── 共通ボタン ── */
.kb-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  font-size: 12px;
  border: 1px solid var(--kb-border-2);
  background: var(--kb-surface);
  color: var(--kb-text-muted);
  border-radius: var(--kb-r-md);
  cursor: pointer;
  white-space: nowrap;
  touch-action: manipulation;
  transition: var(--kb-t-fast);
  min-height: 36px;
  line-height: 1;
}
.kb-btn:hover {
  background: var(--kb-border);
  color: var(--kb-text-2);
}
.kb-btn.primary {
  border-color: var(--kb-blue-3);
  color: var(--kb-blue-2);
  background: #0f1a30;
}
.kb-btn.primary:hover {
  background: #13233f;
}

/* ── 共通バッジ ── */
.kb-badge {
  display: inline-block;
  font-size: 10px;
  padding: 2px 7px;
  border-radius: 3px;
  border: 1px solid var(--kb-border-2);
  color: var(--kb-text-muted);
  font-weight: 500;
}

/* ── ローディングアニメーション ── */
@keyframes kb-pulse {
  0%, 100% { opacity: .4; }
  50%       { opacity: 1; }
}
.kb-loading-dots::after {
  content: '…';
  animation: kb-pulse 1.2s ease-in-out infinite;
  display: inline-block;
}

/* ── スクロールバー（Webkit） ── */
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #1e293b; border-radius: 2px; }
::-webkit-scrollbar-thumb:hover { background: #334155; }
