:root {
  --bg: #080d13;
  --panel: #0e151e;
  --panel-raised: #111b26;
  --line: #263441;
  --line-soft: #1a2530;
  --text: #edf3f7;
  --muted: #8897a5;
  --dim: #566674;
  --gold: #f2bd5b;
  --gold-soft: #6f5121;
  --blue: #73b8ff;
  --cyan: #5fd5cf;
  --green: #58d6a0;
  --coral: #ff796e;
  --violet: #b99cff;
  --sans: 'Space Grotesk', system-ui, sans-serif;
  --mono: 'DM Mono', ui-monospace, monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; overflow-x: hidden; background: radial-gradient(circle at 78% -15%, #17293c 0, var(--bg) 34rem), var(--bg); color: var(--text); font-family: var(--sans); font-size: 15px; }
button, input, select { font: inherit; }
button { -webkit-tap-highlight-color: transparent; }
.hidden { display: none !important; }
.app-shell { min-height: 100vh; }
.main-content { width: 100%; max-width: 1440px; margin: 0 auto; padding: 0 14px 28px; }

.sidebar { display: none; }
.topbar { min-height: 62px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line-soft); }
.mobile-brand { display: flex; align-items: center; gap: 8px; min-width: 0; }
.mobile-brand strong { font-size: 12px; letter-spacing: .09em; white-space: nowrap; }
.mobile-brand strong em { color: var(--gold); font-style: normal; }
.mobile-brand small { display: block; color: var(--dim); font: 9px var(--mono); letter-spacing: .12em; white-space: nowrap; }
.mobile-brand-bars { display: flex; align-items: end; gap: 2px; height: 20px; width: 15px; }
.mobile-brand-bars i { display: block; width: 3px; border-radius: 2px; background: var(--gold); }
.mobile-brand-bars i:nth-child(1) { height: 8px; opacity: .55; }
.mobile-brand-bars i:nth-child(2) { height: 14px; opacity: .78; }
.mobile-brand-bars i:nth-child(3) { height: 20px; }
.breadcrumb { display: none; color: #667584; font: 10px var(--mono); letter-spacing: .12em; }
.breadcrumb b { color: #374653; padding: 0 8px; font-weight: 400; }
.breadcrumb strong { color: #bec9d1; font-weight: 400; }
.topbar-actions { display: flex; align-items: center; gap: 9px; }
.api-status { display: flex; align-items: center; gap: 6px; color: var(--muted); font: 9px var(--mono); letter-spacing: .05em; white-space: nowrap; }
.api-status.live { color: var(--green); }
.api-status.warn { color: var(--gold); }
.status-light { width: 6px; height: 6px; border-radius: 50%; background: var(--dim); }
.api-status.live .status-light { background: var(--green); box-shadow: 0 0 0 4px rgba(88,214,160,.1); }
.api-status.warn .status-light { background: var(--gold); }
.icon-button, .close-detail, .retry-button { min-height: 38px; border: 1px solid var(--line); border-radius: 5px; background: #111b25; color: #b8c4cd; cursor: pointer; }
.icon-button { width: 38px; font-size: 20px; line-height: 1; }
.icon-button:hover, .close-detail:hover, .retry-button:hover { border-color: #64788a; color: var(--text); }

.hero-row { display: grid; gap: 25px; padding: 35px 0 28px; }
.eyebrow { display: flex; align-items: center; gap: 8px; color: var(--gold); font: 10px var(--mono); letter-spacing: .14em; }
.eyebrow-line { width: 20px; height: 1px; background: var(--gold); }
.eyebrow-tag { border: 1px solid var(--gold-soft); padding: 3px 5px; color: #c6953d; font-size: 8px; letter-spacing: .06em; }
h1 { margin: 16px 0 14px; font-size: clamp(35px, 10vw, 58px); line-height: 1.01; letter-spacing: -.06em; font-weight: 600; }
h1 span { color: var(--gold); }
.hero-copy { max-width: 540px; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.55; }
.hero-link { display: inline-block; margin-top: 16px; color: var(--gold); font: 10px var(--mono); letter-spacing: .06em; text-decoration: none; }.hero-link:hover { color: #ffe4a2; }
.hero-telemetry { display: grid; grid-template-columns: repeat(2, 1fr); border: 1px solid var(--line-soft); background: rgba(14,21,30,.66); }
.telemetry-cell { min-width: 0; padding: 13px 12px; border-right: 1px solid var(--line-soft); }
.telemetry-cell:nth-child(2) { border-right: 0; }
.telemetry-cell:last-child { display: none; }
.telemetry-cell span { display: block; margin-bottom: 7px; color: var(--dim); font: 9px var(--mono); letter-spacing: .1em; }
.telemetry-cell strong { display: block; overflow: hidden; color: #dbe3e9; font: 12px var(--mono); text-overflow: ellipsis; white-space: nowrap; }
.gold-text { color: var(--gold) !important; }
.blue-text { color: var(--blue) !important; }
.green-text { color: var(--green) !important; }

.control-strip { display: grid; gap: 15px; margin-bottom: 9px; padding: 13px; border: 1px solid var(--line); border-radius: 7px; background: rgba(14,21,30,.88); }
.control-group { display: grid; gap: 8px; min-width: 0; }
.control-label, .summary-label { color: #71818f; font: 9px var(--mono); letter-spacing: .11em; }
.segmented { display: flex; min-width: max-content; }
.segmented-scroll { overflow-x: auto; padding-bottom: 2px; scrollbar-width: thin; scrollbar-color: var(--gold-soft) transparent; }
.segmented button, select, input { min-height: 38px; border: 1px solid var(--line); background: #111b26; color: #9eacb7; cursor: pointer; }
.segmented button { padding: 0 12px; font: 10px var(--mono); }
.segmented button + button { border-left: 0; }
.segmented button:first-child { border-radius: 4px 0 0 4px; }
.segmented button:last-child { border-radius: 0 4px 4px 0; }
.segmented button:hover, .segmented button.selected { border-color: #5f7282; background: #253545; color: var(--text); }
select, input { width: 100%; border-radius: 4px; padding: 0 11px; outline: 0; }
input::placeholder { color: #586978; }
select:focus, input:focus, button:focus-visible { border-color: var(--gold); outline: 2px solid rgba(242,189,91,.2); outline-offset: 1px; }
.stream-note { display: flex; align-items: center; gap: 7px; min-height: 38px; color: var(--green); font: 9px var(--mono); letter-spacing: .06em; }
.gate-check { display: grid; width: 17px; height: 17px; place-items: center; border: 1px solid #397458; border-radius: 50%; font-size: 10px; }

.summary-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 7px; margin-bottom: 16px; }
.summary-card { min-height: 94px; padding: 13px; border: 1px solid var(--line-soft); background: rgba(15,23,32,.78); }
.summary-card strong { display: block; margin-top: 11px; color: #e6edf1; font: 24px var(--mono); letter-spacing: -.05em; }
.summary-card small { display: block; margin-top: 5px; color: var(--dim); font: 10px var(--mono); }

.panel { margin-bottom: 14px; overflow: hidden; border: 1px solid var(--line-soft); border-radius: 7px; background: rgba(13,20,29,.84); }
.panel-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; padding: 16px 14px 13px; border-bottom: 1px solid var(--line-soft); }
.panel-heading.simple { border-bottom: 0; padding-bottom: 9px; }
.panel-kicker { margin-bottom: 7px; color: var(--gold); font: 9px var(--mono); letter-spacing: .13em; }
.panel h2 { margin: 0; color: #e8eef2; font-size: 19px; line-height: 1.12; letter-spacing: -.035em; font-weight: 500; }
.panel-description { max-width: 340px; color: #71818f; font-size: 11px; line-height: 1.4; text-align: right; }
.watchlist-head { display: grid; grid-template-columns: minmax(0, 1fr) auto 62px; gap: 10px; padding: 10px 13px; border-bottom: 1px solid var(--line); color: #5f7080; font: 9px var(--mono); letter-spacing: .1em; }
.watchlist-head span:nth-child(3) { text-align: right; }
.family-list { display: grid; }
.family-row { display: grid; grid-template-columns: minmax(0, 1fr) auto 62px; gap: 10px; align-items: center; width: 100%; min-height: 70px; padding: 10px 13px; border: 0; border-bottom: 1px solid #19242e; background: transparent; color: var(--text); text-align: left; cursor: pointer; }
.family-row:last-child { border-bottom: 0; }
.family-row:hover, .family-row.active { background: #13202c; }
.family-list > .detail-panel { margin: 0; border-right: 0; border-left: 0; border-radius: 0; background: #0c141d; }
.family-list > .family-row.active { border-bottom-color: #304758; }
.family-main { display: flex; align-items: center; gap: 9px; min-width: 0; }
.family-league { display: grid; width: 37px; height: 27px; flex: 0 0 auto; place-items: center; border: 1px solid #334452; border-radius: 4px; color: #afc0cc; font: 8px var(--mono); }
.family-league.ncaaf { color: #f0a473; border-color: #70503d; }
.family-league.nfl { color: var(--blue); border-color: #365978; }
.family-league.nba { color: var(--violet); border-color: #564476; }
.family-league.mlb { color: #ec8c82; border-color: #704340; }
.family-league.mma { color: #e5b05d; border-color: #715a2c; }
.family-league.tennis { color: #8fd28b; border-color: #3c6f4a; }
.family-league.mentions { color: var(--cyan); border-color: #316866; }
.family-title { display: grid; min-width: 0; gap: 5px; }
.family-title strong { overflow: hidden; color: #dbe4e9; font-size: 13px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.family-title small { overflow: hidden; color: #627382; font: 9px var(--mono); text-overflow: ellipsis; white-space: nowrap; }
.family-row.sports-live { background: linear-gradient(90deg, rgba(31,86,67,.22), transparent 72%); }
.family-row.sports-live:hover, .family-row.sports-live.active { background: linear-gradient(90deg, rgba(31,105,78,.32), #13202c 72%); }
.family-sport-board { display: grid; grid-template-columns: auto minmax(135px, 1fr) auto auto; align-items: center; gap: 8px; min-width: 0; margin-top: 2px; padding: 5px 7px; border-left: 2px solid #344755; background: rgba(18,31,42,.68); }
.family-sport-board.is-live { border-left-color: var(--green); background: rgba(31,86,67,.2); }
.family-sport-board.is-stale { border-left-color: #68552d; opacity: .72; }
.family-sport-kicker { color: #8196a5; font: 8px var(--mono); letter-spacing: .08em; }
.family-sport-board.is-live .family-sport-kicker { color: var(--green); }
.family-sport-lines { display: grid; gap: 1px; min-width: 0; }
.family-sport-line { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; color: #cbd8df; font: 10px var(--mono); }
.family-sport-line span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.family-sport-line.has-control { color: #f4fbf8; }
.family-sport-team-name { display: inline-flex; align-items: center; min-width: 0; gap: 6px; }
.family-sport-team-name > span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.scoreboard-control-indicator { display: inline-grid; width: 18px; height: 18px; place-items: center; flex: 0 0 18px; color: var(--green); line-height: 1; }
.scoreboard-control-icon { display: block; width: 18px; height: 18px; overflow: visible; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.35; }
.family-sport-line b { color: #f1f6f8; font: 600 11px var(--mono); }
.family-sport-status { color: #92b1c1; font: 9px var(--mono); white-space: nowrap; }
.family-sport-board.is-live .family-sport-status { color: var(--green); }
.scoreboard-stale { color: #d5aa58; font: 8px var(--mono); letter-spacing: .06em; white-space: nowrap; }
.family-state { display: flex; align-items: center; gap: 5px; color: #a7b5bf; font: 9px var(--mono); white-space: nowrap; }
.family-state i { width: 6px; height: 6px; border-radius: 50%; background: #7f8d98; }
.state-armed { color: var(--blue); }.state-armed i { background: var(--blue); }
.state-accepted-expansion, .state-fire-up, .state-fire-down { color: var(--gold); }.state-accepted-expansion i, .state-fire-up i, .state-fire-down i { background: var(--gold); }
.state-tradeable { color: var(--green); }.state-tradeable i { background: var(--green); }
.state-warming { color: #e9c06f; border-color: #6a5632; background: #2b2419; }.state-warming i { background: #e9c06f; }
.family-title small { line-height: 1.35; }
.state-momentum-shift { color: var(--violet); }.state-momentum-shift i { background: var(--violet); }
.family-updated { color: #5e6d7b; font: 9px var(--mono); text-align: right; white-space: nowrap; }

.detail-panel { scroll-margin-top: 10px; }
.detail-empty { display: grid; min-height: 275px; place-items: center; align-content: center; gap: 9px; padding: 32px 18px; color: #7c8b98; text-align: center; }
.detail-empty strong, .empty-state strong { color: #d2dce3; font-size: 14px; font-weight: 500; }
.detail-empty span, .empty-state span { max-width: 390px; color: #637381; font-size: 12px; line-height: 1.5; }
.empty-icon { display: grid; width: 39px; height: 39px; place-items: center; margin-bottom: 3px; border: 1px solid #43515e; border-radius: 50%; color: var(--gold); font-size: 21px; }
.empty-state { display: grid; min-height: 210px; place-items: center; align-content: center; gap: 9px; padding: 28px 15px; text-align: center; }
.empty-state.compact { min-height: 155px; }
.detail-content { padding-bottom: 14px; }
.detail-topline { display: flex; align-items: start; justify-content: space-between; gap: 14px; padding: 16px 14px 12px; border-bottom: 1px solid var(--line-soft); }
.detail-topline h2 { max-width: 720px; }
.detail-subtitle { display: block; overflow: hidden; margin-top: 7px; color: #70808e; font: 10px var(--mono); text-overflow: ellipsis; white-space: nowrap; }
.detail-actions { display: flex; align-items: end; gap: 10px; flex-shrink: 0; }
.chart-period-control { display: grid; gap: 6px; min-width: 98px; }
.chart-period-control label { color: #5f7180; font: 8px var(--mono); letter-spacing: .08em; }
.chart-period-control select { width: auto; min-width: 98px; min-height: 32px; padding: 0 8px; color: #dbe5eb; font: 9px var(--mono); }
.close-detail { min-height: 32px; padding: 0 10px; color: #8797a4; font: 9px var(--mono); }
.status-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; margin: 0 14px 11px; border: 1px solid var(--line-soft); background: var(--line-soft); }
.status-cell { min-width: 0; min-height: 59px; padding: 10px; background: #101923; }
.status-cell span { display: block; margin-bottom: 7px; color: #5f7180; font: 8px var(--mono); letter-spacing: .08em; }
.status-cell strong { display: block; overflow: hidden; color: #dfe8ed; font: 11px var(--mono); text-overflow: ellipsis; white-space: nowrap; }
.detail-scoreboard { display: grid; gap: 4px; min-width: 0; }
.detail-scoreboard-lines { display: grid; gap: 2px; }
.detail-scoreboard-lines > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: #e0e9ed; font: 11px var(--mono); }
.detail-scoreboard-lines > div.has-control > span { color: #f7fffb; }
.detail-scoreboard-lines > div span { overflow: hidden; margin: 0; color: #e0e9ed; font: 11px var(--mono); letter-spacing: 0; text-overflow: ellipsis; white-space: nowrap; }
.detail-scoreboard-lines > div .scoreboard-control-indicator { margin-left: auto; }
.detail-scoreboard-lines b { color: #fff; font: 600 12px var(--mono); }
.detail-scoreboard-status { color: #93b4c4; font: 9px var(--mono); white-space: nowrap; }
.detail-scoreboard-status.is-live { color: var(--green); }
.detail-scoreboard-status.is-stale { color: #d5aa58; }
.chart-meta { display: flex; justify-content: space-between; gap: 7px; padding: 0 14px 9px; color: #687a88; font: 9px var(--mono); letter-spacing: .03em; }
.chart-meta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chart-shell { width: 100%; padding: 0 7px; }
.crush-chart { display: block; width: 100%; height: auto; min-height: 235px; }
.chart-bg { fill: #000 !important; stroke: #fff !important; stroke-width: 1; }
.grid-line { stroke: #fff !important; stroke-width: 1; }
.pane-divider { stroke: #fff !important; stroke-width: 1; }
.zero-line { stroke: #fff !important; stroke-width: 1; stroke-dasharray: 3 5; }
.axis-label { fill: #fff !important; font: 10px var(--mono); }
.x-axis { fill: #fff !important; }
.pane-label { fill: #fff !important; font: 10px var(--mono); letter-spacing: .1em; }
.indicator { fill: none; stroke-width: 2; vector-effect: non-scaling-stroke; }
.bb-path { stroke: var(--blue); opacity: .76; }
.kc-path { stroke: var(--violet); stroke-dasharray: 5 4; opacity: .74; }
.candle line { stroke-width: 1.35; vector-effect: non-scaling-stroke; }
.candle rect { rx: .7px; }
.release-mark line { stroke: var(--gold); stroke-width: 1; stroke-dasharray: 4 5; opacity: .56; vector-effect: non-scaling-stroke; }
.release-mark polygon { fill: var(--gold); stroke: #fff0c9; stroke-width: 1; vector-effect: non-scaling-stroke; }
.release-label { fill: var(--gold); font: 9px var(--mono); letter-spacing: .04em; }
.momentum-bar { opacity: .92; }
.momentum-shift-mark line { stroke: var(--gold); stroke-width: 1.2; stroke-dasharray: 2 3; opacity: .9; vector-effect: non-scaling-stroke; }
.momentum-shift-mark polygon { fill: var(--gold); stroke: #fff0c9; stroke-width: 1; vector-effect: non-scaling-stroke; }
.squeeze-dot { stroke-width: 1.1; vector-effect: non-scaling-stroke; }
.squeeze-low { fill: #0b0d10; stroke: #dbe5eb; }
.squeeze-mid { fill: #d94d59; stroke: #ffb8bc; }
.squeeze-high { fill: #ef8e2f; stroke: #ffd39d; }
.squeeze-none { fill: #35c98a; stroke: #c8ffe1; }
.squeeze-fired { stroke-width: 1.8; }
.chart-empty { display: grid; min-height: 270px; place-items: center; align-content: center; gap: 8px; padding: 25px; color: #697985; text-align: center; }
.chart-empty strong { color: #d1dce2; font-size: 14px; font-weight: 500; }.chart-empty span { font-size: 12px; }.chart-empty.error strong { color: var(--coral); }
.retry-button { min-height: 36px; margin-top: 5px; padding: 0 13px; color: var(--gold); font: 9px var(--mono); }
.chart-legend { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px 0; padding: 14px 14px 8px; color: #82919d; font: 10px var(--mono); }
.legend-group { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; min-height: 28px; padding: 0 18px; border-right: 1px solid #263b46; }
.legend-group:first-child { padding-left: 0; }.legend-group:last-child { border-right: 0; padding-right: 0; }
.legend-group-title { color: #6f8793; font: 700 9px var(--mono); letter-spacing: .14em; }
.legend-item { display: inline-flex; align-items: center; gap: 6px; color: #bdcbd1; white-space: nowrap; }
.legend-item b { max-width: 145px; overflow: hidden; color: #e5edf0; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.legend-note { color: #718691; font-size: 9px; letter-spacing: .04em; white-space: nowrap; }
.legend-candle, .legend-line, .legend-dot, .legend-release { display: inline-block; flex: 0 0 auto; }
.legend-candle { width: 7px; height: 12px; border-radius: 1px; }.legend-candle.up { background: var(--green); }.legend-candle.down { background: var(--coral); }
.legend-dot.momentum-positive.momentum-dark { background: #159f8a; }.legend-dot.momentum-positive.momentum-light { background: #67d8c8; }.legend-dot.momentum-negative.momentum-dark { background: #b8323d; }.legend-dot.momentum-negative.momentum-light { background: #f0848b; }
.momentum-outcome-label { display: inline-block; max-width: 10rem; overflow: hidden; color: #e5edf0; text-overflow: ellipsis; vertical-align: bottom; white-space: nowrap; }
.momentum-legend-group { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px; width: min(100%, 760px); }
.momentum-legend-group .legend-group-title { grid-column: 1 / -1; }
.momentum-legend-group .legend-item { min-width: 0; white-space: normal; line-height: 1.35; }
.legend-dot.squeeze-low { background: #0b0d10; box-shadow: 0 0 0 1px #cbd5dc; }.legend-dot.squeeze-mid { background: #d94d59; }.legend-dot.squeeze-high { background: #ef8e2f; }.legend-dot.squeeze-none { background: #35c98a; }
.legend-line { width: 16px; height: 0; border-top: 2px solid; }.legend-line.bb { border-color: var(--blue); }.legend-line.kc { border-color: var(--violet); border-top-style: dashed; }
.legend-dot { width: 7px; height: 7px; border-radius: 50%; }.legend-dot.squeeze-on { background: #a78bfa; }.legend-dot.squeeze-off { background: #64748b; }.legend-dot.squeeze-fire { background: var(--gold); box-shadow: 0 0 0 1px #fff0c9; }
.legend-release { width: 8px; height: 8px; transform: rotate(45deg); background: var(--gold); }
.legend-shift { width: 8px; height: 8px; border: 1px solid #fff0c9; transform: rotate(45deg); background: var(--gold); }
.read-note { display: grid; gap: 5px; margin: 10px 14px 0; padding: 11px 12px; border: 1px solid #2c3d4a; border-left: 2px solid var(--gold); background: #111b25; color: #93a1ac; font-size: 12px; line-height: 1.45; }.read-note strong { color: #e1e8ec; font-weight: 500; }

.leaderboard-list { display: grid; padding: 0 14px 5px; }
.leader-row { display: grid; grid-template-columns: 27px minmax(0,1fr) auto auto; gap: 9px; align-items: center; min-height: 58px; border-bottom: 1px solid #19242e; }.leader-row:last-child { border-bottom: 0; }
.leader-rank { color: var(--gold); font: 14px var(--mono); }.leader-title { display: grid; min-width: 0; gap: 4px; }.leader-title strong { overflow: hidden; color: #dce5e9; font-size: 12px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }.leader-title small, .leader-score small { color: #627482; font: 9px var(--mono); }.leader-score { display: grid; gap: 3px; text-align: right; }.leader-score strong { color: var(--green); font: 12px var(--mono); }.leader-seen { color: #60717f; font: 9px var(--mono); white-space: nowrap; }

.method-grid { display: grid; gap: 14px; }.method-grid .panel { margin-bottom: 0; }.method-flow { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: 7px; padding: 2px 14px 15px; }.flow-step { display: grid; gap: 4px; min-width: 0; }.flow-step span { color: #5d7080; font: 9px var(--mono); }.flow-step strong { overflow: hidden; color: #b8c5ce; font: 10px var(--mono); text-overflow: ellipsis; white-space: nowrap; }.flow-step small { color: #677885; font-size: 10px; line-height: 1.25; }.flow-step.active strong { color: var(--gold); }.flow-arrow { color: #4f6472; font-size: 16px; }.method-note { display: flex; gap: 9px; padding: 12px 14px; border-top: 1px solid var(--line-soft); color: #85949f; font-size: 11px; line-height: 1.45; }.note-mark { display: grid; width: 16px; height: 16px; flex: 0 0 auto; place-items: center; border: 1px solid #60707c; border-radius: 50%; color: #bdc9d0; font: 10px var(--mono); }.source-list { padding: 0 14px 7px; }.source-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 39px; border-bottom: 1px solid #19242e; font: 10px var(--mono); }.source-row:last-child { border-bottom: 0; }.source-name { display: flex; align-items: center; gap: 7px; color: #a1afb9; }.source-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--green); }.source-dot.muted { background: #536471; }.source-state { color: var(--green); font-size: 9px; white-space: nowrap; }.muted-text { color: #627381 !important; }.data-foot { padding: 5px 14px 12px; color: #60717e; font: 10px/1.45 var(--mono); }
.footer { display: flex; justify-content: space-between; gap: 12px; padding: 18px 2px 4px; color: #4c5e6b; font: 9px var(--mono); letter-spacing: .05em; }.footer a { color: #7b8b97; }
.nav-item { text-decoration: none; }
.toast { position: fixed; right: 14px; bottom: 14px; max-width: calc(100vw - 28px); padding: 11px 13px; border: 1px solid #556978; border-radius: 5px; background: #182631; color: #e1e9ed; font: 10px var(--mono); opacity: 0; pointer-events: none; transform: translateY(8px); transition: .2s; }.toast.show { opacity: 1; transform: translateY(0); }

@media (max-width: 699px) {
  .family-sport-board { grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 4px 8px; }
  .family-sport-kicker { grid-row: span 2; padding-top: 2px; }
  .family-sport-status, .scoreboard-stale { grid-column: 2; }
  .family-sport-status { margin-top: -1px; }
  .family-row { align-items: start; }
  .family-state, .family-updated { align-self: center; }
  .detail-scoreboard-lines > div span { max-width: 125px; }
}

@media (min-width: 700px) {
  .main-content { padding: 0 26px 34px; }
  .topbar { min-height: 74px; }.mobile-brand { display: none; }.breadcrumb { display: block; }
  .hero-row { grid-template-columns: minmax(0, 1fr) auto; align-items: end; padding: 50px 0 38px; }.hero-telemetry { min-width: 400px; }.telemetry-cell { padding: 15px 18px; }.telemetry-cell:last-child { display: block; border-right: 0; }
  .control-strip { grid-template-columns: minmax(0, 1.2fr) auto minmax(180px, .75fr) auto; align-items: end; gap: 14px; padding: 14px 16px; }.feed-group { min-width: 0; }.stream-note { justify-self: end; }
  .summary-grid { grid-template-columns: repeat(4, 1fr); gap: 9px; }.summary-card { min-height: 104px; padding: 15px; }
  .panel-heading { padding: 19px 19px 15px; }.watchlist-head { grid-template-columns: minmax(0,1fr) auto 85px; padding: 11px 19px; }.watchlist-head span:nth-child(3) { text-align: right; }
  .family-row { grid-template-columns: minmax(0,1fr) auto 85px; min-height: 64px; padding: 9px 19px; }.family-updated { display: block; }.family-league { width: 43px; }
  .status-grid.has-sports { grid-template-columns: repeat(4, 1fr); }
  .status-grid { grid-template-columns: repeat(6, 1fr); margin: 0 19px 13px; }.detail-topline { padding: 19px 19px 14px; }.chart-meta { padding: 0 19px 10px; }.chart-shell { padding: 0 12px; }.chart-legend, .read-note { margin-left: 19px; margin-right: 19px; }.chart-legend { padding-left: 0; padding-right: 0; }
  .leaderboard-list { padding-left: 19px; padding-right: 19px; }.method-grid { grid-template-columns: 1.25fr .9fr; }.method-flow { padding-left: 19px; padding-right: 19px; }.method-note { padding-left: 19px; padding-right: 19px; }.source-list { padding-left: 19px; padding-right: 19px; }.data-foot { padding-left: 19px; padding-right: 19px; }.footer { padding-left: 2px; padding-right: 2px; }
}

@media (min-width: 1040px) {
  .app-shell { display: flex; }.sidebar { display: flex; width: 224px; flex: 0 0 224px; flex-direction: column; padding: 28px 17px 20px; border-right: 1px solid var(--line-soft); background: rgba(7,11,17,.82); }.main-content { flex: 1; padding-left: 42px; padding-right: 42px; }.brand-lockup { display: flex; align-items: center; gap: 11px; padding: 0 8px 35px; }.brand-mark { display: flex; align-items: end; gap: 3px; width: 23px; height: 32px; }.brand-mark span { display: block; width: 5px; border-radius: 2px; background: var(--gold); }.brand-mark span:nth-child(1) { height: 13px; opacity: .55; }.brand-mark span:nth-child(2) { height: 23px; opacity: .78; }.brand-mark span:nth-child(3) { height: 32px; }.brand-name { font-size: 14px; font-weight: 700; line-height: 1.03; letter-spacing: .14em; }.brand-name em { color: var(--gold); font-style: normal; }.brand-kicker { margin-top: 7px; color: var(--muted); font: 10px var(--mono); letter-spacing: .18em; }.nav-section-label { margin: 0 8px 10px; color: #536471; font: 10px var(--mono); letter-spacing: .18em; text-transform: uppercase; }.nav-list { display: grid; gap: 4px; margin-bottom: 30px; }.nav-item { display: flex; align-items: center; gap: 10px; padding: 11px 9px; border: 0; border-radius: 5px; background: transparent; color: #94a3af; cursor: pointer; font: 500 13px var(--sans); text-align: left; }.nav-item:hover, .nav-item.active { background: #162330; color: var(--text); }.nav-item.active { box-shadow: inset 2px 0 0 var(--gold); }.nav-icon { width: 16px; color: var(--gold); font-size: 16px; text-align: center; }.nav-count { margin-left: auto; color: var(--gold); font: 11px var(--mono); }.universe-list { display: grid; gap: 6px; margin: 0 8px; }.universe-row { display: flex; align-items: center; gap: 9px; padding: 5px 0; color: #9aa8b3; font-size: 13px; }.universe-status { margin-left: auto; color: #62727f; font: 10px var(--mono); }.league-dot { width: 7px; height: 7px; border-radius: 50%; background: #71818f; }.league-dot.ncaaf { background: #d3845e; }.league-dot.nfl { background: var(--blue); }.league-dot.nba { background: var(--violet); }.league-dot.mlb { background: #eb8479; }.league-dot.mma { background: var(--gold); }.league-dot.tennis { background: #8fd28b; }.league-dot.mentions { background: var(--cyan); }.sidebar-foot { margin-top: auto; }.mode-card { display: flex; align-items: center; gap: 9px; padding: 11px; border: 1px solid #403821; border-radius: 5px; background: linear-gradient(135deg, rgba(71,52,20,.4), rgba(16,21,28,.25)); }.pulse-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 4px rgba(242,189,91,.1); }.mode-card strong { display: block; color: var(--gold); font: 11px var(--mono); letter-spacing: .05em; }.mode-card small { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; }.sidebar-meta { padding: 18px 9px 0; color: #52626f; font: 9px/1.7 var(--mono); letter-spacing: .1em; }
}

/* Public beta trading workspace */
:root { --bg:#080c12; --panel:#101720; --line:#293440; --line-soft:#202b37; --text:#f0f4f8; --muted:#a1adbb; --dim:#8291a2; --gold:#edc477; --green:#58d6a0; }
body { background:#080c12; font-size:16px; }
.main-content { max-width:1760px; min-width:0; padding:0 24px 28px; }
.topbar { min-height:76px; position:relative; }
.breadcrumb { font-size:12px; letter-spacing:.1em; }
.breadcrumb strong { color:var(--gold); }
.api-status { font-size:12px; letter-spacing:0; }
.icon-button { width:42px; min-height:42px; border-radius:8px; }
.mobile-brand strong { font-size:15px; letter-spacing:.04em; }.mobile-brand small { display:none; }
.hero-row { grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:24px; padding:28px 0 24px; }
h1 { font-size:clamp(28px,3vw,44px); letter-spacing:-.045em; line-height:1.12; margin:10px 0; }
.hero-copy { max-width:none; font-size:16px; color:#a3b1bf; }
.eyebrow { font-size:12px; letter-spacing:.13em; }.eyebrow-tag { font-size:12px; letter-spacing:.04em; border-radius:4px; border-color:#6a5430; padding:4px 7px; color:var(--gold); }.eyebrow-line { display:none; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:16px; }
.hero-link { font:14px var(--sans); margin-top:10px; letter-spacing:0; }
.hero-actions .support-link { padding-left:16px; border-left:1px solid #394653; }
.hero-telemetry { display:grid; min-width:260px; grid-template-columns:1fr 1fr; border-radius:10px; background:#0e151e; }.telemetry-cell:last-child { display:none; }.telemetry-cell { padding:16px; }.telemetry-cell span { font-size:12px; letter-spacing:.02em; color:var(--muted); }.telemetry-cell strong { font-size:16px; }.telemetry-cell:nth-child(2) strong { color:var(--gold); }
.stage-ribbon { display:flex; align-items:center; gap:28px; padding:15px 20px; margin-bottom:20px; background:linear-gradient(105deg,#1d2023,#111922 70%); border:1px solid #39382f; border-radius:10px; }
.stage-ribbon>div { display:flex; align-items:center; gap:12px; flex:1; }.stage-ribbon b { font:14px var(--mono); color:var(--gold); border:1px solid #584a33; padding:8px; border-radius:7px; }.stage-ribbon span { display:grid; gap:3px; }.stage-ribbon strong { font-size:14px; font-weight:500; }.stage-ribbon small { font-size:12px; color:var(--muted); }.stage-ribbon a { color:var(--gold); text-decoration:none; font-size:14px; white-space:nowrap; }
.control-strip { display:grid; grid-template-columns:170px minmax(200px,1fr) auto; gap:14px; padding:18px; border-radius:12px; margin-bottom:12px; background:#101720; }
.feed-group { grid-column:1/-1; }.control-label,.summary-label { font-size:12px; letter-spacing:.06em; color:#a0aebe; }
.segmented { min-width:0; gap:5px; padding:0 0 3px; }.segmented button { flex:1; font:500 14px var(--sans); min-height:42px; padding:0 14px; border:1px solid transparent; border-radius:7px!important; background:transparent; color:#97a7b8; }.segmented button+button { border-left:1px solid transparent; }.segmented button.selected { color:#f4d697; background:#332b1f; border-color:#76603b; }.segmented button:hover { background:#233040; }.segmented-scroll { max-width:100%; overflow-x:auto; }
select,input { min-height:44px; font-size:16px; border-radius:7px; background:#0a111a; color:#d8e2ec; }input::placeholder { color:#8492a3; }.stream-note { font:12px var(--sans); letter-spacing:0; }
.summary-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; border:1px solid var(--line-soft); border-radius:10px; overflow:hidden; margin-bottom:22px; background:#0e151e; }.summary-card { min-height:96px; padding:15px 18px; border:0; border-right:1px solid var(--line-soft); background:transparent; }.summary-card:last-child { border:0; }.summary-card strong { margin-top:8px; font-size:25px; letter-spacing:-.03em; }.summary-card small { font:12px var(--sans); color:var(--muted); }
.panel { background:#0d141d; border-radius:12px; border-color:#293440; }.panel-heading { padding:21px 20px 17px; align-items:center; }.panel-kicker { font-size:12px; letter-spacing:.1em; }.panel h2 { font-size:24px; font-weight:600; line-height:1.25; }.panel-description { max-width:380px; font-size:14px; color:#9baabb; }
.watchlist-head { grid-template-columns:minmax(0,1fr) 155px 100px 44px; padding:13px 20px; font-size:12px; color:#95a5b6; gap:14px; background:#101923; }.watchlist-head span:nth-child(3) { text-align:right; }.link-col-label { font-size:10px; text-align:center; }
.event-row { display:grid; grid-template-columns:minmax(0,1fr) 44px; align-items:center; gap:14px; padding:0 20px; border-bottom:1px solid #202b37; }.event-row:has(.active) { background:#182636; box-shadow:inset 3px 0 var(--gold); }.event-row:hover { background:#152130; }.family-row { grid-template-columns:minmax(0,1fr) 155px 100px; gap:14px; padding:17px 0; min-height:86px; border:0; }.family-row:hover,.family-row.active { background:transparent; }.family-title { gap:7px; }.family-title strong { font-size:16px; font-weight:500; white-space:normal; line-height:1.4; }.family-title small { font:12px var(--sans); color:#8c9eaf; }.family-main { gap:14px; }.family-league { width:62px; height:34px; font:12px var(--mono); border-radius:7px; background:#111d29; }.family-state { font:12px var(--sans); justify-self:start; padding:7px 9px; background:#1b2733; border:1px solid #344250; border-radius:6px; }.state-compressed,.state-armed { color:#99c9fa; border-color:#3b5a78; background:#15283b; }.state-fire-up,.state-fire-down,.state-accepted-expansion { color:#f5cf86; background:#332a1a; border-color:#6f5832; }.state-momentum-shift { color:#c9b5f4; background:#282137; border-color:#564470; }.family-updated { font:12px var(--mono); color:#93a4b6; }.event-kalshi { width:40px; height:40px; display:grid; place-items:center; color:#a7b8c8; border:1px solid #344453; border-radius:8px; text-decoration:none; font-size:22px; }.event-kalshi:hover { color:var(--gold); border-color:var(--gold); background:#28251e; }
.detail-topline { padding:24px; flex-wrap:wrap; }.detail-topline>div:first-child { min-width:0; flex:1 1 320px; }.detail-topline h2 { max-width:800px; font-size:26px; overflow-wrap:anywhere; }.detail-subtitle { font:14px var(--sans); color:#a2b2c1; white-space:normal; }.detail-actions { flex-wrap:wrap; gap:10px; }.chart-period-control label { font-size:12px; color:var(--muted); }.chart-period-control select,.close-detail { min-height:42px; font-size:14px; }.kalshi-button { display:flex; align-items:center; min-height:42px; padding:0 16px; border-radius:7px; background:var(--gold); color:#17130d; font-size:14px; font-weight:700; text-decoration:none; white-space:nowrap; }.kalshi-button:hover { background:#ffe1a3; }
.signal-brief { margin:18px 24px; padding:17px 20px; background:#122033; border:1px solid #334c67; border-left:3px solid var(--blue); border-radius:8px; }.signal-overline { display:block; font:12px var(--mono); color:#9eb8d3; letter-spacing:.08em; }.signal-brief strong { display:block; font-size:21px; margin:7px 0; }.signal-brief p { margin:0; font-size:15px; line-height:1.55; color:#b4c1ce; }.signal-brief[data-stage="fire"] { background:#272217; border-color:#746039; border-left-color:var(--gold); }.signal-brief[data-stage="fading"] { background:#211b2d; border-color:#645078; border-left-color:#be9be6; }
.status-grid,.status-grid.has-sports { grid-template-columns:repeat(3,minmax(0,1fr)); margin:0 24px 18px; border-radius:8px; overflow:hidden; }.status-cell { padding:14px 16px; }.status-cell>span { font-size:12px; color:#93a5b7; letter-spacing:.04em; }.status-cell strong { font:14px/1.45 var(--sans); white-space:normal; overflow:visible; overflow-wrap:anywhere; }.status-cell:nth-child(5) { grid-column:span 2; }
.chart-reference { margin:16px 24px 12px; color:#d7e3ed; font-size:14px; }.chart-meta { font-size:12px; padding:0 24px 12px; }.chart-shell { padding:0 16px; overflow-x:auto; }.crush-chart { min-width:640px; }.chart-legend { gap:12px 18px; font:12px var(--sans); color:#a6b6c5; }.chart-legend b { max-width:none; white-space:normal; }.read-note { margin:18px 24px 6px; padding:16px; font-size:14px; color:#a7b7c6; }.read-note strong { font-size:15px; }
.family-sport-board { padding:8px 10px; }.family-sport-kicker,.scoreboard-stale { font-size:12px; }.family-sport-line,.family-sport-status,.detail-scoreboard-status { font-size:13px; }.family-sport-line b,.detail-scoreboard-lines>div span,.detail-scoreboard-lines b { font-size:14px; }
.leader-title strong { font-size:15px; }.leader-title small,.leader-score small,.leader-seen { font-size:12px; }.leader-score strong { font-size:16px; }.leader-row { min-height:78px; }
.method-grid { margin-top:22px; }.flow-step strong { font:14px var(--sans); white-space:normal; }.flow-step small { font-size:13px; }.flow-step span { font-size:12px; }.method-flow { gap:12px; padding:16px 20px; }.method-note { font-size:14px; line-height:1.6; padding:18px 20px; }.source-row,.source-state { font-size:13px; }.data-foot { font:14px/1.6 var(--sans); color:#95a7b8; padding:12px 20px 20px; }.source-dot { background:#7b8c9d; }.footer { font-size:12px; line-height:1.6; flex-wrap:wrap; color:#8a9cad; padding-top:24px; }
.empty-state strong,.detail-empty strong,.chart-empty strong { font-size:17px; }.empty-state span,.detail-empty span,.chart-empty span { font-size:15px; color:#91a3b4; }.detail-empty { min-height:170px; }.toast { font-size:14px; }
@media(min-width:1200px) { .sidebar { width:204px; flex-basis:204px; position:sticky; top:0; height:100vh; padding:28px 14px; background:#0b1119; }.brand-name { font-size:16px; letter-spacing:.09em; }.brand-kicker { font-size:12px; letter-spacing:.04em; }.nav-item { min-height:44px; font-size:14px; }.nav-section-label,.mode-card strong,.mode-card small,.sidebar-meta { font-size:12px; }.universe-row { font-size:14px; }.universe-status { font-size:12px; }.main-content { padding:0 32px 32px; } }
@media(min-width:1040px) and (max-width:1199px) { .sidebar { display:none; }.mobile-brand { display:flex; }.breadcrumb { display:none; } }
@media(max-width:900px) { .hero-row { grid-template-columns:1fr; gap:16px; }.hero-telemetry { display:none; }.stage-ribbon { gap:14px; padding:14px; }.stage-ribbon>a { display:none; }.stage-ribbon small { line-height:1.4; }.stage-ribbon b { display:none; }.panel-description { max-width:300px; }.method-grid { grid-template-columns:1fr; }.status-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.status-cell:nth-child(5) { grid-column:auto; } }
@media(max-width:699px) { .main-content { padding:0 12px 24px; }.topbar { min-height:66px; gap:8px; }.mobile-brand { gap:7px; }.mobile-brand strong { font-size:13px; }.api-status { font-size:11px; }.topbar-actions { gap:8px; }.icon-button { width:36px; min-height:38px; }.hero-row { padding:20px 4px 18px; }.hero-row h1 { font-size:29px; }.hero-copy { font-size:15px; line-height:1.5; }.hero-link { margin-top:8px; }.eyebrow { font-size:12px; }.stage-ribbon { gap:12px; margin-bottom:16px; }.stage-ribbon>div { align-self:start; }.stage-ribbon strong { font-size:13px; line-height:1.3; }.stage-ribbon small { font-size:12px; }.control-strip { grid-template-columns:125px minmax(0,1fr); gap:12px; padding:13px; }.stream-note { display:none; }.segmented button { flex:0 0 auto; padding:0 13px; min-height:40px; }.control-label { font-size:12px; }.summary-grid { grid-template-columns:repeat(3,minmax(0,1fr)); margin-bottom:16px; }.summary-card { padding:12px 10px; min-height:86px; }.summary-card:last-child { display:none; }.summary-card:nth-child(3) { border:0; }.summary-label { font:11px var(--sans); letter-spacing:0; }.summary-card strong { font-size:23px; }.summary-card small { font-size:12px; line-height:1.4; }.panel-heading { display:block; padding:17px 14px; }.panel h2 { font-size:22px; }.panel-description { text-align:left; max-width:none; margin-top:8px; font-size:14px; }.watchlist-head { grid-template-columns:1fr 40px; padding:11px 14px; }.watchlist-head span:nth-child(2),.watchlist-head span:nth-child(3) { display:none; }.event-row { grid-template-columns:minmax(0,1fr) 36px; padding:0 12px; gap:8px; }.family-row { grid-template-columns:minmax(0,1fr) auto; gap:10px 8px; padding:15px 0; }.family-main { grid-column:1/-1; align-items:start; gap:10px; }.family-league { width:54px; height:30px; font-size:11px; }.family-title strong { font-size:15px; line-height:1.4; }.family-title small { font-size:12px; }.family-state { margin-left:64px; padding:5px 7px; font-size:12px; }.family-updated { font-size:11px; }.event-kalshi { width:36px; height:40px; }.family-sport-board { grid-template-columns:1fr; gap:5px; padding:8px; }.family-sport-kicker,.family-sport-lines,.family-sport-status,.scoreboard-stale { grid-column:1; grid-row:auto; }.family-sport-lines { min-width:0; }.family-sport-line { font-size:12px; }.detail-topline { padding:18px 14px; gap:16px; }.detail-topline h2 { font-size:23px; }.detail-topline>div:first-child { flex-basis:100%; }.detail-actions { width:100%; justify-content:space-between; align-items:end; gap:8px; }.kalshi-button { padding:0 12px; font-size:13px; }.chart-period-control { min-width:80px; }.chart-period-control select { min-width:80px; }.chart-period-control label { font-size:11px; }.close-detail { font-size:12px; padding:0 8px; }.signal-brief { margin:14px; padding:14px; }.signal-brief strong { font-size:19px; }.signal-brief p { font-size:14px; }.status-grid,.status-grid.has-sports { margin:0 14px 14px; grid-template-columns:repeat(2,minmax(0,1fr)); }.status-cell { padding:12px; }.status-cell>span { font-size:11px; }.status-cell strong { font-size:14px; }.status-cell:nth-child(5) { grid-column:1/-1; }.chart-reference { margin:14px; line-height:1.5; }.chart-meta { padding:0 14px 12px; font-size:11px; flex-wrap:wrap; }.chart-meta span { white-space:normal; }.chart-shell { padding:0 8px; }.chart-legend { margin:0 14px; gap:10px 14px; }.read-note { margin:14px; }.leader-row { grid-template-columns:22px minmax(0,1fr) auto; }.leader-seen { display:none; }.method-flow { grid-template-columns:1fr; gap:16px; }.flow-step { grid-template-columns:26px 1fr; gap:4px 10px; }.flow-step span { grid-row:span 2; }.flow-step small { grid-column:2; }.flow-arrow { display:none; }.footer { font-size:11px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none!important; } }

@media(max-width:699px) { .hero-actions { gap:14px; } .hero-actions .support-link { padding-left:14px; } }

/* In-page interval picker: reliable on touch devices and visible at a glance. */
.detail-panel { overflow:visible; }
.chart-period-control { position:relative; z-index:30; }
.interval-menu { position:relative; min-width:142px; }
.interval-current { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; min-height:42px; padding:0 11px; border:1px solid var(--line); border-radius:7px; background:#0a111a; color:#d8e2ec; cursor:pointer; font:14px var(--mono); }
.interval-current span { color:var(--gold); font-size:18px; line-height:1; transform:translateY(-2px); }
.interval-current:hover,.interval-current:focus-visible { border-color:var(--gold); }
.interval-options { display:none; position:absolute; top:calc(100% + 6px); right:0; min-width:132px; padding:5px; border:1px solid #435463; border-radius:8px; background:#172431; box-shadow:0 16px 34px rgba(0,0,0,.45); }
.interval-menu.open .interval-options { display:grid; gap:3px; }
.interval-options button { width:100%; min-height:36px; padding:0 10px; border:1px solid transparent; border-radius:5px; background:transparent; color:#b5c2ce; cursor:pointer; font:13px var(--mono); text-align:left; }
.interval-options button:hover,.interval-options button:focus-visible { border-color:#536a7b; background:#223343; color:#fff; outline:none; }
.interval-options button.selected { border-color:#80683d; background:#332a1b; color:#f5d48c; }
.interval-options button[data-mode="auto"] { color:#f5d48c; font-weight:600; }
.interval-options button[data-mode="auto"].selected { border-color:#b28a42; background:#3a2d18; }
.auto-status { display:grid; gap:7px; margin:0 24px 14px; padding:11px 14px; border:1px solid #5a4725; border-radius:8px; background:linear-gradient(110deg,rgba(69,51,22,.34),rgba(13,22,30,.72)); }
.auto-status[data-state="unavailable"] { border-color:#71423b; background:linear-gradient(110deg,rgba(83,45,39,.28),rgba(13,22,30,.72)); }
.auto-status-topline { display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.auto-status-kicker { color:#9f8a5c; font:10px var(--mono); letter-spacing:.1em; }
.auto-status-primary { color:#f5d48c; font:600 13px var(--mono); letter-spacing:.04em; }
.auto-status[data-state="unavailable"] .auto-status-primary { color:#f0a092; }
.auto-status-detail { color:#b7c4cd; font:11px/1.45 var(--mono); overflow-wrap:anywhere; }
@media(max-width:699px) { .interval-menu { min-width:136px; }.interval-options { min-width:136px; }.interval-options button { min-height:38px; font-size:13px; }.auto-status { margin:0 14px 14px; padding:10px 12px; }.auto-status-topline { display:grid; gap:5px; }.auto-status-detail { font-size:10px; } }

/* Portrait phones: keep the chart workspace inside the viewport. */
@media(max-width:699px) {
  .detail-content { min-width:0; overflow:hidden; }
  .detail-topline>div:first-child { width:100%; }
  .detail-actions { display:flex; width:100%; align-items:end; }
  .detail-actions .kalshi-button { min-width:0; flex:1 1 auto; justify-content:center; overflow:hidden; text-overflow:ellipsis; }
  .chart-reference { overflow-wrap:anywhere; }
  .chart-meta { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:6px 10px; }
  .chart-meta span { min-width:0; white-space:normal; overflow-wrap:anywhere; }
  .chart-meta span:last-child { grid-column:1/-1; }
  .chart-shell { padding:0; overflow:hidden; }
  .crush-chart { width:100%; max-width:100%; min-width:0; min-height:0; }
  .chart-legend { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 12px; margin:10px 14px 0; }
  .chart-legend span { min-width:0; overflow:hidden; line-height:1.35; }
  .chart-legend b { max-width:100%; }
  .read-note { overflow-wrap:anywhere; }
  .read-note span { overflow-wrap:anywhere; }
}

/* Give every phase label room, including native select arrows on iOS. */
.control-strip { grid-template-columns:minmax(230px, max-content) minmax(0,1fr) auto; }
#phase-filter { min-height:44px; font-size:16px; padding-inline:12px 32px; }
@media(max-width:699px) {
  .control-strip { grid-template-columns:minmax(0,1fr); }
  .control-strip .control-group { min-width:0; width:100%; }
}

/* Shared chart surface and reference text across markets and intervals. */
.chart-shell, .crush-chart, .chart-empty, #chart-canvas { background: #000 !important; background-color: #000 !important; }
.chart-reference, .chart-meta, .chart-legend, .chart-empty, .chart-empty strong, .chart-empty span { color: #fff; }

.mentions-price-filter { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; color: #fff; font-size: 14px; cursor: pointer; min-height: 32px; }
.mentions-price-filter input { width: 18px; height: 18px; min-height: 18px; flex: 0 0 18px; margin: 0; accent-color: var(--gold); }

/* Live game-center context for selected sports charts. */
.game-center { margin: 0 24px 18px; }
.game-center-card { overflow: hidden; padding: 18px; border: 1px solid #304658; border-radius: 12px; background: linear-gradient(135deg, #142638 0%, #0b131d 72%); box-shadow: 0 12px 28px rgba(0,0,0,.16); }
.game-center-card.is-live { border-color: #356653; background: linear-gradient(135deg, #132d2a 0%, #0b151b 72%); }
.game-center-topline { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.game-center-sport, .game-center-status, .game-center-team-meta, .game-center-middle span, .game-center-linescore, .game-center-play > span, .game-center-footer { font: 12px var(--mono); letter-spacing: .06em; }
.game-center-sport { display: inline-flex; align-items: center; gap: 7px; color: #9eb5c5; }
.game-center-sport-icon { font-family: "Apple Color Emoji", "Segoe UI Emoji", sans-serif; font-size: 15px; line-height: 1; }
.game-center-status { display: inline-flex; align-items: center; gap: 7px; color: #98a8b5; }
.game-center-status i { width: 7px; height: 7px; border-radius: 50%; background: #788896; }
.game-center-status.is-live { color: var(--green); }
.game-center-status.is-live i { background: var(--green); box-shadow: 0 0 0 4px rgba(88,214,160,.10); }
.game-center-title { margin-bottom: 18px; color: #f0f4f8; font-size: 21px; font-weight: 600; letter-spacing: -.02em; }
.game-center-context { display: flex; flex-wrap: wrap; gap: 7px; margin: -8px 0 16px; }
.game-center-context span { padding: 5px 8px; border: 1px solid #355267; border-radius: 999px; color: #a9c0ce; font: 10px var(--mono); letter-spacing: .05em; }
.game-center-scoreboard { display: grid; grid-template-columns: minmax(0,1fr) minmax(130px,.42fr) minmax(0,1fr); align-items: center; gap: 18px; }
.game-center-team { display: grid; grid-template-columns: 46px minmax(0,1fr) auto; align-items: center; gap: 11px; min-width: 0; }
.game-center-team.home { text-align: right; }
.game-center-team.home .game-center-team-copy { order: 1; }
.game-center-team.home .game-center-logo, .game-center-team.home .game-center-monogram { order: 2; }
.game-center-team.home .game-center-score { order: 3; }
.game-center-logo, .game-center-monogram { display: block; width: 44px; height: 44px; flex: 0 0 44px; object-fit: contain; }
.game-center-monogram { display: grid; place-items: center; border: 1px solid #536b7d; border-radius: 10px; background: #1c3040; color: #e4edf3; font: 600 12px var(--mono); }
.game-center-team-copy { display: grid; min-width: 0; gap: 4px; }
.game-center-team-name { display: flex; align-items: center; justify-content: flex-start; gap: 8px; min-width: 0; }
.game-center-team-name strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.game-center-team.has-control .game-center-team-name strong { color: #f7fffb; }
.game-center-team.has-control .game-center-team-meta { color: #9ed7bb; }
.game-center-team-name .scoreboard-control-indicator { transform: translateY(-1px); }
.game-center-team.away .game-center-team-name { flex-direction: row-reverse; }
.game-center-team.home .game-center-team-name { justify-content: flex-end; }
.game-center-team-meta { overflow: hidden; color: #91adbf; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.game-center-team strong { overflow: hidden; color: #e9f0f4; font-size: 15px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.game-center-score { color: #fff; font: 600 31px/1 var(--mono); }
.game-center-middle { display: grid; justify-items: center; gap: 6px; text-align: center; }
.game-center-middle strong { color: var(--gold); font: 600 18px var(--mono); white-space: nowrap; }
.game-center-middle span { color: #8095a5; font-size: 10px; white-space: nowrap; }
.game-center-linescore { display: grid; grid-template-columns: 54px repeat(var(--linescore-count), minmax(30px,1fr)); margin-top: 18px; border-top: 1px solid #304657; border-bottom: 1px solid #304657; color: #c9d7df; font-size: 11px; letter-spacing: 0; }
.game-center-linescore-kicker { display: block; margin-top: 16px; color: var(--gold); font: 10px var(--mono); letter-spacing: .12em; }
.game-center-score-unavailable { margin-top: 16px; padding: 10px 12px; border: 1px dashed #394957; color: #8192a0; font: 10px var(--mono); letter-spacing: .06em; text-align: center; }
.game-center-linescore-row { display: contents; }
.game-center-linescore-row > * { padding: 7px 5px; text-align: center; }
.game-center-linescore-row > span { color: #9bb1bf; font-weight: 500; text-align: left; }
.game-center-linescore-head > * { color: #718797; font-size: 10px; }
.game-center-linescore-row:not(.game-center-linescore-head) b { color: #e7eef2; font-weight: 500; }
.game-center-linescore-total { color: #fff !important; font-weight: 700 !important; }
.game-center-play { display: grid; gap: 5px; margin-top: 14px; padding: 10px 12px; border-left: 2px solid var(--gold); background: rgba(242,189,91,.08); }
.game-center-play > span { color: var(--gold); font-size: 10px; }
.game-center-play strong { color: #e2eaf0; font-size: 13px; font-weight: 500; line-height: 1.45; }
.game-center-footer { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 13px; color: #8296a5; font-size: 11px; letter-spacing: 0; }
.game-center-footer span + span::before { content: '·'; margin-right: 16px; color: #536a7a; }
.play-by-play { margin: 0 24px 18px; padding: 14px 16px 12px; border: 1px solid #304658; border-radius: 12px; background: #0d1822; }
.play-by-play-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.play-by-play-head > div { display: grid; gap: 4px; min-width: 0; }
.play-by-play-head strong { color: #e9f0f4; font-size: 16px; font-weight: 600; }
.play-by-play-kicker, .play-by-play-status, .play-by-play-meta, .play-by-play-copy > span, .play-by-play-team, .play-by-play-score { font: 10px var(--mono); letter-spacing: .08em; }
.play-by-play-kicker { color: var(--green); }
.play-by-play-status { color: #8ea5b5; white-space: nowrap; }
.play-by-play-list { display: grid; max-height: 250px; overflow-y: auto; border-top: 1px solid #263b4b; scrollbar-color: #486477 #101d28; }
.play-by-play-item { display: grid; grid-template-columns: 95px minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid rgba(54,76,92,.55); }
.play-by-play-item.is-scoring { border-left: 2px solid var(--gold); padding-left: 9px; }
.play-by-play-meta { display: grid; gap: 4px; color: #7f96a6; letter-spacing: 0; }
.play-by-play-meta time { color: #c4d2db; font-size: 11px; }
.play-by-play-copy { display: grid; gap: 4px; min-width: 0; }
.play-by-play-copy strong { overflow: hidden; color: #e0e9ef; font-size: 12px; font-weight: 500; line-height: 1.4; text-overflow: ellipsis; }
.play-by-play-copy > span { color: #7892a3; letter-spacing: .05em; }
.play-by-play-tail { display: grid; justify-items: end; gap: 5px; min-width: 58px; }
.play-by-play-team { color: #9db7c7; letter-spacing: .04em; }
.play-by-play-score { color: var(--gold); letter-spacing: .03em; }
.play-by-play-empty { padding: 18px 4px 8px; color: #8197a6; font: 11px var(--mono); letter-spacing: .04em; text-align: center; }

/* Filled price-area chart: keep the signal math, improve the visual read. */
.chart-visual { overflow: hidden; border: 1px solid #294052; border-radius: 12px; background: #07111a !important; box-shadow: inset 0 1px rgba(255,255,255,.03); }
.chart-visual-header { display: grid; grid-template-columns: 1.45fr repeat(3, 1fr); gap: 1px; border-bottom: 1px solid #294052; background: #294052; }
.chart-stat-main, .chart-stat { display: grid; align-content: center; gap: 5px; min-width: 0; padding: 14px 16px; background: #0c1924; }
.chart-stat-main { background: linear-gradient(120deg, #112638, #0e1b26); }
.chart-stat-main span, .chart-stat span { color: #7d95a6; font: 10px var(--mono); letter-spacing: .08em; }
.chart-stat-main strong { overflow: hidden; color: #f5d28a; font: 600 22px/1 var(--mono); text-overflow: ellipsis; white-space: nowrap; }
.chart-stat-main small { overflow: hidden; color: #a7bac7; font: 11px var(--sans); text-overflow: ellipsis; white-space: nowrap; }
.chart-axis-note { overflow: hidden; color: #f0c875; font: 10px var(--mono); font-style: normal; letter-spacing: .06em; text-overflow: ellipsis; white-space: nowrap; }
.chart-stat strong { overflow: hidden; color: #e3edf2; font: 500 14px var(--mono); text-overflow: ellipsis; white-space: nowrap; }
.chart-stat strong.positive { color: var(--green); }.chart-stat strong.negative { color: var(--coral); }
.chart-stat strong.phase-fire { color: var(--gold); }.chart-stat strong.phase-compression { color: var(--blue); }.chart-stat strong.phase-shift-watch { color: #c8a7ef; }.chart-stat strong.phase-momentum { color: var(--green); }
.chart-visual .crush-chart { width: 100%; min-height: 0; background: #07111a !important; }
.chart-visual .chart-bg { fill: #07111a !important; stroke: #294052 !important; }
.chart-visual .price-pane { fill: #0a1721; stroke: #1c3342; stroke-width: 1; }
.chart-visual .grid-line { stroke: #263d4b !important; stroke-width: 1; }
.chart-visual .pane-divider { stroke: #294354 !important; stroke-width: 1; }
.chart-visual .zero-line { stroke: #577182 !important; stroke-dasharray: 3 5; }
.chart-visual .axis-label { fill: #c5d2db !important; font: 12px var(--mono); }
.chart-visual .x-axis { fill: #e2ebf0 !important; font-size: 13px; font-weight: 600; }
.chart-visual .pane-label { fill: #c7d5de !important; font: 12px var(--mono); letter-spacing: .1em; }
.chart-visual .axis-tick { stroke: #7b93a3 !important; stroke-width: 1.5; }
.chart-visual .band-area { stroke: none; }
.chart-visual .bb-area { fill: url(#bb-area-gradient); }.chart-visual .kc-area { fill: url(#kc-area-gradient); }
.chart-visual .price-area-fill { fill: url(#price-area-gradient); opacity: .7; }
.chart-visual .price-area-line { fill: none; stroke: #f7ce75; stroke-width: 3.2; vector-effect: non-scaling-stroke; filter: drop-shadow(0 0 3px rgba(241,198,111,.22)); }
.chart-visual .indicator { stroke-width: 2.2; }.chart-visual .bb-path { stroke: #65b4ef; stroke-dasharray: 6 4; opacity: .9; }.chart-visual .kc-path { stroke: #bc98ec; stroke-dasharray: 2 5; opacity: .9; }
.chart-visual .compression-zone { fill: #4c9ec5; opacity: .035; }
.chart-visual .price-last-point { fill: #f5d48b; stroke: #10202b; stroke-width: 2; vector-effect: non-scaling-stroke; }
.chart-visual .candle { opacity: 1; }.chart-visual .candle line { stroke-width: 1.8; }.chart-visual .candle rect { rx: 1px; }
.chart-visual .release-mark line { stroke: #edc477; opacity: .72; }.chart-visual .release-mark polygon, .chart-visual .momentum-shift-mark polygon { stroke: #fff0c9; }
.chart-visual .release-label { fill: #edc477; font-size: 10px; }.chart-visual .momentum-bar { opacity: .88; }
.chart-visual .compression-on { fill: #66d8d3; stroke: #d0fffb; }.chart-visual .compression-off { fill: #142632; stroke: #607987; }

@media(max-width:699px) {
  .game-center { margin: 0 14px 14px; }
  .game-center-card { padding: 14px; }
  .game-center-title { font-size: 18px; margin-bottom: 15px; }
  .game-center-scoreboard { grid-template-columns: minmax(0,1fr) 92px minmax(0,1fr); gap: 8px; }
  .game-center-team { grid-template-columns: 34px minmax(0,1fr) auto; gap: 7px; }
  .game-center-logo, .game-center-monogram { width: 34px; height: 34px; }
  .game-center-team strong { font-size: 13px; }
  .game-center-team-meta { font-size: 10px; }
  .game-center-score { font-size: 23px; }
  .game-center-middle strong { font-size: 13px; }.game-center-middle span { font-size: 9px; white-space: normal; }
  .game-center-linescore { grid-template-columns: 42px repeat(var(--linescore-count), minmax(26px,1fr)); margin-top: 14px; font-size: 10px; }
  .game-center-linescore-row > * { padding: 6px 3px; }.game-center-footer { font-size: 10px; }
  .game-center-footer span + span::before { margin-right: 8px; }
  .play-by-play { margin: 0 14px 14px; padding: 12px; }
  .play-by-play-item { grid-template-columns: 74px minmax(0,1fr); gap: 8px; align-items: start; }
  .play-by-play-tail { grid-column: 2; display: flex; justify-content: flex-start; gap: 10px; min-width: 0; }
  .play-by-play-copy strong { white-space: normal; overflow: visible; }
  .chart-visual-header { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .chart-stat-main { grid-column: 1 / -1; }.chart-stat-main, .chart-stat { padding: 12px; }
  .chart-stat-main strong { font-size: 20px; }.chart-stat-main small { font-size: 10px; }.chart-axis-note { font-size: 9px; }.chart-stat span { font-size: 9px; }.chart-stat strong { font-size: 12px; }
}

/* Compact Captain trading workspace */
:root { --muted:#a8b6c5; }
.history-import-strip { display:grid; grid-template-columns:minmax(240px,1fr) minmax(360px,1.35fr); gap:10px 18px; align-items:center; margin:12px 0 8px; padding:14px 16px; border:1px solid #263a49; border-radius:6px; background:#0c1822; }
.history-import-copy { display:grid; gap:4px; min-width:0; }
.history-import-copy strong { color:#e8eff3; font-size:14px; font-weight:600; }
.history-import-copy small { color:#879bab; font-size:12px; }
.history-import-form { display:flex; gap:8px; min-width:0; }
.history-import-form input { flex:1; min-width:0; min-height:40px; padding:0 12px; border:1px solid #395061; border-radius:4px; background:#07111a; color:#e5edf2; font:12px var(--mono); outline:none; }
.history-import-form input:focus { border-color:#e9b95e; box-shadow:0 0 0 2px rgba(233,185,94,.14); }
.history-import-form button { flex:0 0 auto; min-height:40px; padding:0 14px; border:1px solid #a77b2d; border-radius:4px; background:#e9b95e; color:#17212a; font:600 11px var(--mono); letter-spacing:.06em; cursor:pointer; }
.history-import-form button:hover { background:#f2cb7c; }
.history-import-status { grid-column:1/-1; margin:0; color:#7f96a6; font:11px var(--mono); letter-spacing:.03em; }
.history-import-status.error { color:#ff948d; }
.topbar { min-height:60px; }
.hero-row.terminal-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 0; }
.terminal-heading h1 { font-size:26px; margin:0; letter-spacing:-.03em; }
.terminal-heading .hero-actions { display:flex; gap:20px; margin:0; }
.terminal-heading .hero-link { margin:0; font-size:14px; }
.control-strip { grid-template-columns:230px minmax(0,1fr); padding:14px 16px; gap:10px 14px; background:#0e151e; border:0; border-radius:6px; }
.feed-group { grid-column:1/-1; }.control-label { font-size:12px; color:#afbdca; }
.stream-note { display:none; }.mentions-price-filter { grid-column:1/-1; font-size:14px; }
.summary-grid { display:flex; flex-wrap:wrap; gap:24px; padding:12px 0; margin:0 0 8px; border:0; border-radius:0; background:none; }
.summary-card { display:flex; align-items:center; gap:10px; min-height:0; padding:0; border:0; }
.summary-card strong { margin:0; font-size:18px; }.summary-card small,.summary-card:last-child { display:none; }.summary-label { font-size:12px; }
.panel { border-color:#23303b; border-radius:6px; }.panel-heading { padding:14px 18px; }.panel h2 { font-size:20px; }.panel-description { font-size:14px; }
.event-row { padding:0 16px; gap:12px; }.family-row { min-height:72px; padding:11px 0; gap:12px; }.family-title { gap:4px; }.family-title strong { font-size:16px; font-weight:600; color:#f0f4f8; }.family-title small { font-size:12px; }
.family-row.sports-live { background:none; }.family-sport-board { background:none; border:0; padding:3px 0 0; }.family-sport-line { font-size:14px; color:#becbd6; }.family-sport-line b { font-size:16px; color:#fff; }.family-state { font-size:14px; border:0; }.family-updated { font-size:12px; }.family-league { background:none; border:0; }
.event-kalshi { border-color:transparent; }.event-row:has(.active) { background:#152332; box-shadow:inset 3px 0 #edc477; }
.detail-topline { padding:12px 18px; }.detail-topline:has(+ .game-center:not(.hidden)) h2 { display:none; }.detail-topline .panel-kicker { display:none; }.detail-subtitle { font-size:14px; }
.game-center { margin:0 18px 10px; }.game-center-card { padding:12px 16px; background:#101b24; border:0; border-radius:6px; }.game-center-title { display:none; }.game-center-scoreboard { margin-top:8px; grid-template-columns:minmax(0,1fr) 120px minmax(0,1fr); }.game-center-team.home { grid-template-columns:46px minmax(0,1fr) auto; text-align:left; }.game-center-team.home .game-center-team-copy,.game-center-team.home .game-center-logo,.game-center-team.home .game-center-monogram,.game-center-team.home .game-center-score { order:0; }.game-center-team strong { white-space:normal; overflow:visible; font-size:16px; }.game-center-score { font-size:30px; }.game-center-middle span { display:none; }
.signal-brief { margin:8px 18px; padding:8px 12px; border-width:0 0 0 3px; background:#111d29; }.signal-brief strong { font-size:17px; }.signal-overline { display:none; }.signal-brief p { font-size:14px; margin:4px 0 0; }
.chart-meta { font-size:12px; padding:8px 18px; }.chart-shell,.chart-visual,.chart-visual .crush-chart { background:#000 !important; }.chart-visual .chart-bg,.chart-visual .price-pane { fill:#000 !important; }.chart-visual .grid-line { stroke:#25303a !important; }.chart-visual .axis-label { fill:#bbc6d0 !important; }
.chart-diagnostics { margin:12px 18px; border-top:1px solid #263441; }.chart-diagnostics summary { cursor:pointer; padding:14px 0; font-size:14px; color:#bac8d5; }.chart-diagnostics .status-grid { margin:0; }.status-cell>span { font-size:12px; }.status-cell strong { font-size:14px; }.detail-sports-cell { display:none !important; }
.chart-legend { font-size:12px; }.read-note { font-size:14px; }
@media(max-width:699px) {
.history-import-strip { grid-template-columns:minmax(0,1fr); gap:10px; margin:10px 0 6px; padding:12px; }
.history-import-form { width:100%; }
.history-import-form button { padding:0 10px; }
.hero-row.terminal-heading { padding:14px 0; align-items:flex-start; }.terminal-heading h1 { font-size:22px; }.terminal-heading .hero-actions { gap:8px; flex-direction:column; }.terminal-heading .hero-link { font-size:12px; }
.control-strip { grid-template-columns:minmax(0,1fr); padding:12px; }.control-strip .control-group { grid-column:1/-1; }.segmented button { min-height:44px; font-size:14px; }.summary-grid { gap:12px; }.summary-label { font-size:12px; }.summary-card strong { font-size:16px; }
.panel-heading { padding:12px; }.panel-description { font-size:12px; }.family-row { padding:10px 0; }.family-main { gap:8px; }.family-state { margin-left:62px; font-size:14px; }.family-sport-board { grid-template-columns:1fr auto; gap:4px 10px; }.family-sport-lines { grid-column:1/-1; }.family-sport-kicker { display:none; }.family-sport-status { grid-column:1; }.scoreboard-stale { grid-column:2; }.family-title strong { font-size:16px; }
 .detail-topline { padding:12px; }.detail-topline>div:first-child { flex-basis:auto; }.detail-actions { flex-wrap:wrap; }.game-center { margin:0 12px 8px; }.game-center-card { padding:12px; }.game-center-scoreboard { grid-template-columns:1fr; gap:12px; }.game-center-middle { grid-row:1; text-align:center; }.game-center-team.home { grid-row:2; }.game-center-team.away { grid-row:3; }.game-center-team,.game-center-team.home { grid-template-columns:34px minmax(0,1fr) auto; }.game-center-team strong { font-size:16px; }.game-center-score { font-size:26px; }.signal-brief { margin:8px 12px; }.chart-meta { padding:8px 12px; }.chart-diagnostics { margin:12px; }
}

/* Clickable Universe rail and inspectable chart bars. */
.universe-row { position: relative; text-decoration: none; transition: color .16s ease, background .16s ease, padding .16s ease; }
.universe-row:hover, .universe-row:focus-visible, .universe-row.selected { color: var(--text); }
.universe-row:hover, .universe-row:focus-visible { padding-left: 7px; padding-right: 7px; border-radius: 4px; background: #162330; outline: 0; }
.universe-row.selected { color: var(--gold); }
.universe-row.selected .universe-status { color: var(--gold); }
.universe-arrow { margin-left: 2px; color: var(--gold); font-size: 12px; opacity: 0; transform: translateX(-3px); transition: opacity .16s ease, transform .16s ease; }
.universe-row:hover .universe-arrow, .universe-row:focus-visible .universe-arrow, .universe-row.selected .universe-arrow { opacity: 1; transform: translateX(0); }
.chart-hit-target { fill: transparent; cursor: crosshair; outline: 0; pointer-events: all; }
.chart-hit-target:hover, .chart-hit-target:focus-visible, .chart-hit-target.pinned { fill: rgba(245,212,139,.08); stroke: rgba(245,212,139,.58); stroke-width: 1; }
.chart-hover-line { stroke: #f5d48b; stroke-width: 1.2; stroke-dasharray: 4 4; opacity: .85; pointer-events: none; }
.chart-hover-point { fill: #f5d48b; stroke: #0b1822; stroke-width: 2; pointer-events: none; }
.chart-hover-readout { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 52px; padding: 9px 14px; border-top: 1px solid #294052; background: #0a1721; color: #a7bac7; font: 11px/1.35 var(--mono); }
.chart-hover-readout > span { display: grid; gap: 2px; min-width: 0; }
.chart-hover-readout strong, .chart-hover-readout b { overflow: hidden; color: #dfeaf0; font: inherit; text-overflow: ellipsis; white-space: nowrap; }
.chart-hover-readout strong { color: #f5d48b; }
.chart-hover-readout small { color: #718b9b; font: 10px/1.35 var(--mono); white-space: nowrap; }
.chart-hover-readout:not(.active) { color: #718b9b; }
.chart-hover-readout.pinned { border-top-color: #7a6131; background: #151b1c; }
.chart-hover-readout.pinned > small { color: #f5d48b; }
@media(max-width:699px) {
  .chart-hover-readout { align-items: flex-start; padding: 10px 12px; font-size: 10px; }
  .chart-hover-readout > small { white-space: normal; text-align: right; }
}

.family-sport-time { display: inline-flex; align-items: baseline; gap: 5px; min-width: 0; color: #b7c7d0; font: 10px var(--mono); white-space: nowrap; }
.family-sport-time small { color: #8196a5; font: 8px var(--mono); letter-spacing: .08em; }
.family-sport-time b { color: #b7c7d0; font: 500 10px var(--mono); }
.family-sport-time.is-live b { color: var(--green); }
@media(max-width:699px) { .family-sport-time { grid-column: 2; margin-top: -1px; } }
@media(max-width:499px) { .family-sport-time { grid-column: 1; margin-top: 0; } }