:root {
  --bg: #080d14;
  --bg-soft: #0d1420;
  --panel: #111a27;
  --panel-2: #172435;
  --panel-3: #1c2b3f;
  --text: #f6f8fb;
  --muted: #9aa8ba;
  --line: rgba(255, 255, 255, 0.11);
  --line-strong: rgba(255, 255, 255, 0.18);
  --accent: #f5c75d;
  --accent-2: #31c7e6;
  --good: #82e6a8;
  --danger: #f39797;
  --shadow: 0 20px 60px rgba(0, 0, 0, 0.34);
  --radius: 18px;
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: 6.5rem;
}

body {
  margin: 0;
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at 16% 0%, rgba(49, 199, 230, 0.16), transparent 30rem),
    radial-gradient(circle at 88% 8%, rgba(245, 199, 93, 0.12), transparent 28rem),
    linear-gradient(180deg, #0b111b 0%, var(--bg) 42%, #05080d 100%);
}

button, select, input { font: inherit; }

button {
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  padding: 0.68rem 0.95rem;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.015)), var(--panel-2);
  color: var(--text);
  cursor: pointer;
}

button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

button:hover:not(:disabled),
button:focus-visible:not(:disabled) {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(245, 199, 93, 0.14);
  outline: none;
}

.collapsible-toggle,
.game-card-toggle {
  width: 100%;
  border-radius: 0.95rem;
  padding: 0.75rem 0.85rem;
  text-align: left;
}

.collapsible-toggle {
  display: grid;
  grid-template-columns: minmax(130px, auto) minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: center;
  margin-bottom: 0.85rem;
  background: rgba(8, 13, 20, 0.34);
}

.collapse-title {
  color: var(--text);
  font-weight: 850;
}

.collapse-summary {
  min-width: 0;
  color: var(--muted);
  overflow-wrap: anywhere;
}

.collapse-chevon,
.game-card-toggle span:last-child {
  justify-self: end;
  color: var(--accent);
  transition: transform 160ms ease;
}

.collapsible-section.is-collapsed {
  padding-bottom: 1rem;
}

.collapsible-section.is-collapsed > .collapsible-toggle {
  margin-bottom: 0;
}

.collapsible-section.is-collapsed > .collapsible-content {
  display: none;
}

.collapsible-content > .section-header:first-child {
  display: none;
}

.collapsible-section.is-collapsed .collapse-chevon {
  transform: rotate(-90deg);
}

.dashboard-grid.is-companion-collapsed {
  display: none;
}

.button-secondary {
  border-color: rgba(49, 199, 230, 0.34);
  background: rgba(49, 199, 230, 0.11);
}

.danger-button {
  border-color: rgba(243, 151, 151, 0.42);
  background: rgba(243, 151, 151, 0.11);
}

.app-shell {
  width: min(1500px, calc(100% - 2rem));
  margin: 0 auto;
  padding: 0.75rem 0 4rem;
}

.sticky-status-bar {
  position: sticky;
  top: 0.75rem;
  z-index: 80;
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 0.45rem;
  margin-bottom: 0.85rem;
  padding: 0.5rem;
  border: 1px solid rgba(245, 199, 93, 0.26);
  border-radius: 999px;
  background: rgba(9, 14, 22, 0.86);
  box-shadow: 0 16px 44px rgba(0, 0, 0, 0.38);
  backdrop-filter: blur(18px);
}

.sticky-status-bar > span {
  display: flex;
  justify-content: space-between;
  gap: 0.65rem;
  align-items: center;
  min-height: 2.45rem;
  padding: 0 0.85rem;
  border-radius: 999px;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.045);
  white-space: nowrap;
}

.sticky-status-bar strong {
  color: var(--text);
  font-size: 0.76rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.top-command {
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  align-items: center;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(135deg, rgba(49, 199, 230, 0.11), transparent 38%), rgba(17, 26, 39, 0.78);
  box-shadow: var(--shadow);
}

.brand-lockup {
  display: flex;
  gap: 1rem;
  align-items: center;
}

.brand-mark {
  display: grid;
  place-items: center;
  width: 3.2rem;
  height: 3.2rem;
  flex: 0 0 auto;
  border: 1px solid rgba(245, 199, 93, 0.42);
  border-radius: 1rem;
  background: linear-gradient(145deg, rgba(245, 199, 93, 0.24), rgba(49, 199, 230, 0.13));
  color: var(--accent);
  font-weight: 900;
}

.app-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  justify-content: flex-end;
}

.app-nav a,
.rail-item {
  color: var(--muted);
  text-decoration: none;
}

.app-nav a {
  padding: 0.6rem 0.8rem;
  border: 1px solid transparent;
  border-radius: 999px;
}

.app-nav a:hover,
.app-nav a:focus-visible {
  border-color: rgba(49, 199, 230, 0.34);
  color: var(--text);
  outline: none;
}

