.survivor-page [hidden] { display: none !important; }
.survivor-page .topbar { flex-wrap: wrap; padding-block: 15px; gap: 12px; }
.survivor-page .topnav { flex-wrap: wrap; }
.survivor-page .topnav a { font-size: 14px; }
.survivor-page .source-status { font-size: 14px; }
.survivor-hero { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); align-items: end; gap: 35px; padding: 30px 0; }
.survivor-hero h1 { font: 500 clamp(34px, 4.2vw, 58px)/1.05 Georgia, serif; letter-spacing: -.035em; margin: 12px 0 20px; }
.survivor-hero p { color: var(--muted); line-height: 1.65; max-width: 620px; }
.survivor-version { border-left: 3px solid var(--lime); padding: 10px 0 10px 25px; max-width: 430px; }
.survivor-version span { color: var(--lime); font-size: 14px; letter-spacing: .07em; }
.survivor-version strong { display: block; font-size: 25px; margin-top: 8px; }
.survivor-page .eyebrow { font-size: 13px; }
.survivor-panel { margin-bottom: 18px; padding: 24px; border: 1px solid var(--line); border-radius: 16px; background: rgba(8,31,25,.96); min-width: 0; }
.survivor-panel h2 { font: 500 26px/1.2 Georgia, serif; margin: 5px 0 12px; }
.survivor-panel p, .survivor-panel li { font-size: 15px; line-height: 1.65; color: var(--muted); }
.survivor-heading { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
.survivor-controls { display: flex; flex-wrap: wrap; align-items: end; gap: 14px; }
.survivor-controls label { min-width: 0; display: grid; gap: 8px; color: var(--muted); font-size: 14px; line-height: 1.5; }
.survivor-controls > :is(label, button) { max-width: 100%; }
.survivor-page select, .survivor-page button { min-height: 46px; border: 1px solid var(--line-strong); border-radius: 8px; background: #102e25; color: var(--ink); padding: 10px 14px; font-size: 16px; }
.survivor-page select { min-width: 0; max-width: 100%; text-overflow: ellipsis; }
/* WebKit can count native option text outside a constrained select as page overflow. */
.survivor-controls select { contain: paint; }
.survivor-page button { white-space: normal; overflow-wrap: anywhere; line-height: 1.4; }
.survivor-page button:hover { border-color: var(--lime); }
.survivor-page button:disabled { cursor: not-allowed; opacity: .45; }
.survivor-page button.survivor-primary { color: var(--lime-ink); background: var(--lime); font-weight: 750; }
.survivor-page :focus-visible { outline: 3px solid var(--lime); outline-offset: 3px; }
.survivor-page summary { cursor: pointer; min-height: 44px; padding-block: 11px; font-size: 17px; line-height: 1.5; }
.used-details { margin-top: 18px; border-top: 1px solid var(--line); padding-top: 8px; }
.used-teams { display: grid; grid-template-columns: repeat(8, minmax(64px, 1fr)); gap: 8px; }
.used-teams label { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 11px 5px; border: 1px solid var(--line); border-radius: 7px; cursor: pointer; font-size: 14px; }
.used-teams label:has(input:checked) { background: #514421; border-color: #c7a35c; }
.used-teams input { accent-color: var(--lime); width: 18px; height: 18px; margin: 0; }
.survivor-message { min-height: 24px; margin-bottom: 0; }
.survivor-table-scroll { min-width: 0; max-width: 100%; overflow: auto; border: 1px solid var(--line); border-radius: 9px; margin-top: 16px; overscroll-behavior-inline: contain; scrollbar-color: #527b69 #081b16; }
.matrix-scroll { max-height: 640px; }
.survivor-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 15px; line-height: 1.5; }
.survivor-table :is(th,td) { position: static; left: auto; right: auto; min-width: 0; width: auto; max-width: none; text-align: left; padding: 12px; border: 0; border-bottom: 1px solid var(--line); white-space: nowrap; background: transparent; color: var(--ink); box-shadow: none; }
.survivor-table th { background: #15362b; font-size: 14px; font-weight: 650; }
.survivor-table thead { position: static; }
.survivor-table tbody tr:hover td { background: rgba(255,255,255,.025); }
.survivor-table caption { text-align: left; padding: 10px; color: var(--muted); }
.survivor-matrix { width: max-content; min-width: 100%; }
.survivor-matrix thead th { position: sticky; top: 0; z-index: 2; }
.survivor-matrix :is(th,td):first-child { position: sticky; left: 0; z-index: 1; background: #102b22; min-width: 80px; width: 80px; }
.survivor-matrix thead th:first-child { z-index: 3; background: #15362b; }
.survivor-matrix td { padding: 5px; text-align: center; }
.survivor-matrix .matrix-pick { display: grid; width: 93px; padding: 9px 4px; gap: 4px; background: color-mix(in srgb, #8ecc48 var(--heat, 0%), #0b241d); border: 1px solid transparent; border-radius: 6px; }
.matrix-pick strong { font-size: 17px; font-variant-numeric: tabular-nums; }
.matrix-pick span { font-size: 13px; }
.survivor-matrix .matrix-pick.selected { border: 2px solid var(--lime); color: var(--lime); background: #243923; padding: 8px 3px; }
.survivor-matrix .matrix-pick:disabled { opacity: .45; }
.survivor-matrix td small { display: block; color: var(--muted); }
.matrix-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 13px; color: var(--muted); }
.matrix-legend i { flex: 0 1 70px; height: 9px; border-radius: 6px; background: linear-gradient(90deg, #0b241d, #638d3b); }
.survival-summary { display: flex; flex-wrap: wrap; gap: 16px; margin: 20px 0; }
.survival-summary > div { min-width: 0; flex: 1 1 200px; border-left: 2px solid var(--lime); padding: 6px 16px; overflow-wrap: anywhere; }
.survival-summary span, .survival-summary small { display: block; color: var(--muted); font-size: 14px; }
.survival-summary strong { display: block; color: var(--lime); font: 500 34px/1.4 Georgia, serif; }
.survivor-method p { max-width: 1050px; }
.survivor-method strong { color: var(--ink); }
#survivor-error { border: 1px solid var(--red); border-radius: 10px; padding: 18px; }
.simulation-chart { width: 100%; min-width: 760px; display: block; }
.simulation-chart text { fill: #c5d7ce; font: 14px system-ui; }
.matchup-panel { border-top: 3px solid var(--lime); }
.matchup-panel p { font-size: 16px; }
.matchup-panel h3 { margin-top: 24px; font-size: 20px; }
.matchup-controls { gap: 12px; }
.matchup-controls label { flex: 1 1 210px; min-width: 0; }
.matchup-controls select { width: 100%; min-width: 0; max-width: 100%; text-overflow: ellipsis; }
.matchup-controls #matchup-game-label { flex-basis: 400px; }
.matchup-controls select:disabled { opacity: .8; }
.matchup-caution { border-left: 3px solid #c7a35c; padding: 8px 14px; background: #b7994310; }
#matchup-error { padding: 14px; border: 1px solid var(--red); border-radius: 8px; }
.matchup-chart-label { min-width: 0; display: grid; gap: 8px; max-width: 100%; font-size: 14px; }
.matchup-distribution { width: 100%; min-width: 760px; display: block; }
.matchup-distribution text { fill: #c5d7ce; font: 16px system-ui; }
.matchup-outcomes { display: grid; gap: 10px; margin-block: 20px; }
.matchup-outcome { display: grid; grid-template-columns: 155px minmax(30px, 1fr) 65px; align-items: center; gap: 14px; font-size: 14px; }
.matchup-outcome strong { text-align: right; font-variant-numeric: tabular-nums; }
.matchup-outcome-bar { display: block; height: 13px; background: linear-gradient(to right, var(--lime) var(--chance), #284337 var(--chance)); border-radius: 3px; }
.away-outcome .matchup-outcome-bar { background: linear-gradient(to right, #8cc6ff var(--chance), #284337 var(--chance)); }
.matchup-market, .matchup-method { margin-top: 24px; border-top: 1px solid var(--line); }
.matchup-market .survivor-table :is(th, td):nth-child(-n+2) { white-space: normal; min-width: 170px; }
.survivor-panel .lab-scroll-hint { font-size: 13px; line-height: 1.6; }
.survivor-heading > :is(div, label) { min-width: 0; max-width: 100%; }
.survivor-heading > a { padding-block: 10px; line-height: 1.5; }
@media (max-width: 520px) {
  .matchup-outcome { grid-template-columns: minmax(0, 1fr) 62px; gap: 7px 12px; }
  .matchup-outcome > :first-child { grid-column: 1; grid-row: 1; }
  .matchup-outcome strong { grid-column: 2; grid-row: 1; }
  .matchup-outcome-bar { grid-column: 1 / -1; grid-row: 2; }
  .matchup-chart-label { width: 100%; }
  .matchup-panel .survival-summary > div { flex-basis: 150px; }
}
@media (max-width: 700px) {
  .survivor-hero { grid-template-columns: 1fr; gap: 8px; padding-top: 8px; }
  .survivor-version { max-width: none; }
  .survivor-panel { padding: 16px; }
  .survivor-controls label { flex: 1 1 100px; }
  .survivor-controls button { flex: 1 1 170px; }
  .used-teams { grid-template-columns: repeat(4, minmax(55px, 1fr)); }
  .matrix-panel { padding-inline: 10px; }
  .survivor-page .topnav { gap: 3px; }
  .survivor-page .topnav a { padding: 9px 7px; }
  .survivor-heading > button { width: 100%; }
  .matchup-controls label { flex-basis: calc(50% - 12px); }
  .matchup-controls > label:first-child, .matchup-controls #matchup-game-label { flex-basis: 100%; }
  .matchup-controls > button { flex-basis: 100%; }
  .survivor-controls select { width: 100%; }
}
@media (max-width: 520px) {
  .matchup-controls > label, .survivor-controls > label:has(#tie-rule) { flex-basis: 100%; }
}
@media (max-width: 360px) {
  .matchup-controls label, .survivor-controls > label:has(#tie-rule) { flex-basis: 100%; }
  .used-teams { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}