:root {
  --bg: #0d1117;
  --fg: #c9d1d9;
  --accent: #58a6ff;
  --border: #30363d;
  --tier-elite: #d63384;
  --tier-good: #198754;
  --tier-avg: #6c757d;
  --tier-filler: #495057;
  --tier-avoid: #dc3545;
  --header-bg: #161b22;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  background: var(--bg);
  color: var(--fg);
  line-height: 1.5;
  padding: 1rem;
  max-width: 1400px;
  margin: 0 auto;
}

h1, h2, h3 { color: #f0f6fc; margin-bottom: 0.5rem; }
h1 { font-size: 1.5rem; border-bottom: 1px solid var(--border); padding-bottom: 0.5rem; }
h2 { font-size: 1.2rem; margin-top: 1.5rem; }

a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

nav {
  display: flex;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--border);
}
nav a { font-weight: 600; }

.filters {
  display: flex;
  gap: 0.5rem;
  margin: 0.75rem 0;
  flex-wrap: wrap;
}
.filters button, .filters select {
  background: var(--header-bg);
  color: var(--fg);
  border: 1px solid var(--border);
  padding: 0.25rem 0.75rem;
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.85rem;
}
.filters button:hover, .filters button.active {
  border-color: var(--accent);
  color: var(--accent);
}
.filters a { text-decoration: none; }

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
  margin-bottom: 1.5rem;
}
th {
  background: var(--header-bg);
  padding: 0.4rem 0.6rem;
  text-align: left;
  border-bottom: 2px solid var(--border);
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}
th:hover { color: var(--accent); }
td {
  padding: 0.3rem 0.6rem;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
tr:hover { background: var(--header-bg); }

/* Tier break rows — visual separator between tiers */
tr.tier-break td {
  padding: 0;
  height: 6px;
  background: var(--border);
  border: none;
}

.num { text-align: right; font-variant-numeric: tabular-nums; }

.tier-elite { color: var(--tier-elite); font-weight: 600; }
.tier-good { color: var(--tier-good); }
.tier-avg { color: var(--tier-avg); }
.tier-filler { color: var(--tier-filler); }
.tier-avoid { color: var(--tier-avoid); opacity: 0.7; }

.target-available { }
.target-mine { background: rgba(25, 135, 84, 0.15); }
.target-taken { opacity: 0.4; text-decoration: line-through; }

/* Draft day compact table */
table.draft-compact { font-size: 0.8rem; }
table.draft-compact td { padding: 0.2rem 0.5rem; }
table.draft-compact th { padding: 0.3rem 0.5rem; }

.player-card {
  background: var(--header-bg);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 1.5rem;
  margin: 1rem 0;
}
.player-card h2 { margin-top: 0; }
.stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  gap: 0.75rem;
  margin-top: 1rem;
}
.stat-box {
  text-align: center;
  padding: 0.5rem;
  background: var(--bg);
  border-radius: 4px;
}
.stat-box .label { font-size: 0.75rem; color: var(--tier-avg); }
.stat-box .value { font-size: 1.2rem; font-weight: 600; }

code {
  background: var(--header-bg);
  padding: 0.1rem 0.3rem;
  border-radius: 3px;
  font-size: 0.85em;
}

/* Print styles */
@media print {
  body { background: white; color: black; font-size: 10pt; padding: 0; }
  nav, .filters, .no-print { display: none; }
  table { font-size: 9pt; }
  th { background: #eee; }
  td, th { padding: 2pt 4pt; border: 1px solid #ccc; }
  tr.tier-break td { height: 4px; background: #999; }
  .tier-elite { color: #d63384; }
  .tier-good { color: #198754; }
  .tier-avg { color: #333; }
  .tier-filler { color: #999; }
  .tier-avoid { color: #dc3545; }
  a { color: black; }
  h1 { font-size: 14pt; }
  h2 { font-size: 12pt; }
  .player-card { border: 1px solid #ccc; break-inside: avoid; }
  table.draft-compact { font-size: 8pt; }
}