.eyebrow {
  margin: 0 0 0.35rem;
  color: var(--accent);
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

h1, h2, h3, p { margin-top: 0; }

h1 {
  margin-bottom: 0.25rem;
  font-size: clamp(2rem, 4vw, 4.2rem);
  line-height: 0.95;
  letter-spacing: 0;
}

h2 {
  margin-bottom: 0.45rem;
  line-height: 1.08;
}

.subtitle,
.helper-text,
.game-meta,
.pick-details,
.empty-state {
  color: var(--muted);
}

.safety-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0.85rem 0;
}

.safety-strip span,
.soft-pill,
.pick-pill,
.result-pill,
.summary-count {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0.43rem 0.65rem;
  background: rgba(245, 199, 93, 0.11);
  color: var(--text);
  font-size: 0.84rem;
  white-space: nowrap;
}

.workspace-layout {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) 320px;
  gap: 1rem;
  align-items: start;
}

.left-rail,
.right-panel {
  position: sticky;
  top: 5.7rem;
}

.left-rail,
.practice-slip,
.card,
.stat-card,
.hero-panel {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.012)),
    rgba(17, 26, 39, 0.9);
  box-shadow: var(--shadow);
}

.left-rail {
  padding: 0.85rem;
}

.rail-title {
  margin: 0 0 0.65rem;
  color: var(--accent-2);
  font-size: 0.76rem;
  font-weight: 850;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.rail-item {
  display: grid;
  gap: 0.18rem;
  padding: 0.75rem;
  border: 1px solid transparent;
  border-radius: 0.85rem;
}

.rail-item + .rail-item {
  margin-top: 0.35rem;
}

.rail-item span {
  color: var(--text);
  font-weight: 760;
}

.rail-item strong {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 650;
}

.rail-item:hover,
.rail-item:focus-visible,
.rail-item.is-active {
  border-color: rgba(49, 199, 230, 0.32);
  background: rgba(49, 199, 230, 0.09);
  outline: none;
}

.main-stage {
  min-width: 0;
}

.hero-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, 210px);
  gap: 1rem;
  align-items: stretch;
  padding: 1rem;
}

.hero-panel h2 {
  max-width: 760px;
  font-size: clamp(1.6rem, 2.6vw, 2.65rem);
}

.hero-meter {
  display: grid;
  place-items: center;
  min-height: 10rem;
  border: 1px solid rgba(245, 199, 93, 0.28);
  border-radius: 1rem;
  background: radial-gradient(circle at center, rgba(245, 199, 93, 0.18), rgba(49, 199, 230, 0.07));
  text-align: center;
}

.hero-meter span,
.hero-meter small {
  color: var(--muted);
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.hero-meter strong {
  color: var(--accent);
  font-size: 3.3rem;
  line-height: 0.9;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(130px, 1fr));
  gap: 0.75rem;
  margin-top: 1rem;
}

.stat-card,
.card,
.practice-slip {
  padding: 1rem;
}

.stat-card {
  min-height: 7.2rem;
}

.stat-card span {
  display: block;
  margin-bottom: 0.5rem;
  color: var(--muted);
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.stat-card strong {
  font-size: 2rem;
  color: var(--text);
}

.card {
  margin-top: 1rem;
}

.section-header {
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 0.9rem;
}

.section-header.compact h2 {
  font-size: 1.15rem;
}

.trainer-buttons,
.utility-tabs,
.tool-row,
.game-actions,
.control-row,
.score-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.trainer-button.is-active {
  border-color: var(--accent);
  background: rgba(245, 199, 93, 0.16);
}

.utility-tabs {
  margin-bottom: 1rem;
}

.utility-tab.is-active {
  border-color: var(--accent);
  background: rgba(245, 199, 93, 0.16);
}

.utility-pane {
  display: none;
}

.utility-pane.is-active {
  display: block;
}

.utility-pane h3 {
  margin: 0 0 0.4rem;
  font-size: 1.25rem;
}

.live-feed-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(120px, 1fr));
  gap: 0.65rem;
  margin: 0.85rem 0;
}

.live-feed-grid article {
  border: 1px solid var(--line);
  border-radius: 0.9rem;
  padding: 0.75rem;
  background: rgba(8, 13, 20, 0.3);
}

