body {
  margin: 0; min-height: 100vh; font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  background: #0f172a; color: #e2e8f0;
}
a { color: #38bdf8; }
.ta-hidden { display: none; }

.ta-center { min-height: 100vh; display: flex; align-items: center; justify-content: center; }
.ta-wrap { max-width: 480px; padding: 32px; box-sizing: border-box; }
.ta-login-wrap { text-align: center; }
.ta-eyebrow { color: #38bdf8; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 8px; }
h1 { font-size: 1.6rem; margin: 0 0 4px; }
p { color: #94a3b8; line-height: 1.5; }

input {
  display: block; width: 100%; box-sizing: border-box; margin: 10px 0; padding: 10px 12px;
  border-radius: 6px; border: 1px solid #334155; background: #1e293b; color: #e2e8f0; font-size: 0.95rem;
}
button {
  padding: 10px 14px; border-radius: 6px; border: none; background: #38bdf8;
  color: #0f172a; font-weight: 600; cursor: pointer; font-size: 0.9rem;
}
#ta-login-btn { width: 100%; }
.ta-error { color: #f87171; font-size: 0.85rem; margin-top: 8px; }

.ta-shell { max-width: 960px; margin: 0 auto; padding: 24px; box-sizing: border-box; }
.ta-topbar { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.ta-topbar h1 { margin-right: auto; }
.ta-topbar-right { display: flex; align-items: center; gap: 14px; }
.ta-badge {
  background: #1e293b; border: 1px solid #334155; border-radius: 999px; padding: 4px 12px;
  font-size: 0.8rem; color: #94a3b8;
}
.ta-tiny-link { font-size: 0.85rem; }

.ta-tabs { display: flex; gap: 4px; border-bottom: 1px solid #334155; margin-bottom: 20px; flex-wrap: wrap; }
.ta-tab {
  background: none; border: none; color: #94a3b8; padding: 10px 16px; cursor: pointer;
  font-size: 0.9rem; border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.ta-tab:hover { color: #e2e8f0; }
.ta-tab-active { color: #38bdf8; border-bottom-color: #38bdf8; font-weight: 600; }

.ta-panel {
  background: #1e293b; border: 1px solid #334155; border-radius: 10px; padding: 24px; min-height: 200px; margin-bottom: 24px;
}
.ta-loading { color: #64748b; }
.ta-placeholder { color: #64748b; text-align: center; padding: 40px 20px; }
.ta-placeholder-icon { font-size: 2rem; margin-bottom: 8px; }
.ta-denied { color: #f87171; text-align: center; padding: 40px 20px; }

.ta-table { width: 100%; border-collapse: collapse; }
.ta-table th, .ta-table td { text-align: left; padding: 8px 10px; border-bottom: 1px solid #334155; font-size: 0.9rem; }
.ta-table th { color: #94a3b8; font-weight: 500; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.03em; }
.ta-table select, .ta-table input[type="text"] { margin: 0; padding: 6px 8px; font-size: 0.85rem; }
.ta-row-actions { display: flex; gap: 6px; }
.ta-btn-danger { background: #f87171; }
.ta-btn-small { padding: 6px 10px; font-size: 0.8rem; }

.ta-add-row { display: flex; gap: 8px; margin-top: 16px; flex-wrap: wrap; }
.ta-add-row input, .ta-add-row select { width: auto; flex: 1 1 140px; margin: 0; }

.ta-btn-ghost { background: #334155; color: #e2e8f0; }

.ta-filter-bar { display: flex; gap: 8px; margin: 4px 0 16px; flex-wrap: wrap; }
.ta-filter-bar input, .ta-filter-bar select {
  width: auto; flex: 1 1 160px; margin: 0; padding: 8px 10px;
  border-radius: 6px; border: 1px solid #334155; background: #0f172a; color: #e2e8f0; font-size: 0.85rem;
}

.ta-tier { padding: 2px 8px; border-radius: 999px; font-size: 0.75rem; border: 1px solid #334155; }
.ta-tier-unverified { color: #94a3b8; }
.ta-tier-verified { color: #38bdf8; border-color: #38bdf8; }
.ta-tier-trusted { color: #34d399; border-color: #34d399; }
.ta-tier-expert { color: #fbbf24; border-color: #fbbf24; }

.ta-metric { color: #94a3b8; }
.ta-metric-warn { color: #f87171; font-weight: 600; }

.ta-status { padding: 2px 8px; border-radius: 999px; font-size: 0.75rem; border: 1px solid #334155; }
.ta-status-open { color: #f87171; border-color: #f87171; }
.ta-status-investigating { color: #fbbf24; border-color: #fbbf24; }
.ta-status-resolved { color: #34d399; border-color: #34d399; }

.ta-clickable-row { cursor: pointer; }
.ta-clickable-row:hover { background: rgba(56, 189, 248, 0.06); }

.ta-history-row td { background: #17233b; padding: 14px; }
.ta-subtable { width: 100%; border-collapse: collapse; margin-top: 4px; }
.ta-subtable th, .ta-subtable td { text-align: left; padding: 6px 8px; border-bottom: 1px solid #334155; font-size: 0.82rem; }
.ta-subtable th { color: #94a3b8; font-weight: 500; text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.03em; }

.ta-dispute-detail p { margin: 0 0 8px; color: #cbd5e1; }
.ta-dispute-manage { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; align-items: center; }
.ta-dispute-manage select, .ta-dispute-manage input { margin: 0; flex: 1 1 140px; }

.ta-dispute-log-form { align-items: center; }