/* SatRank — shared styles for landing page and methodology */
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  background: #0a0a0f;
  color: #e0e0e8;
  line-height: 1.6;
}
.container { max-width: 960px; margin: 0 auto; padding: 0 24px; }

/* Header */
header {
  padding: 80px 0 48px;
  text-align: center;
  border-bottom: 1px solid #1a1a2e;
}
header h1 {
  font-size: 3rem;
  font-weight: 700;
  background: linear-gradient(135deg, #f7931a, #ffd93d);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
header p {
  font-size: 1.2rem;
  color: #8888a0;
  margin-top: 12px;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}
header a { color: #f7931a; text-decoration: none; }
header a:hover { text-decoration: underline; }
header .badge {
  display: inline-block;
  margin-top: 20px;
  padding: 6px 16px;
  border: 1px solid #f7931a40;
  border-radius: 20px;
  font-size: 0.85rem;
  color: #f7931a;
  background: #f7931a10;
}

/* Stats grid */
.stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
  padding: 48px 0;
}
.stat-card {
  background: #12121e;
  border: 1px solid #1e1e30;
  border-radius: 12px;
  padding: 24px;
  text-align: center;
}
.stat-card .value {
  font-size: 2rem;
  font-weight: 700;
  color: #f7931a;
}
.stat-card .label {
  font-size: 0.85rem;
  color: #6666a0;
  margin-top: 4px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.stat-card .value.loading { color: #333; }

/* L402 how-to */
.l402-flow { padding: 32px 0 0; }
.l402-flow h2 {
  font-size: 1.4rem;
  margin-bottom: 20px;
  color: #c0c0d8;
}
.l402-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}
.l402-step {
  background: #12121e;
  border: 1px solid #1e1e30;
  border-radius: 12px;
  padding: 20px;
}
.l402-step .step-num {
  display: inline-block;
  width: 28px;
  height: 28px;
  line-height: 28px;
  text-align: center;
  border-radius: 50%;
  background: #f7931a20;
  color: #f7931a;
  font-weight: 700;
  font-size: 0.85rem;
  margin-bottom: 10px;
}
.l402-step .step-title {
  font-weight: 600;
  color: #e0e0e8;
  margin-bottom: 6px;
}
.l402-step .step-desc {
  color: #8888a0;
  font-size: 0.9rem;
}
.l402-step code {
  display: inline;
  color: #f7931a;
  font-family: 'SF Mono', 'Fira Code', monospace;
  font-size: 0.85rem;
}
.l402-code {
  background: #0d0d18;
  border: 1px solid #1e1e30;
  border-radius: 8px;
  padding: 16px 20px;
  overflow-x: auto;
  font-family: 'SF Mono', 'Fira Code', monospace;
  font-size: 0.82rem;
  line-height: 1.7;
  color: #8888a0;
}
.l402-code .comment { color: #555570; }
.l402-code .cmd { color: #e0e0e8; }
.l402-code .flag { color: #f7931a; }
.l402-code .url { color: #00c853; }
.l402-code .status { color: #ff5252; }

/* Top agents */
.section { padding: 32px 0; }
.section h2 {
  font-size: 1.4rem;
  margin-bottom: 20px;
  color: #c0c0d8;
}
table {
  width: 100%;
  border-collapse: collapse;
  background: #12121e;
  border-radius: 12px;
  overflow: hidden;
}
th, td { padding: 12px 16px; text-align: left; }
th {
  background: #1a1a2e;
  color: #6666a0;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-weight: 600;
}
td { border-top: 1px solid #1a1a2e; font-size: 0.95rem; }
tr:hover td { background: #16162a; }
.score-badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 6px;
  font-weight: 600;
  font-size: 0.9rem;
}
.score-high { background: #00c85320; color: #00c853; }
.score-mid { background: #f7931a20; color: #f7931a; }
.score-low { background: #ff525220; color: #ff5252; }
.mono { font-family: 'SF Mono', 'Fira Code', monospace; font-size: 0.85rem; color: #8888a0; }
tr.clickable { cursor: pointer; }

/* Search bar */
.search-bar { position: relative; margin-bottom: 20px; }
.search-bar input {
  width: 100%;
  padding: 12px 16px 12px 42px;
  background: #12121e;
  border: 1px solid #1e1e30;
  border-radius: 10px;
  color: #e0e0e8;
  font-size: 1rem;
  outline: none;
  transition: border-color 0.2s;
}
.search-bar input:focus { border-color: #f7931a; }
.search-bar input::placeholder { color: #555570; }
.search-bar .search-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #555570;
  font-size: 1rem;
  pointer-events: none;
}
.search-bar .search-clear {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: #555570;
  font-size: 1.1rem;
  cursor: pointer;
  display: none;
  padding: 4px;
}
.search-bar .search-clear:hover { color: #e0e0e8; }

/* Agent detail panel */
.agent-detail {
  background: #12121e;
  border: 1px solid #1e1e30;
  border-radius: 12px;
  padding: 32px;
  margin-top: 20px;
  display: none;
}
.agent-detail.visible { display: block; }
.detail-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 24px;
}
.detail-header .agent-name { font-size: 1.3rem; font-weight: 600; color: #e0e0e8; }
.detail-header .agent-hash {
  font-family: 'SF Mono', 'Fira Code', monospace;
  font-size: 0.8rem;
  color: #6666a0;
  margin-top: 4px;
}
.detail-header .detail-close {
  background: none;
  border: 1px solid #1e1e30;
  border-radius: 6px;
  color: #8888a0;
  padding: 4px 12px;
  cursor: pointer;
  font-size: 0.85rem;
}
.detail-header .detail-close:hover { color: #e0e0e8; border-color: #333; }
.detail-score-big {
  font-size: 3.5rem;
  font-weight: 700;
  text-align: center;
  margin-bottom: 28px;
}
.detail-score-big .confidence {
  display: block;
  font-size: 0.85rem;
  font-weight: 400;
  color: #6666a0;
  margin-top: 2px;
}

/* Component bars */
.component-bars { margin-bottom: 28px; }
.bar-row { display: flex; align-items: center; margin-bottom: 10px; }
.bar-label { width: 90px; font-size: 0.82rem; color: #8888a0; text-transform: capitalize; }
.bar-track {
  flex: 1;
  height: 10px;
  background: #1a1a2e;
  border-radius: 5px;
  overflow: hidden;
  margin: 0 12px;
}
.bar-fill { height: 100%; border-radius: 5px; transition: width 0.4s ease; }
.bar-fill.volume { background: #f7931a; }
.bar-fill.reputation { background: #00c853; }
.bar-fill.seniority { background: #448aff; }
.bar-fill.regularity { background: #aa00ff; }
.bar-fill.diversity { background: #ff6d00; }
.bar-value {
  width: 36px;
  text-align: right;
  font-size: 0.82rem;
  font-family: 'SF Mono', 'Fira Code', monospace;
  color: #c0c0d8;
}

/* Evidence section */
.evidence-section { border-top: 1px solid #1a1a2e; padding-top: 20px; }
.evidence-section h3 {
  font-size: 0.9rem;
  color: #6666a0;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 14px;
}
.evidence-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}
.evidence-item {
  background: #0d0d18;
  border: 1px solid #1a1a2e;
  border-radius: 8px;
  padding: 14px;
}
.evidence-item .ev-label {
  font-size: 0.75rem;
  color: #555570;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  margin-bottom: 4px;
}
.evidence-item .ev-value { font-size: 0.95rem; color: #e0e0e8; }
.evidence-item a { color: #f7931a; text-decoration: none; font-size: 0.85rem; }
.evidence-item a:hover { text-decoration: underline; }
.detail-loading { text-align: center; color: #555570; padding: 40px 0; }

/* Detail teaser */
.detail-teaser { border-top: 1px solid #1a1a2e; padding-top: 20px; margin-top: 8px; }
.teaser-title { font-size: 0.85rem; color: #8888a0; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 12px; }
.teaser-grid { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.teaser-item { font-size: 0.8rem; color: #6666a0; background: #12121e; border: 1px solid #1e1e30; border-radius: 6px; padding: 4px 10px; }
.teaser-cta { margin-bottom: 12px; }
.teaser-cta code { font-size: 0.75rem; color: #f7931a; background: #1a1a2e; padding: 8px 12px; border-radius: 6px; display: block; overflow-x: auto; white-space: nowrap; }
.teaser-links { display: flex; gap: 16px; }
.teaser-links a { font-size: 0.85rem; color: #f7931a; text-decoration: none; }
.teaser-links a:hover { text-decoration: underline; }

/* Decide hero */
.decide-hero { text-align: center; padding: 40px 0 24px; }
.decide-hero h2 { font-size: 1.8rem; color: #f7931a; margin-bottom: 8px; }
.decide-subtitle { color: #8888a0; font-size: 1rem; margin-bottom: 24px; }
.decide-code-block { position: relative; background: #0a0a14; border: 1px solid #f7931a30; border-radius: 10px; padding: 16px 20px; text-align: left; margin: 0 auto 12px; max-width: 640px; }
.decide-code-block pre { margin: 0; color: #c0c0d8; font-size: 0.85rem; white-space: pre-wrap; word-break: break-all; }
.copy-btn { position: absolute; top: 10px; right: 10px; background: #1e1e30; color: #f7931a; border: 1px solid #f7931a40; border-radius: 6px; padding: 4px 12px; font-size: 0.75rem; cursor: pointer; font-family: inherit; }
.copy-btn:hover { background: #f7931a; color: #0a0a14; }
.decide-response { background: #0d0d18; border: 1px solid #1e1e30; border-radius: 10px; padding: 12px 20px; text-align: left; margin: 0 auto 12px; max-width: 640px; }
.decide-response pre { margin: 0; color: #00c853; font-size: 0.85rem; white-space: pre-wrap; }
.decide-cost { color: #f7931a; font-weight: 700; font-size: 0.9rem; }
.decide-personal { color: #8888a0; font-size: 0.85rem; margin-top: 4px; font-style: italic; }

/* SDK one-liner */
.sdk-oneliner { margin-top: 20px; padding-top: 16px; border-top: 1px solid #1a1a2e; }
.sdk-label { color: #8888a0; font-size: 0.85rem; margin-bottom: 8px; text-align: center; }
.sdk-install { text-align: center; margin-top: 8px; }
.sdk-install code { font-size: 0.8rem; color: #f7931a; background: #1a1a2e; padding: 4px 10px; border-radius: 4px; }

/* Decide → Pay → Report cycle */
.cycle-section { padding: 16px 0 32px; }
.cycle-steps { display: flex; align-items: flex-start; justify-content: center; gap: 12px; flex-wrap: wrap; }
.cycle-step { background: #12121e; border: 1px solid #1e1e30; border-radius: 10px; padding: 16px 20px; flex: 0 1 180px; text-align: center; }
.cycle-step .step-num { font-size: 1.4rem; font-weight: 700; color: #f7931a; margin-bottom: 4px; }
.cycle-step .step-title { font-size: 1rem; font-weight: 600; color: #e0e0e8; margin-bottom: 6px; }
.cycle-step .step-desc { font-size: 0.8rem; color: #6666a0; line-height: 1.4; }
.cycle-step .step-cost { font-size: 0.8rem; font-weight: 700; margin-top: 8px; }
.cycle-arrow { font-size: 1.5rem; color: #333; align-self: center; padding-top: 10px; }
.cycle-flywheel { text-align: center; color: #8888a0; font-size: 0.85rem; margin-top: 16px; font-style: italic; }

/* Fade transitions for live data updates */
.fade-out { opacity: 0; transition: opacity 0.2s ease; }
.fade-in { opacity: 1; transition: opacity 0.2s ease; }

/* API docs */
.endpoints { list-style: none; }
.endpoints li {
  padding: 12px 16px;
  background: #12121e;
  border: 1px solid #1e1e30;
  border-radius: 8px;
  margin-bottom: 8px;
  display: flex;
  gap: 12px;
  align-items: center;
}
.method {
  font-family: monospace;
  font-weight: 700;
  font-size: 0.8rem;
  padding: 2px 8px;
  border-radius: 4px;
  min-width: 48px;
  text-align: center;
}
.method-get { background: #00c85320; color: #00c853; }
.method-post { background: #f7931a20; color: #f7931a; }
.endpoint-path { font-family: monospace; color: #c0c0d8; }
.endpoint-desc { color: #6666a0; font-size: 0.85rem; margin-left: auto; }

/* Hero API section */
.api-hero { background: #0d0d18; border: 1px solid #f7931a30; border-radius: 12px; padding: 28px 24px; margin-bottom: 12px; }
.api-hero h2 { color: #f7931a; }
.endpoints-hero li { background: #14142a; border-color: #f7931a25; }
.endpoint-cost { font-size: 0.75rem; font-weight: 700; padding: 2px 10px; border-radius: 10px; background: #f7931a20; color: #f7931a; white-space: nowrap; }
.endpoint-cost.free { background: #00c85318; color: #00c853; }

/* API category tags */
.api-tag { font-size: 0.7rem; font-weight: 700; padding: 2px 8px; border-radius: 8px; vertical-align: middle; margin-left: 8px; }
.free-tag { background: #00c85318; color: #00c853; }
.paid-tag { background: #f7931a18; color: #f7931a; }

/* Header logo */
.header-logo { width: 120px; height: auto; display: block; margin: 0 auto 0.5rem; }

/* Inline style replacements */
.step-code { margin-top: 8px; }
.accent { color: #f7931a; }
.l402-code-gap { margin-top: 8px; }
.table-loading { text-align: center; color: #444; }
.section-desc { color: #8888a0; margin-bottom: 16px; font-size: 0.9rem; }

/* Skeleton loader for leaderboard rows while the API response is in-flight */
@keyframes skeleton-pulse {
  0%, 100% { opacity: 0.45; }
  50% { opacity: 0.85; }
}
.skeleton-row td {
  padding: 12px 8px;
}
.skeleton-bar {
  display: inline-block;
  height: 12px;
  background: linear-gradient(90deg, #1a1a2e 0%, #2a2a44 50%, #1a1a2e 100%);
  border-radius: 4px;
  animation: skeleton-pulse 1.4s ease-in-out infinite;
}
.skeleton-bar.w-sm { width: 28px; }
.skeleton-bar.w-md { width: 80px; }
.skeleton-bar.w-lg { width: 120px; }
.skeleton-bar.w-xl { width: 140px; }

/* Footer */
footer {
  padding: 48px 0 32px;
  text-align: center;
  color: #444460;
  font-size: 0.85rem;
  border-top: 1px solid #1a1a2e;
  margin-top: 32px;
}
footer a { color: #f7931a; text-decoration: none; }
footer a:hover { text-decoration: underline; }

/* Methodology-specific overrides */
.methodology-page .container { max-width: 800px; }
.methodology-page header { padding: 60px 0 36px; }
.methodology-page header h1 { font-size: 2.4rem; }
.methodology-page header p { font-size: 1rem; margin-top: 8px; }
.methodology-page body { line-height: 1.7; }
.methodology-page h2 {
  font-size: 1.5rem;
  color: #c0c0d8;
  margin: 40px 0 16px;
  padding-top: 16px;
  border-top: 1px solid #1a1a2e;
}
.methodology-page h3 { font-size: 1.15rem; color: #e0e0e8; margin: 24px 0 10px; }
.methodology-page p { margin-bottom: 12px; color: #c0c0d8; }
.methodology-page ul, .methodology-page ol { margin: 0 0 16px 24px; color: #c0c0d8; }
.methodology-page li { margin-bottom: 6px; }
.methodology-page strong { color: #e0e0e8; }
.methodology-page em { color: #8888a0; font-style: normal; }

code {
  font-family: 'SF Mono', 'Fira Code', monospace;
  background: #12121e;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 0.88rem;
  color: #f7931a;
}
pre {
  background: #0d0d18;
  border: 1px solid #1e1e30;
  border-radius: 8px;
  padding: 16px 20px;
  overflow-x: auto;
  font-family: 'SF Mono', 'Fira Code', monospace;
  font-size: 0.85rem;
  line-height: 1.6;
  color: #c0c0d8;
  margin-bottom: 16px;
}

.card {
  background: #12121e;
  border: 1px solid #1e1e30;
  border-radius: 10px;
  padding: 20px;
  margin-bottom: 12px;
}
.card-title { font-weight: 600; color: #f7931a; margin-bottom: 6px; }

.weight-bar {
  display: inline-block;
  height: 8px;
  border-radius: 4px;
  margin-right: 8px;
  vertical-align: middle;
}

/* Weight bar sizes and colors (methodology page) */
.wb-25 { width: 75px; }
.wb-30 { width: 90px; }
.wb-15 { width: 45px; }
.wb-volume { background: #f7931a; }
.wb-reputation { background: #00c853; }
.wb-seniority { background: #448aff; }
.wb-regularity { background: #aa00ff; }
.wb-diversity { background: #ff6d00; }

.note {
  background: #12121e;
  border-left: 3px solid #f7931a;
  padding: 12px 16px;
  margin: 16px 0;
  font-size: 0.9rem;
  color: #8888a0;
}

/* Component mini-bars in table */
.component-cell {
  min-width: 70px;
}
.mini-bar-track {
  display: inline-block;
  width: 40px;
  height: 6px;
  background: #1a1a2e;
  border-radius: 3px;
  overflow: hidden;
  vertical-align: middle;
  margin-right: 4px;
}
.mini-bar-fill {
  height: 100%;
  border-radius: 3px;
}
.mini-bar-val {
  font-size: 0.78rem;
  font-family: 'SF Mono', 'Fira Code', monospace;
  color: #8888a0;
  vertical-align: middle;
}

/* Delta indicators */
.delta { font-weight: 600; font-size: 0.85rem; }
.delta.positive { color: #00c853; }
.delta.negative { color: #ff5252; }
.delta.neutral { color: #555570; }
.delta-cell { text-align: center; }

/* Stat card delta */
.stat-delta {
  margin-top: 6px;
  font-size: 0.8rem;
}
.stat-delta .delta-period {
  color: #555570;
  font-size: 0.75rem;
}

/* Top Movers section */
.movers-section h2 .period-label {
  font-size: 0.85rem;
  color: #555570;
  font-weight: 400;
}
.movers-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.movers-col {
  background: #12121e;
  border: 1px solid #1e1e30;
  border-radius: 12px;
  padding: 20px;
}
.movers-up-title { color: #00c853; font-size: 1rem; margin-bottom: 12px; }
.movers-down-title { color: #ff5252; font-size: 1rem; margin-bottom: 12px; }
.mover-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid #1a1a2e;
}
.mover-item:last-child { border-bottom: none; }
.mover-name {
  color: #c0c0d8;
  font-size: 0.9rem;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mover-score {
  font-family: 'SF Mono', 'Fira Code', monospace;
  font-size: 0.85rem;
  color: #8888a0;
  margin: 0 12px;
}

/* Delta badges in agent detail */
.delta-badges {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}
.delta-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #0d0d18;
  border: 1px solid #1e1e30;
  border-radius: 6px;
  padding: 4px 10px;
  font-size: 0.82rem;
  color: #8888a0;
}
.trend-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 10px;
  font-size: 0.78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.trend-rising { background: #00c85320; color: #00c853; }
.trend-stable { background: #555570; color: #c0c0d8; }
.trend-falling { background: #ff525220; color: #ff5252; }

/* Alerts in agent detail */
.alerts-section { margin-bottom: 20px; }
.alert {
  padding: 10px 14px;
  border-radius: 8px;
  margin-bottom: 8px;
  font-size: 0.88rem;
}
.alert-info {
  background: #448aff15;
  border: 1px solid #448aff30;
  color: #80b0ff;
}
.alert-warning {
  background: #f7931a15;
  border: 1px solid #f7931a30;
  color: #f7931a;
}
.alert-critical {
  background: #ff525215;
  border: 1px solid #ff525230;
  color: #ff5252;
}

/* Responsive movers */
@media (max-width: 600px) {
  .movers-grid { grid-template-columns: 1fr; }
}

/* Live NIP-85 circuit widget on methodology.html */
.live-circuit {
  margin: 18px 0 24px;
  border: 1px solid #2a2a3a;
  background: #10101a;
  border-radius: 10px;
  padding: 14px 18px 18px;
}
.live-circuit-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  gap: 12px;
}
.live-circuit-status {
  font-size: 0.85rem;
  color: #8888a0;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}
.live-circuit-refresh {
  background: #1a1a28;
  border: 1px solid #2a2a3a;
  color: #c0c0d8;
  padding: 4px 12px;
  font-size: 0.8rem;
  border-radius: 6px;
  cursor: pointer;
}
.live-circuit-refresh:hover {
  background: #22223a;
  border-color: #f7931a;
  color: #f7931a;
}
.live-circuit-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.live-circuit-cell {
  background: #15151f;
  border: 1px solid #22222e;
  border-radius: 8px;
  padding: 12px 14px;
  min-height: 110px;
}
.live-circuit-kind {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  color: #f7931a;
  font-size: 0.9rem;
  font-weight: 600;
}
.live-circuit-label {
  font-size: 0.75rem;
  color: #8888a0;
  margin-bottom: 8px;
}
.live-circuit-count {
  font-size: 1.1rem;
  color: #e0e0e8;
  margin-bottom: 8px;
}
.live-circuit-sample {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.75rem;
  color: #a0a0b8;
  word-break: break-word;
}
.live-circuit-event-id {
  color: #6666a0;
}
.live-circuit-event-data {
  color: #c0c0d8;
  margin-top: 4px;
}
.live-circuit-event-more {
  color: #6666a0;
  margin-top: 4px;
  font-size: 0.7rem;
}
.live-circuit-stream-label {
  color: #f5b500;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-top: 10px;
  padding-bottom: 2px;
  border-bottom: 1px solid #2a2a40;
}
.live-circuit-stream-label:first-child {
  margin-top: 0;
}
.live-circuit-empty {
  color: #666680;
  font-style: italic;
  font-family: system-ui, -apple-system, sans-serif;
}
.live-circuit-noscript {
  margin-top: 10px;
  color: #ff8080;
  font-size: 0.85rem;
}
@media (max-width: 760px) {
  .live-circuit-grid { grid-template-columns: 1fr; }
}

/* WoT-a-thon submission CTA — rendered in the landing page header */
.wotathon-cta {
  margin: 22px auto 0;
  max-width: 760px;
  padding: 12px 16px 14px;
  border: 1px solid #f7931a55;
  background: linear-gradient(180deg, #f7931a0c 0%, #f7931a05 100%);
  border-radius: 10px;
  text-align: left;
}
.wotathon-cta-title {
  color: #f7931a;
  font-weight: 700;
  font-size: 0.95rem;
  margin-bottom: 2px;
}
.wotathon-cta-sub {
  color: #a0a0b8;
  font-size: 0.82rem;
  margin-bottom: 10px;
}
.wotathon-cta-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  font-size: 0.85rem;
}
.wotathon-cta-links a {
  color: #f7931a;
  text-decoration: none;
  padding: 4px 10px;
  border: 1px solid #f7931a40;
  border-radius: 6px;
  background: #15151f;
}
.wotathon-cta-links a:hover {
  background: #22223a;
  border-color: #f7931a;
}