.live-feed-grid span {
  display: block;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 780;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.live-feed-grid strong {
  display: block;
  margin-top: 0.35rem;
  color: var(--text);
}

.lesson-box {
  margin-top: 0.9rem;
  padding: 1rem;
  border: 1px solid rgba(49, 199, 230, 0.18);
  border-radius: 1rem;
  background: rgba(23, 36, 53, 0.86);
}

.lesson-box h3 {
  margin-top: 0;
}

.lesson-box .mini-example {
  margin-bottom: 0;
  border-left: 3px solid var(--accent-2);
  padding-left: 0.85rem;
  color: var(--muted);
}

label {
  display: grid;
  gap: 0.4rem;
  min-width: 220px;
  color: var(--muted);
  font-weight: 720;
}

select,
input,
textarea {
  width: 100%;
  border: 1px solid var(--line-strong);
  border-radius: 0.85rem;
  padding: 0.75rem;
  background: var(--panel-2);
  color: var(--text);
}

select:focus,
input:focus,
textarea:focus {
  border-color: var(--accent-2);
  box-shadow: 0 0 0 3px rgba(49, 199, 230, 0.14);
  outline: none;
}

textarea {
  min-height: 9rem;
  resize: vertical;
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  line-height: 1.45;
}

.game-grid {
  display: grid;
  gap: 0.9rem;
}

.practice-result-tools {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  margin-bottom: 1rem;
  padding: 0.85rem;
  border: 1px solid rgba(49, 199, 230, 0.22);
  border-radius: 1rem;
  background: rgba(49, 199, 230, 0.07);
}

.practice-result-tools strong {
  color: var(--text);
}

.practice-result-tools p {
  margin: 0.25rem 0 0;
}

.game-card {
  display: grid;
  gap: 0.9rem;
  border: 1px solid var(--line);
  border-radius: 1rem;
  padding: 1rem;
  background:
    linear-gradient(90deg, rgba(49, 199, 230, 0.08), transparent 40%),
    var(--panel-2);
}

.game-card-toggle {
  display: grid;
  grid-template-columns: minmax(130px, auto) minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: center;
  background: rgba(8, 13, 20, 0.28);
}

.game-card-toggle span:first-child {
  color: var(--text);
  font-weight: 850;
}

.game-card-toggle small {
  min-width: 0;
  color: var(--muted);
  font-size: 0.86rem;
  overflow-wrap: anywhere;
}

.game-card.is-card-collapsed {
  gap: 0;
}

.game-card.is-card-collapsed .game-card-body {
  display: none;
}

.game-card.is-card-collapsed .game-card-toggle span:last-child {
  transform: rotate(-90deg);
}

.game-card-body {
  display: grid;
  gap: 0.9rem;
}

.game-card.has-pick {
  border-color: rgba(130, 230, 168, 0.38);
}

.game-card.is-final {
  border-color: rgba(245, 199, 93, 0.44);
}

.game-card.is-live {
  border-color: rgba(49, 199, 230, 0.5);
  box-shadow: 0 18px 50px rgba(49, 199, 230, 0.1);
}

.live-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}

.live-badge,
.feed-badge {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(49, 199, 230, 0.35);
  border-radius: 999px;
  padding: 0.3rem 0.5rem;
  background: rgba(49, 199, 230, 0.11);
  color: var(--accent-2);
  font-size: 0.75rem;
  font-weight: 850;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.feed-badge.is-final {
  border-color: rgba(245, 199, 93, 0.35);
  background: rgba(245, 199, 93, 0.1);
  color: var(--accent);
}

.game-card h3 {
  margin: 0 0 0.2rem;
  font-size: 1.25rem;
}

.game-meta,
.pick-details {
  margin-bottom: 0;
}

.pick-pill {
  border-color: rgba(130, 230, 168, 0.34);
  background: rgba(130, 230, 168, 0.12);
}

.result-pill.won {
  border-color: rgba(130, 230, 168, 0.5);
  background: rgba(130, 230, 168, 0.14);
}

.result-pill.lost {
  border-color: rgba(243, 151, 151, 0.5);
  background: rgba(243, 151, 151, 0.13);
}

.result-pill.push {
  border-color: rgba(154, 168, 186, 0.5);
  background: rgba(154, 168, 186, 0.13);
}

.team-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: center;
  padding: 0.75rem;
  border: 1px solid var(--line);
  border-radius: 0.85rem;
  background: rgba(8, 13, 20, 0.36);
}

.team-row span:first-child {
  font-weight: 820;
}

.team-row span:last-child {
  color: var(--muted);
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.score-row {
  margin-top: 0.2rem;
  padding-top: 0.9rem;
  border-top: 1px solid var(--line);
}

.score-row label {
  min-width: 120px;
  flex: 1;
}

.history-log {
  margin: 0;
  padding-left: 1.25rem;
  color: var(--muted);
}

.history-log li {
  margin-bottom: 0.5rem;
}

.save-tools-message {
  margin: 0.9rem 0 0;
  color: var(--muted);
}

.save-tools-message.is-success {
  color: var(--good);
}

.save-tools-message.is-error {
  color: var(--danger);
}

.save-data-panel {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--line);
}

.save-data-panel.is-hidden {
  display: none;
}

.practice-slip {
  background:
    linear-gradient(180deg, rgba(245, 199, 93, 0.1), transparent 12rem),
    rgba(17, 26, 39, 0.94);
}

.summary-count {
  justify-content: center;
  min-width: 2rem;
  height: 2rem;
  padding: 0;
  border-color: rgba(49, 199, 230, 0.4);
  background: rgba(49, 199, 230, 0.16);
  color: var(--accent-2);
  font-weight: 850;
}

