.streak-tabs { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.streak-tabs[hidden] { display: none; }
.streak-tabs button { padding: 10px 20px; border: 1px solid #dce3ee; border-radius: 8px; background: #fff; color: #52647e; cursor: pointer; font: inherit; }
.streak-tabs button.active { background: #2862d3; border-color: #2862d3; color: #fff; }
.app-shell .streak-tabs button.active { background: var(--accent); border-color: var(--accent); }
.streak-tabs button:focus-visible { outline: 3px solid #94b8ff; outline-offset: 2px; }
.streak-thresholds { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; border: 1px solid #e1e6ed; border-radius: 8px; padding: 14px; margin: 18px 0 10px; }
.streak-thresholds legend, .streak-thresholds label { color: #52647e; font-size: 12px; }
.streak-thresholds input { display: block; box-sizing: border-box; width: 100%; margin-top: 6px; padding: 8px; border: 1px solid #dce3ee; border-radius: 6px; }
.streak-hint { color: #75849a; font-size: 12px; line-height: 1.7; }
.streak-fixture { min-width: 210px; }
.streak-fixture strong, .streak-fixture small { display: block; white-space: normal; margin-bottom: 5px; }
.opportunity-fixture-row { border-bottom: 1px solid #edf0f4; }
.opportunity-fixture-row > a { display: grid; grid-template-columns: 24px minmax(0,1fr) auto 12px; gap: 9px; align-items: center; padding: 12px 14px 8px; }
.opportunity-fixture-row > a:hover { background: #f8faff; }
.opportunity-fixture-row b { color: #2f755f; font-size: 11px; }
.opportunity-fixture-row b.loss { color: #b75960; }
.opportunity-fixture-row b.draw { color: #94731e; }
.opportunity-next-fixture { padding: 0 14px 12px 47px; color: #75849a; font-size: 11px; line-height: 1.7; }
.opportunity-next-fixture small { display: block; }
.opportunity-next-fixture a { display: inline-block; color: #2862d3; margin-top: 3px; }