.summary-list {
  display: grid;
  gap: 0.7rem;
  min-height: 9rem;
  padding: 0.8rem;
  border: 1px dashed rgba(255, 255, 255, 0.16);
  border-radius: 1rem;
  background: rgba(8, 13, 20, 0.32);
}

.summary-section {
  display: grid;
  gap: 0.55rem;
}

.summary-section + .summary-section {
  padding-top: 0.7rem;
  border-top: 1px solid var(--line);
}

.summary-section-title {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  align-items: center;
  margin: 0;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.summary-pick {
  display: grid;
  gap: 0.45rem;
  padding: 0.75rem;
  border: 1px solid var(--line);
  border-radius: 0.85rem;
  background: rgba(23, 36, 53, 0.84);
}

.summary-pick.is-pending {
  border-color: rgba(49, 199, 230, 0.3);
}

.summary-pick.is-settled {
  border-color: rgba(245, 199, 93, 0.24);
}

.summary-pick strong {
  color: var(--text);
}

.summary-pick span {
  color: var(--muted);
  font-size: 0.86rem;
}

.summary-pick-header,
.summary-pick-footer {
  display: flex;
  justify-content: space-between;
  gap: 0.7rem;
  align-items: flex-start;
}

.summary-pick-footer {
  align-items: center;
  flex-wrap: wrap;
}

.summary-team {
  display: grid;
  gap: 0.15rem;
}

.summary-team small {
  color: var(--muted);
  font-size: 0.78rem;
}

.status-badge {
  display: inline-flex;
  align-items: center;
  min-height: 1.6rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0.25rem 0.5rem;
  color: var(--text);
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
}

.status-badge.pending {
  border-color: rgba(49, 199, 230, 0.38);
  background: rgba(49, 199, 230, 0.13);
  color: var(--accent-2);
}

.status-badge.won {
  border-color: rgba(130, 230, 168, 0.42);
  background: rgba(130, 230, 168, 0.13);
  color: var(--good);
}

.status-badge.lost {
  border-color: rgba(243, 151, 151, 0.42);
  background: rgba(243, 151, 151, 0.13);
  color: var(--danger);
}

.status-badge.push {
  border-color: rgba(154, 168, 186, 0.42);
  background: rgba(154, 168, 186, 0.12);
  color: var(--muted);
}

.summary-result {
  color: var(--text);
  font-weight: 850;
}

.summary-result.positive {
  color: var(--good);
}

.summary-result.negative {
  color: var(--danger);
}

.empty-state {
  align-self: center;
  margin: 0;
  text-align: center;
}

.empty-state strong {
  display: block;
  margin-bottom: 0.3rem;
  color: var(--text);
}

.empty-state p {
  margin: 0;
  color: var(--muted);
}

.summary-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem;
  margin: 0.8rem 0;
}

.summary-metrics div {
  padding: 0.75rem;
  border: 1px solid var(--line);
  border-radius: 0.85rem;
  background: rgba(255, 255, 255, 0.045);
}

.summary-metrics dt {
  color: var(--muted);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.summary-metrics dd {
  margin: 0.3rem 0 0;
  color: var(--text);
  font-size: 1.3rem;
  font-weight: 860;
}

.insight-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 0.65rem;
}

.insight-stat,
.confidence-row,
.insight-note {
  border: 1px solid var(--line);
  border-radius: 1rem;
  background: rgba(8, 13, 20, 0.28);
}

.insight-stat {
  min-height: 6rem;
  padding: 0.8rem;
}

.insight-stat span,
.confidence-metric span {
  display: block;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 780;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.insight-stat strong {
  display: block;
  margin-top: 0.45rem;
  color: var(--text);
  font-size: clamp(1.25rem, 2vw, 1.8rem);
  line-height: 1.05;
}

.insight-record-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0.75rem 0;
}

.insight-record-strip span,
.confidence-record {
  display: inline-flex;
  gap: 0.35rem;
  align-items: center;
  border: 1px solid rgba(49, 199, 230, 0.24);
  border-radius: 999px;
  padding: 0.45rem 0.65rem;
  background: rgba(49, 199, 230, 0.08);
  color: var(--muted);
}

.insight-record-strip strong {
  color: var(--text);
}

.confidence-breakdown {
  display: grid;
  gap: 0.65rem;
}

.confidence-row {
  display: grid;
  grid-template-columns: minmax(145px, 1.1fr) repeat(3, minmax(78px, 0.6fr)) minmax(120px, 0.8fr) minmax(105px, 0.7fr);
  gap: 0.6rem;
  align-items: center;
  padding: 0.8rem;
}

.confidence-label {
  display: grid;
  gap: 0.2rem;
}

.confidence-label strong {
  color: var(--text);
}

.confidence-label span {
  color: var(--muted);
  font-size: 0.84rem;
}

.confidence-metric strong,
.confidence-accuracy strong {
  display: block;
  margin-top: 0.2rem;
  color: var(--text);
  font-size: 1.12rem;
}

.confidence-accuracy {
  justify-self: end;
  min-width: 7.5rem;
  border: 1px solid rgba(245, 199, 93, 0.22);
  border-radius: 0.85rem;
  padding: 0.55rem 0.65rem;
  background: rgba(245, 199, 93, 0.08);
  text-align: right;
}

.confidence-accuracy span {
  display: block;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 780;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.confidence-record {
  width: fit-content;
}

.insight-note {
  margin-top: 0.8rem;
  padding: 0.85rem;
  background: rgba(245, 199, 93, 0.08);
}

.insight-note strong {
  color: var(--accent);
}

.insight-note p,
.confidence-reminder {
  margin: 0.35rem 0 0;
  color: var(--muted);
}

.confidence-reminder {
  border-left: 3px solid var(--accent-2);
  padding-left: 0.75rem;
}

.slip-note {
  border: 1px solid rgba(245, 199, 93, 0.25);
  border-radius: 1rem;
  padding: 0.85rem;
  background: rgba(245, 199, 93, 0.09);
}

.slip-note strong {
  color: var(--accent);
}

.slip-note p {
  margin: 0.35rem 0 0;
  color: var(--muted);
}

@media (max-width: 1180px) {
  .workspace-layout {
    grid-template-columns: 190px minmax(0, 1fr);
  }

  .right-panel {
    position: static;
    grid-column: 1 / -1;
  }
}

@media (max-width: 860px) {
  .app-shell {
    width: min(100% - 1rem, 720px);
  }

  .sticky-status-bar {
    top: 0.35rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-radius: 1rem;
  }

  .top-command,
  .brand-lockup,
  .section-header,
  .practice-result-tools,
  .hero-panel {
    display: block;
  }

  .practice-result-tools button {
    margin-top: 0.75rem;
  }

  .brand-mark,
  .app-nav {
    margin-bottom: 0.85rem;
  }

  .app-nav {
    justify-content: flex-start;
  }

  .workspace-layout {
    grid-template-columns: 1fr;
  }

  .left-rail {
    position: static;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
  }

  .rail-title {
    grid-column: 1 / -1;
  }

  .rail-item + .rail-item {
    margin-top: 0;
  }

  .hero-meter {
    margin-top: 1rem;
  }

  .dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .collapsible-toggle,
  .game-card-toggle {
    grid-template-columns: 1fr auto;
  }

  .collapse-summary,
  .game-card-toggle small {
    grid-column: 1 / -1;
  }

  .live-feed-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .insight-summary-grid,
  .confidence-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .confidence-label,
  .confidence-accuracy {
    grid-column: 1 / -1;
  }

  .confidence-accuracy {
    justify-self: stretch;
    text-align: left;
  }
}

@media (max-width: 560px) {
  .sticky-status-bar,
  .dashboard-grid,
  .left-rail,
  .summary-metrics,
  .insight-summary-grid,
  .live-feed-grid,
  .confidence-row {
    grid-template-columns: 1fr;
  }

  .sticky-status-bar > span {
    border-radius: 0.8rem;
  }

  h1 {
    font-size: 2.15rem;
  }

  label,
  .score-row label {
    min-width: 100%;
  }
}
.real-nfl-availability {
  margin-bottom: 16px;
  border: 1px solid #b8c4c6;
  border-radius: 6px;
  background: #fff;
  color: #24383c;
}
.real-nfl-availability summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px;
  cursor: pointer;
}
.real-nfl-availability summary::after { content: "+"; font-size: 20px; }
.real-nfl-availability[open] summary::after { content: "-"; }
.real-nfl-availability summary span { color: #865321; font-size: 0.85rem; }
.real-nfl-message { padding: 0 16px 12px; }
.real-nfl-message p { margin: 8px 0; }
@media (max-width: 600px) {
  .real-nfl-availability summary { flex-wrap: wrap; }
}
.ncaaf-game { border-top: 1px solid #ccd6d6; padding: 12px 0; }
.ncaaf-game input { width: 5rem; }
.ncaaf-game select, .ncaaf-game input, .ncaaf-game button { margin: 4px 8px 4px 0; max-width: 100%; }
.build-status { padding: 12px 20px; color: #687779; font-size: 0.75rem; text-align: right; }

#ncaaf-panel { background: #151e27; color: #edf3f3; border-color: #394750; }
#ncaaf-panel summary { gap: 12px; }
#ncaaf-panel summary span { color: #d3bd82; }
#ncaaf-panel .ncaaf-kicker { color: #d5bd7d; font-size: 0.8rem; font-weight: 700; }
#ncaaf-panel #ncaaf-status { color: #c5d3d2; font-size: 0.85rem; border-left: 3px solid #cfad5d; padding-left: 10px; }
#ncaaf-panel #ncaaf-record { color: #d8e2e0; font-size: 0.9rem; }
#ncaaf-games { display: grid; gap: 8px; margin: 12px 0; }
#ncaaf-panel .ncaaf-game { border: 1px solid #37464d; border-radius: 6px; background: #202d34; padding: 12px; min-width: 0; }
#ncaaf-panel .ncaaf-game strong { color: #f1f4ef; font-size: 0.98rem; }
.ncaaf-game-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; color: #c2d2cf; font-size: 0.82rem; margin: 7px 0; }
.ncaaf-badge { border: 1px solid #7b7052; border-radius: 4px; padding: 2px 6px; color: #f0dca5; }
.ncaaf-badge-muted { border-color: #556970; color: #c2d2cf; }
.ncaaf-pick-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
#ncaaf-panel .ncaaf-pick-controls select, #ncaaf-panel .ncaaf-pick-controls input, #ncaaf-panel .ncaaf-pick-controls button { margin: 0; }
#ncaaf-panel .ncaaf-pick-controls select { flex: 1 1 170px; min-width: 0; }
#ncaaf-panel .ncaaf-pick-controls input { flex: 0 1 68px; min-width: 55px; width: 68px; }
#ncaaf-panel .ncaaf-pick-controls button { flex: 0 1 auto; }


/* NCAAF compact dark board — Oct 31 style pass */
.real-nfl-availability {
  color: var(--text);
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 14px;
  background: linear-gradient(155deg,#172538,#0d1623);
  overflow: hidden;
}
.real-nfl-availability > summary {
  min-height: 47px;
  color: var(--text);
  background: rgba(10,17,27,.65);
  font-weight: 780;
}
.real-nfl-availability > summary strong { color: #f2f6fc; }
.real-nfl-availability > summary span { color: var(--accent); }
.real-nfl-availability[open] > summary { border-bottom: 1px solid var(--line); }
#ncaaf-panel {
  color: var(--text);
  background: linear-gradient(155deg,#172638,#101a28 68%,#0d1621);
  border-color: rgba(49,199,230,.25);
}
#ncaaf-panel .real-nfl-message { padding: 12px 14px 15px; }
#ncaaf-panel .ncaaf-toolbar {
  display: flex; flex-wrap: wrap; align-items: end; gap: 9px;
  margin-bottom: 9px;
}
#ncaaf-panel .ncaaf-toolbar label {
  flex: 0 1 185px; min-width: 0; width: auto;
  color: #b6c7da; font-size: .74rem; gap: 3px;
}
#ncaaf-panel .ncaaf-toolbar input {
  min-width: 0; padding: .58rem .7rem; border-radius: 8px;
  background: #112036; color: #f2f7ff; color-scheme: dark;
}
#ncaaf-panel .ncaaf-toolbar button {
  padding: .59rem .96rem; border-radius: 9px;
  color: #bff1fc; border-color: rgba(49,199,230,.37);
  background: #1c3748;
}
#ncaaf-panel .ncaaf-snapshot-note {
  margin-left: auto; color: #9fb4c8; font-size: .73rem;
}
#ncaaf-panel #ncaaf-status {
  color: #ead99f; background: rgba(245,199,93,.065);
  border: 1px solid rgba(245,199,93,.19);
  border-left: 3px solid var(--accent);
  border-radius: 7px; padding: 7px 10px;
  margin: 3px 0 8px; font-size: .78rem; line-height: 1.4;
}
#ncaaf-panel #ncaaf-record {
  color: #b6cadc; font-size: .81rem; margin: 0 0 11px;
}
#ncaaf-panel #ncaaf-games { display: grid; gap: 9px; margin: 0 0 14px; }
#ncaaf-panel .ncaaf-game {
  padding: 12px 13px; border-radius: 11px; margin: 0;
  background: linear-gradient(100deg,rgba(49,199,230,.055),transparent 55%),#162334;
  border: 1px solid rgba(255,255,255,.10);
}
#ncaaf-panel .ncaaf-matchup {
  display: block; color: #f6f8fd; font-size: .94rem;
  line-height: 1.4; font-weight: 790;
}
#ncaaf-panel .ncaaf-game-meta {
  display: flex; align-items: center; gap: 6px 9px; flex-wrap: wrap;
  margin: 5px 0 0; color: #adc1d5; font-size: .78rem;
}
#ncaaf-panel .ncaaf-badge {
  display: inline-flex; align-items: center; border-radius: 999px;
  padding: 2px 9px; font-size: .71rem; font-weight: 750;
  color: #efd18a; background: rgba(245,199,93,.095);
  border: 1px solid rgba(245,199,93,.25);
}
#ncaaf-panel .ncaaf-pick-controls {
  display: flex; flex-wrap: wrap; align-items: end; gap: 8px;
  padding-top: 10px; margin-top: 10px;
  border-top: 1px solid rgba(255,255,255,.08);
}
#ncaaf-panel .ncaaf-field {
  display: grid; min-width: 0; width: auto; flex: 0 1 auto; gap: 4px;
  color: #afc3d8; font-size: .7rem; font-weight: 730;
}
#ncaaf-panel .ncaaf-field-team { flex: 1 1 170px; }
#ncaaf-panel .ncaaf-field-number { flex: 0 1 79px; }
#ncaaf-panel .ncaaf-pick-controls select,
#ncaaf-panel .ncaaf-pick-controls input {
  box-sizing: border-box; margin: 0; width: 100%; min-width: 0; max-width: none;
  padding: .57rem .68rem; border: 1px solid rgba(255,255,255,.15);
  border-radius: 8px; color: #f1f7ff; background: #0d1827;
  font-size: .83rem; color-scheme: dark;
}
#ncaaf-panel .ncaaf-pick-controls button {
  flex: 0 0 auto; margin: 0; padding: .58rem .93rem;
  border-radius: 8px; border: 1px solid rgba(245,199,93,.42);
  background: #413620; color: #ffe1a2; font-size: .82rem; font-weight: 800;
}
#ncaaf-panel .ncaaf-pick-controls button:disabled { opacity: .48; }
#ncaaf-panel #ncaaf-picks { color: #c9d8e8; }
#ncaaf-panel h3 { color: #f2f6fb; font-size: .94rem; }
@media (max-width: 600px) {
 #ncaaf-panel .real-nfl-message { padding: 11px; }
 #ncaaf-panel .ncaaf-toolbar label { flex: 1 1 155px; }
 #ncaaf-panel .ncaaf-snapshot-note { width: 100%; margin-left: 0; }
 #ncaaf-panel .ncaaf-field-team { flex-basis: 100%; }
 #ncaaf-panel .ncaaf-field-number { flex: 1 1 72px; }
 #ncaaf-panel .ncaaf-pick-controls button { flex: 1 0 auto; }
}

/* Genuine odds board: compact, accessible, dark surfaces */
#real-odds-board {background:linear-gradient(145deg,#19283b,#101926);border-color:rgba(245,199,93,.28);color:var(--text);}
#real-odds-board > summary {background:rgba(10,17,26,.72);color:var(--text);}
#real-odds-board > summary strong {color:#f6f8fd;}
#real-odds-board > summary span {color:#e0c27a;}
#real-odds-board .real-nfl-message {padding:13px;}
#real-odds-board .real-odds-tools {display:flex;flex-wrap:wrap;align-items:end;gap:8px 10px;}
#real-odds-board .real-odds-tools label {min-width:0;flex:1 1 125px;gap:4px;font-size:.75rem;color:#aec4d8;}
#real-odds-board .real-odds-tools label:has(#real-odds-code) {flex:1 1 190px;}
#real-odds-board .real-odds-tools input,
#real-odds-board .real-odds-tools select {padding:.57rem .7rem;border-radius:8px;min-width:0;background:#0e1a2b;color:#f4f7fd;color-scheme:dark;}
#real-odds-board .real-odds-tools button {padding:.59rem .85rem;border-radius:8px;border-color:rgba(245,199,93,.32);color:#ffe2a2;background:#3b3325;}
#real-odds-board .real-odds-helper {margin:10px 0 7px;color:#9fb4c9;font-size:.78rem;line-height:1.45;}
#real-odds-board #real-odds-status {padding:8px 10px;border:1px solid rgba(49,199,230,.18);border-radius:8px;background:rgba(49,199,230,.07);color:#c6e6f0;font-size:.8rem;}
#real-odds-board #real-odds-status.is-error {border-color:rgba(243,151,151,.25);background:rgba(243,151,151,.08);color:#ffd0d0;}
#real-odds-board #real-odds-games {display:grid;gap:10px;margin-top:12px;}
#real-odds-board .real-odds-game {padding:13px;border:1px solid rgba(255,255,255,.13);border-radius:12px;background:#172438;}
#real-odds-board .real-odds-game > strong {display:block;color:#f5f8ff;margin-bottom:3px;font-size:.96rem;}
#real-odds-board .real-odds-meta {color:#aabdd0;font-size:.78rem;margin:5px 0 10px;}
#real-odds-board .real-odds-market {display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin-top:8px;}
#real-odds-board .real-odds-market-title {flex:0 0 58px;font-size:.78rem;font-weight:800;color:#d8e5f1;}
#real-odds-board .real-odds-market button {padding:.53rem .7rem;border-radius:8px;color:#f6f8fe;background:#22374c;font-size:.82rem;}
#real-odds-board .real-odds-market button:hover:not(:disabled) {border-color:var(--accent);}
#real-odds-board #real-odds-picks {display:grid;gap:8px;}
#real-odds-board .real-odds-saved {margin:0;white-space:pre-line;padding:10px;border:1px solid rgba(255,255,255,.12);border-radius:9px;color:#dce9f4;background:#112033;font-size:.8rem;line-height:1.5;}
#real-odds-board h3 {margin:15px 0 9px;color:#f0f5fd;font-size:.95rem;}
@media(max-width:650px) {
 #real-odds-board .real-odds-tools label {flex:1 1 130px;}
 #real-odds-board .real-odds-tools button {flex:1 1 130px;}
 #real-odds-board .real-odds-market-title {flex-basis:100%;}
}

/* Odds selection-first workflow — single draft in the existing Practice Slip */
#real-odds-board .real-odds-tools label {flex:1 1 145px;}
#real-odds-board .real-odds-tools button {flex:0 0 auto;}
#real-odds-board .real-odds-tools .real-odds-secondary-action {
  color:#b7cde0;background:#162639;border-color:rgba(255,255,255,.18);
}
#real-odds-board .real-odds-access {
  margin:10px 0 7px;
  padding:0 10px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:9px;
  background:rgba(8,15,24,.38);
}
#real-odds-board .real-odds-access > summary {
  display:flex;align-items:center;justify-content:space-between;
  gap:10px;cursor:pointer;padding:9px 0;
  color:#c0d2e2;font-size:.77rem;font-weight:800;
}
#real-odds-board .real-odds-access > summary span {font-size:.72rem;color:#839eb5;font-weight:550;}
#real-odds-board .real-odds-access label {
  display:grid;gap:5px;min-width:0;width:100%;margin:3px 0 8px;
  color:#b7c9d8;font-size:.74rem;
}
#real-odds-board .real-odds-access input {
  width:100%;min-width:0;padding:.58rem .7rem;background:#0e1a2b;
  border-color:rgba(255,255,255,.16);color:#f4f7fd;color-scheme:dark;
}
#real-odds-board .real-odds-access p {margin:0 0 10px;font-size:.72rem;color:#8fa9bb;}
#real-odds-board .real-odds-market button[aria-pressed="true"] {
  border-color:var(--accent);background:#4b3e27;color:#ffe7aa;
  box-shadow:0 0 0 1px rgba(245,199,93,.3);
}
#real-odds-board .real-odds-alt-book {
  margin:4px 0 7px;border-radius:8px;background:#1c3748;color:#c8eef9;
}
.priced-pick-draft[hidden] {display:none;}
.priced-pick-draft {
  display:grid;gap:10px;margin:0 0 12px;padding:13px;
  border:1px solid rgba(245,199,93,.47);
  border-radius:12px;
  background:linear-gradient(145deg,rgba(245,199,93,.13),rgba(18,30,45,.8));
  scroll-margin-top:80px;
}
.priced-pick-draft .priced-draft-eyebrow {
  font-size:.72rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase;
  color:#f1d282;
}
.priced-pick-draft .priced-draft-matchup {
  margin:0;font-size:.91rem;color:#f5f8ff;font-weight:800;line-height:1.35;
}
.priced-pick-draft .priced-draft-selection {margin:0;color:#dce6ef;font-size:.82rem;line-height:1.5;}
.priced-pick-draft .priced-draft-quote {
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  color:#cbd8e5;font-size:.76rem;
}
.priced-pick-draft .priced-draft-quote strong {font-size:1.1rem;color:#ffe0a2;}
.priced-pick-draft .priced-draft-units {
  min-width:0;display:grid;gap:5px;color:#adc1d4;font-size:.77rem;
}
.priced-pick-draft .priced-draft-units input {
  width:100%;min-width:0;background:#0c1928;border:1px solid rgba(255,255,255,.2);
  border-radius:8px;padding:.61rem;color:#f7f9fd;color-scheme:dark;
}
.priced-pick-draft .priced-draft-returns {
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;
}
.priced-pick-draft .priced-draft-returns > div {
  padding:9px;border:1px solid rgba(255,255,255,.12);
  border-radius:9px;background:rgba(6,12,20,.42);
  display:grid;gap:4px;
}
.priced-pick-draft .priced-draft-returns span {
  font-size:.72rem;color:#aabbd0;
}
.priced-pick-draft .priced-draft-returns strong {
  font-size:1.08rem;color:var(--good);
}
.priced-pick-draft .priced-draft-returns .priced-draft-loss {color:var(--danger);}
.priced-pick-draft .priced-draft-actions {display:flex;gap:8px;flex-wrap:wrap;}
.priced-pick-draft .priced-draft-actions button {
  border-radius:9px;padding:.64rem .8rem;font-size:.81rem;font-weight:800;
}
.priced-pick-draft #priced-draft-confirm {
  flex:1 1 130px;background:#5b4829;color:#ffeba7;border-color:rgba(245,199,93,.48);
}
.priced-pick-draft #priced-draft-clear {
  flex:0 0 auto;background:#192a3d;color:#d7e5f0;
}
.priced-pick-draft .priced-draft-validation {font-size:.75rem;color:var(--danger);min-height:.7rem;}
.priced-pick-draft .priced-draft-fine {font-size:.72rem;color:#97acbc;line-height:1.35;}
@media(max-width:650px) {
  #real-odds-board .real-odds-tools button {flex:1 1 130px;}
  .priced-pick-draft .priced-draft-returns {grid-template-columns:repeat(2,minmax(0,1fr));}
}