/* PI broadcast masthead. Leaderboard and rating treatments remain in editorial.css. */
:root { --pi-yellow: #FFD84D; --pi-blue: #65CAFF; --pi-violet: #A37CFF; }
body[data-team] .site-header.unified-header {
  isolation: isolate; position: sticky; top: 0; z-index: 30; display: grid;
  grid-template-columns: minmax(380px, 1fr) auto minmax(160px, 210px) 40px;
  align-items: center; gap: 20px; min-height: 96px; padding: 12px 28px;
  background: radial-gradient(ellipse at 10% 35%, #258ac84a, transparent 36%), linear-gradient(110deg, #0b1425 25%, #11233c 65%, #221c3c);
  border: 0; border-bottom: 1px solid #65caff45; box-shadow: 0 8px 28px #0005;
  backdrop-filter: none; -webkit-backdrop-filter: none; overflow: visible;
}
body[data-team] .site-header.unified-header::before {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(119deg, transparent 15%, #65caff12 15% 23%, transparent 23% 58%, #65caff24 58% 68%, transparent 68% 69%, #65caff66 69% 71%, transparent 71% 76%, #ffd84d4a 76% 81%, #ffd84d0a 81% 84%, transparent 84% 89%, #a37cff55 89% 94%, transparent 94%), repeating-linear-gradient(119deg, transparent 0 34px, #ffffff03 34px 35px);
}
body[data-team] .site-header.unified-header::after { content: ''; display: block; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: linear-gradient(90deg, var(--pi-yellow), var(--pi-yellow) 23%, var(--pi-blue) 23% 72%, var(--pi-violet)); pointer-events: none; }
body[data-team] .site-header.unified-header .site-wordmark { grid-column: 1; grid-row: 1; display: flex; gap: 12px; align-items: center; min-width: 0; }
.pi-monogram { width: 64px; height: 64px; flex: none; filter: drop-shadow(0 1px 0 #020917) drop-shadow(0 0 12px #65caff24); }
.brand-lockup { display: flex; flex-direction: column; gap: 0; padding: 0; border: 0; }
.brand-lockup strong { display: flex; flex-direction: column; font: italic 800 1.6rem/.88 var(--display); letter-spacing: -.025em; text-transform: uppercase; color: #F5F8FF; white-space: nowrap; text-shadow: 0 2px 0 #030a18; }
.brand-impact-line { display: flex; align-items: baseline; gap: 10px; }
.brand-lockup .brand-impact { color: var(--pi-yellow); font-size: 1.37em; font-weight: inherit; letter-spacing: .01em; }
.brand-lockup small { display: block; flex: none; color: #bed2e5; font: 400 .875rem/1 var(--display); letter-spacing: .01em; text-transform: none; text-shadow: none; white-space: nowrap; }
body[data-team] .site-header.unified-header .site-nav { grid-column: 2; grid-row: 1; display: flex; align-items: center; gap: 8px; justify-content: flex-start; width: auto; }
.site-nav .nav-players { display: contents; }
body[data-team] .site-header.unified-header .site-nav a {
  position: relative; display: inline-flex; justify-content: center; align-items: center; gap: 8px;
  min-height: 44px; min-width: 116px; padding: 10px 34px 10px 16px;
  clip-path: polygon(0 0, 100% 0, calc(100% - 12px) 100%, 0 100%);
  border: 0; border-radius: 0; color: #d7ecff; background: linear-gradient(155deg, #253e5c, #13283f);
  box-shadow: inset 0 1px 0 #65caff55, inset 0 -1px 0 #65caff55, inset 1px 0 0 #65caff55;
  font: italic 800 1.1rem/1 var(--display); letter-spacing: .045em; text-transform: uppercase; text-shadow: none;
  transition: background .15s ease, color .15s ease, transform .15s ease;
}
/* Override the older, more specific home-tab underline in editorial.css. */
body[data-team] .site-header.unified-header .site-nav a::after,
body[data-team] .site-header.unified-header .site-nav a.active[data-route]::after { content: none; display: none; }
body[data-team] .site-header.unified-header .site-nav a.active { background: linear-gradient(150deg, #ffe784, var(--pi-yellow) 70%); color: #111b2b; border: 0; box-shadow: inset 0 1px 0 #fff8, inset 0 0 12px #fff3, inset 0 -2px 0 #10213625; }
body[data-team] .site-header.unified-header .site-nav a.active::before { content: ''; position: absolute; right: 20px; top: 50%; width: 6px; height: 10px; border: solid currentColor; border-width: 0 2px 2px 0; transform: translateY(-65%) rotate(45deg); pointer-events: none; }
body[data-team] .site-header.unified-header .site-nav a:not(.active):hover { color: #fff; background: #294b70; }
body[data-team] .site-header.unified-header .site-nav a:active { transform: translateY(1px); }
body[data-team] .site-header.unified-header .site-nav a:focus-visible { outline: 0; box-shadow: inset 0 0 0 3px #fff; }
.site-nav .nav-icon { width: 19px; height: 19px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.site-header > .header-help { grid-column: 4; grid-row: 1; width: 40px; height: 40px; margin: 0; border: 1px solid #a37cff66; border-radius: 8px 2px; color: #d4c4ff; background: #111b31cc; font: 700 1rem/1 var(--font); }
.site-header > .header-help:hover { color: #fff; background: #343055; }
body[data-team] .unified-header .header-selectors { position: relative; grid-column: 3; grid-row: 1; display: block; margin: 0; min-width: 0; }
body[data-team] .unified-header .header-selectors .team-select { position: relative; width: 100%; min-width: 0; grid-column: auto; grid-row: auto; }
.header-selectors .team-select::before { position: absolute; top: 6px; left: 11px; z-index: 1; pointer-events: none; color: #88a9cb; font: 700 .5rem/1 var(--font); letter-spacing: .12em; }
.header-selectors .team-select::before { content: 'TEAM PAGE'; }
body[data-team] .header-selectors .team-picker-trigger, body[data-team] .header-selectors select {
  position: relative; display: block; width: 100%; min-width: 0; min-height: 44px; height: 44px;
  padding: 17px 27px 6px 11px; border: 1px solid #355777; border-radius: 7px 2px;
  background: linear-gradient(112deg, #ffffff04, transparent 70%), linear-gradient(160deg, #1c314b, #101e32);
  box-shadow: inset 0 1px 0 #ffffff08; color: #f0f6ff;
  font: 700 1.06rem/1.05 var(--display); text-transform: uppercase; letter-spacing: .02em;
  text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
body[data-team] .header-selectors select[hidden] { display: none; }
body[data-team] .header-selectors .team-picker-trigger::after { content: ''; position: absolute; right: 11px; top: 21px; width: 7px; height: 7px; border: solid var(--pi-blue); border-width: 0 2px 2px 0; transform: rotate(45deg); font-size: 0; }
body[data-team] .header-selectors .team-picker-trigger::before { content: ''; position: absolute; width: 13px; height: 3px; top: 0; right: 0; background: var(--pi-blue); transform: skewX(-25deg); }
body[data-team] .header-selectors .team-picker-trigger:hover { border-color: var(--pi-blue); background: #203954; }
.team-picker-label { position: relative; z-index: 1; }
body[data-team] .header-selectors .team-picker-trigger[data-team] {
  border-color: color-mix(in srgb, var(--badge-primary) 65%, #71859b);
  background: linear-gradient(115deg, color-mix(in srgb, var(--badge-primary) 32%, #132033), #101b2c 85%);
  box-shadow: inset 3px 0 0 var(--badge-primary), inset 0 1px 0 #ffffff14;
  color: #fff; text-shadow: 0 1px 3px #000;
}
body[data-team] .header-selectors .team-picker-trigger[data-team]::before {
  top: 0; right: 0; width: 48px; height: 100%; transform: none; pointer-events: none;
  background: linear-gradient(120deg, transparent 0 28%, var(--badge-primary) 28% 45%, var(--badge-secondary) 45% 62%, var(--badge-third) 62% 71%, transparent 71%);
  opacity: .85;
}
body[data-team] .header-selectors .team-picker-trigger[data-team]::after { z-index: 1; border-color: #fff; filter: drop-shadow(0 1px 2px #000); }
body[data-team] .header-selectors .team-picker-trigger[data-team]:hover { border-color: color-mix(in srgb, var(--badge-primary) 55%, white); }
.header-selectors .team-select:has(.team-picker-trigger[data-team])::before { color: #d4dfea; }
.site-header :focus-visible { outline: 2px solid var(--pi-yellow); outline-offset: 3px; }
.team-picker-dialog { background: #0f1d30; border-color: #355777; }
.team-picker-choice[aria-current="true"] { border-color: var(--pi-yellow); background: #2d3029; color: #ffe582; }
.team-picker-choice[aria-current="true"] .team-picker-selected { color: var(--pi-yellow); }
.team-picker-note { margin: -4px 0 16px; color: #abc3db; font: 500 .8rem/1.5 var(--font); }
/* Compact controls connect the Players leaderboard to the branded masthead. */
.players-page .players-controls {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 360px); gap: 8px 20px;
  margin: 0 0 8px; padding: 10px 12px; border: 1px solid #65caff20; border-bottom: 1px solid #65caff20;
  border-radius: 8px 2px; background: linear-gradient(115deg, #172c4399, #101b2c); box-shadow: inset 0 1px 0 #65caff14;
}
.player-search-field { position: relative; display: flex; min-width: 0; }
.player-search-field svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); width: 17px; height: 17px; color: var(--pi-blue); fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; pointer-events: none; }
.players-page .players-controls input[type="search"] { width: 100%; min-width: 0; min-height: 44px; padding-left: 38px; background: #09152499; border: 1px solid #65caff2b; border-radius: 5px 2px; font-size: .82rem; }
.players-page .players-controls input[type="search"]::placeholder { color: #9ab2ca; }
.players-page .players-controls input:focus-visible { outline: 2px solid var(--pi-blue); outline-offset: 2px; }
.players-page .players-minutes { display: grid; grid-template-columns: auto minmax(80px, 1fr); gap: 12px; color: #abc3db; font-size: .69rem; }
.players-page .players-minutes b { color: var(--pi-yellow); }
.players-page .players-minutes input { width: 100%; min-width: 0; height: 32px; accent-color: var(--pi-yellow); }
.players-page .player-ranking-controls { grid-template-columns: minmax(0, 1fr) 310px minmax(260px, 320px); }
.player-position-buttons { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; min-width: 0; }
.player-position-buttons button { min-height: 44px; padding: 0 8px; border: 1px solid #65caff40; border-radius: 7px 2px; color: #b6c9df; background: #111e30; font: 700 .8rem/1 var(--display); letter-spacing: .04em; text-transform: uppercase; cursor: pointer; }
.player-position-buttons button:hover { color: #fff; border-color: var(--pi-blue); background: #20344b; }
.player-position-buttons button[aria-pressed="true"] { color: #101b2c; background: var(--pi-yellow); border-color: var(--pi-yellow); box-shadow: inset 0 -3px 0 #0002; }
.player-position-buttons button:focus-visible { outline: 2px solid var(--pi-blue); outline-offset: 3px; }
@media (min-width: 701px) and (max-width: 1000px) {
  .players-page .player-ranking-controls { grid-template-columns: minmax(0, 1fr) minmax(260px, 320px); }
  .player-ranking-controls .player-position-buttons { grid-column: 1 / -1; grid-row: 2; }
}
@media (max-width: 700px) {
  .players-page .players-controls { grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 8px 10px 5px; }
  .players-page .players-minutes { gap: 12px; }
}
@media (max-width: 1150px) and (min-width: 961px) {
  body[data-team] .site-header.unified-header { grid-template-columns: minmax(340px, 1fr) auto 180px 40px; gap: 12px; padding-inline: 18px; }
  .brand-lockup strong { font-size: 1.4rem; }
  .brand-impact-line { gap: 8px; }
  body[data-team] .site-header.unified-header .site-nav a { min-width: 98px; padding-inline: 12px 32px; }
}
@media (max-width: 960px) {
  body[data-team] .site-header.unified-header { grid-template-columns: minmax(0, 1.6fr) minmax(120px, 1fr); grid-template-rows: 56px 44px; gap: 4px 6px; min-height: 0; padding: 4px 14px 10px; }
  body[data-team] .site-header.unified-header::before { background: linear-gradient(119deg, transparent 30%, #65caff28 30% 51%, transparent 51% 55%, #65caff80 55% 60%, transparent 60% 71%, #ffd84d70 71% 79%, transparent 79% 84%, #a37cff70 84% 91%, transparent 91%), repeating-linear-gradient(119deg, transparent 0 25px, #ffffff04 25px 26px); mask-image: linear-gradient(#000 0 48px, #0002 125px, transparent); }
  body[data-team] .site-header.unified-header .site-wordmark { grid-column: 1 / -1; grid-row: 1; gap: 8px; padding-right: 0; }
  /* Keep the small SVG out of filter compositing in the mobile sticky header. */
  .pi-monogram { width: 54px; height: 54px; filter: none; }
  .brand-lockup strong { font-size: 1.4rem; }
  .brand-impact-line { gap: 8px; }
  .brand-lockup small { font-size: .8125rem; line-height: 1; }
  .site-header > .header-help { grid-column: 2; grid-row: 1; align-self: start; justify-self: end; margin-top: -4px; }
  body[data-team] .site-header.unified-header .site-nav { grid-column: 1; grid-row: 2; width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px; }
  body[data-team] .site-header.unified-header .site-nav a { width: 100%; min-width: 0; min-height: 44px; padding: 10px 22px 10px 8px; gap: 4px; font-size: .95rem; letter-spacing: .02em; clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 100%, 0 100%); }
  body[data-team] .site-header.unified-header .site-nav a.active::before { right: 12px; width: 5px; height: 8px; }
  .site-nav .nav-icon { width: 14px; height: 14px; }
  body[data-team] .unified-header .header-selectors { grid-column: 2; grid-row: 2; }
  body[data-team] .header-selectors .team-picker-trigger, body[data-team] .header-selectors select { padding-left: 9px; padding-right: 23px; font-size: 1rem; }
  .header-selectors .team-select::before { left: 9px; }
  body[data-team] .header-selectors .team-picker-trigger::after { right: 9px; width: 6px; height: 6px; }
}
@media (max-width: 360px) {
  body[data-team] .site-header.unified-header { padding-inline: 8px; }
  body[data-team] .site-header.unified-header .site-wordmark { gap: 4px; }
  .brand-impact-line { gap: 6px; }
}
@media (max-width: 340px) {
  .brand-lockup small { font-size: .75rem; }
}
@media (min-width: 390px) and (max-width: 960px) {
  .site-header > .header-help { margin-top: 8px; }
}
@media (prefers-reduced-motion: reduce) { body[data-team] .site-header.unified-header .site-nav a { transition: none; } }

/* Game log: the same broadcast palette, angled accents, and inset PI numbers. */
body[data-team] #app > #log.section.band {
  padding: 0; border: 1px solid #29435d; border-radius: 12px 2px; overflow: hidden;
  background: #0d1828;
}
#log .game-log-head {
  position: relative; isolation: isolate; margin: 0; padding: 18px 20px;
  border-top: 2px solid var(--pi-yellow); background: #112039;
}
#log .game-log-head::before {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(119deg, transparent 42%, #65caff12 42% 58%, transparent 58% 62%, #65caff50 62% 64%, transparent 64% 76%, #ffd84d20 76% 83%, transparent 83%);
}
#log .game-log-head h2 { margin: 0; color: #f1f6ff; font: italic 800 clamp(1.8rem, 3vw, 2.3rem)/1 var(--display); letter-spacing: -.015em; }
#log .game-log-head h2 span { color: var(--pi-yellow); }
#log .game-log-head p { margin: 6px 0 0; color: #abc3db; font: 600 .65rem/1.3 var(--font); }
#log .game-log-sim {
  min-height: 44px; min-width: 148px; padding: 10px 20px 10px 14px; border: 0; border-radius: 0;
  clip-path: polygon(0 0, 100% 0, calc(100% - 10px) 100%, 0 100%);
  background: linear-gradient(145deg, #ffe784, var(--pi-yellow) 80%); color: #101b2c;
  box-shadow: inset 0 1px 0 #fff8; font: italic 800 1rem/1 var(--display); text-transform: uppercase; letter-spacing: .025em;
}
#log .game-log-sim:hover:not(:disabled) { background: #ffe784; }
#log .game-log-sim:focus-visible { outline: none; box-shadow: inset 0 0 0 3px #fff; }
#log .log-next-card {
  margin: 14px; overflow: hidden; border: 1px solid #65caff45; border-radius: 7px 2px;
  background: linear-gradient(118deg, transparent 44%, color-mix(in srgb, var(--log-primary) 36%, transparent) 44% 61%, transparent 61% 64%, color-mix(in srgb, var(--log-secondary) 24%, transparent) 64% 70%, transparent 70% 75%, color-mix(in srgb, var(--log-third) 14%, transparent) 75% 80%, transparent 80%), #122239;
  box-shadow: inset 3px 0 0 var(--pi-blue);
}
#log .log-next-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; padding: 12px 16px 0; }
#log .log-next-heading > span { padding: 4px 7px; background: var(--pi-blue); color: #0b1829; font: 800 .55rem/1 var(--font); text-transform: uppercase; letter-spacing: .06em; transform: skewX(-8deg); }
#log .log-next-heading strong { color: #f1f6ff; font: 700 1.25rem/1.1 var(--display); text-transform: uppercase; }
#log .log-next-heading strong small { margin: 0 4px; color: #9eb8d3; font-size: .65em; }
#log .log { border: 0; border-radius: 0; background: transparent; }
#log .log-row { grid-template-columns: 74px 86px minmax(100px, 1fr) 80px 80px minmax(116px, 1fr); gap: 12px; padding: 12px 20px; border-top: 1px solid #89a7c120; min-height: 66px; color: #dce7f5; }
#log .log-completed {
  background: linear-gradient(118deg, transparent 21%, color-mix(in srgb, var(--log-primary) 23%, transparent) 21% 40%, transparent 40% 44%, color-mix(in srgb, var(--log-secondary) 16%, transparent) 44% 51%, transparent 51% 54%, color-mix(in srgb, var(--log-third) 10%, transparent) 54% 57%, transparent 57%), linear-gradient(90deg, color-mix(in srgb, var(--log-primary) 10%, #101c2d), #0d1828);
  box-shadow: inset 3px 0 0 color-mix(in srgb, var(--log-primary) 75%, #8fa6c3);
}
#log .log-head { min-height: 32px; padding-block: 9px; border-top: 0; background: #0a1422; color: #8fa9c3; font: 700 .55rem/1.25 var(--font); letter-spacing: .06em; }
#log .log-head > :nth-child(4), #log .log-head > :nth-child(5) { text-align: center; }
#log .log-head > :nth-child(5) { padding-right: 0; }
#log .log-head > :nth-child(6) { padding-left: 0; border: 0; text-align: right; }
#log .log-date { color: #bdcde0; font: 600 .8rem/1.2 var(--font); white-space: nowrap; }
#log .log-opp { display: flex; align-items: center; gap: 6px; }
#log .log-venue { width: 14px; flex: none; color: #8fa9c3; font: 600 .65rem/1 var(--font); text-align: center; }
#log .log-opp .team-badge { display: grid; place-items: center; flex: 0 0 42px; width: 42px; height: 34px; border: 1px solid color-mix(in srgb, var(--badge-primary) 50%, #647c95); border-radius: 5px 1px; color: #f0f6ff; font: 800 1rem/1 var(--display); }
#log .log-res { display: flex; align-items: center; gap: 7px; color: #e0eafa; font: 700 1.1rem/1.1 var(--display); white-space: nowrap; }
#log .log-res b { width: auto; font-weight: 800; }
#log .log-rating {
  padding: 7px 3px; border: 1px solid #7295ad38; border-radius: 4px; background: linear-gradient(165deg, #040b13, #142333);
  box-shadow: inset 0 2px 5px #0009, 0 1px 0 #ffffff0a; color: #8bdcff; text-shadow: 0 0 9px #65caff24;
  font: 800 1.6rem/1 var(--display); text-align: center;
}
#log .log-extra { color: #acbfd4; font: 800 1.3rem/1 var(--display); text-align: center; }
body[data-team] #log .log-extra.pos, #log .log-row.win .log-res b { color: #86efac; }
body[data-team] #log .log-extra.neg, #log .log-row.loss .log-res b { color: #f18e9b; }
#log .log-edges { justify-content: flex-end; gap: 6px; }
#log .log-edges small { color: #93adc8; font-size: .65rem; }
#log .log .score-marks { font-size: .7rem; letter-spacing: 1px; }
#log .log-row.log-upcoming { min-height: 86px; padding: 27px 16px 13px; border: 0; background: transparent; box-shadow: none; }
#log .log-upcoming .log-date small, #log .log-sim-label { bottom: calc(100% + 6px); color: #a8c9e5; font: 700 .5rem/1 var(--font); letter-spacing: .04em; }
#log .log-upcoming .log-date small { display: block; }
#log .log-sim-score { position: relative; display: block; height: auto; line-height: 1.1; }
#log .log-sim-score > span { display: flex; align-items: center; gap: 7px; }
#log .log-upcoming .log-rating, #log .log-upcoming .log-extra { position: relative; }
#log .log-upcoming .log-rating::before, #log .log-upcoming .log-extra::before { position: absolute; bottom: calc(100% + 6px); left: 0; width: 100%; color: #a8c9e5; font: 700 .5rem/1 var(--font); text-transform: uppercase; letter-spacing: .04em; text-shadow: none; }
#log .log-upcoming .log-rating::before { content: 'PI Rating'; }
#log .log-upcoming .log-extra::before { content: 'Extra'; }
#log .simulation-dots i { background: var(--pi-blue); }
#log .log-pagination { margin: 0; padding: 14px 16px; background: #0a1422; border-top: 1px solid #89a7c120; }
#log .log-pagination button { min-height: 44px; border-color: #355777; border-radius: 5px 1px; background: #14283f; color: #cce7ff; }
#log .log-pagination button:hover { background: #203f5e; }
#log .log-pagination button:focus-visible { outline-color: var(--pi-blue); }
@media (max-width: 760px) {
  #log .log-row { grid-template-columns: 48px 62px minmax(68px, 1fr) 58px 50px; gap: 8px; padding-inline: 12px; }
  #log .log-row > .log-edges, #log .log-head > :nth-child(6) { display: none; }
  #log .log-sim-result .log-edges { grid-column: 1 / -1; display: flex; height: auto; min-height: 14px; margin-top: 2px; }
  #log .log-upcoming .log-sim-result .log-edges::before { content: 'Stats won'; color: #8fa9c3; font: 600 .5rem/1 var(--font); text-transform: uppercase; letter-spacing: .04em; }
  #log .log-next-card { margin: 10px; }
  #log .log-next-heading { padding-inline: 12px; }
  #log .log-row.log-upcoming { padding-inline: 12px; }
}
@media (max-width: 520px) {
  #log .game-log-head { gap: 8px; padding: 14px 12px; }
  #log .game-log-head h2 { font-size: 1.75rem; }
  #log .game-log-head p { font-size: .6rem; }
  #log .game-log-sim { min-width: 125px; padding: 10px 15px 10px 9px; font-size: .92rem; }
  #log .log-row { grid-template-columns: 38px 50px minmax(54px, 1fr) 48px 40px; gap: 5px; padding-inline: 10px; }
  #log .log-date { font-size: .65rem; }
  #log .log-opp { gap: 3px; }
  #log .log-venue { width: 11px; font-size: .55rem; }
  #log .log-opp .team-badge { width: 34px; flex-basis: 34px; height: 30px; font-size: .9rem; }
  #log .log-res { gap: 4px; font-size: .95rem; }
  #log .log-rating { font-size: 1.35rem; padding-block: 6px; }
  #log .log-extra { font-size: 1.1rem; }
  #log .log-head { font-size: .46rem; letter-spacing: .02em; }
  #log .log-next-heading { gap: 7px; padding-inline: 10px; }
  #log .log-next-heading strong { font-size: 1.05rem; }
  #log .log-row.log-upcoming { padding-inline: 10px; }
}
@media (max-width: 360px) {
  #log .log-row { grid-template-columns: 34px 44px minmax(50px, 1fr) 44px 34px; gap: 4px; padding-inline: 8px; }
  #log .log-row.log-upcoming { padding-inline: 8px; }
  #log .log-opp .team-badge { width: 30px; flex-basis: 30px; font-size: .8rem; }
  #log .log-date { font-size: .6rem; }
  #log .log-res { gap: 3px; font-size: .85rem; }
  #log .log-extra { font-size: 1rem; }
}

/* Possession DNA: compact league context, with the original charts on demand. */
body[data-team] #app > #possession-dna.section.band,
body[data-team] #app > #totals.season-totals {
  padding: 0; border: 1px solid #29435d; border-radius: 12px 2px; background: #0d1828; overflow: hidden;
  scroll-margin-top: calc(var(--site-header-height, 120px) + 12px);
}
#possession-dna::before, #totals.season-totals::before { display: none; }
#possession-dna { --dna-columns: minmax(0, 1fr) 96px 64px 18px; --dna-column-gap: 16px; --dna-row-inset: 20px; }
#possession-dna .dna-header {
  padding: 16px 20px; border-top: 2px solid var(--pi-yellow);
  background: linear-gradient(118deg, transparent 82%, #65caff0a 82% 88%, transparent 88%), #111f32;
}
#possession-dna .dna-header p { margin: 6px 0 0; color: #9fb4cb; font: 500 .7rem/1.4 var(--font); }
#possession-dna .dna-header h2 { margin: 0; color: #f1f6ff; font: italic 800 clamp(1.8rem, 4vw, 2.25rem)/1 var(--display); letter-spacing: -.02em; text-transform: uppercase; }
#possession-dna .dna-header h2 span { color: var(--pi-yellow); }
#possession-dna [data-tier] { --dna-tone: #8fa9c3; }
#possession-dna [data-tier="elite"] { --dna-tone: #86efac; }
#possession-dna [data-tier="above"] { --dna-tone: #86d9ab; }
#possession-dna [data-tier="average"] { --dna-tone: #ffd84d; }
#possession-dna [data-tier="poor"] { --dna-tone: #f18e9b; }
#possession-dna .dna-headlines { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding: 14px 20px; }
#possession-dna .dna-headline {
  display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; min-height: 90px; padding: 8px 10px;
  border: 1px solid #779abb25; border-top: 2px solid var(--dna-tone); border-radius: 6px 1px; text-align: left; cursor: pointer;
  background: #142135; color: #eff5ff;
}
#possession-dna .dna-headline > strong { font: 700 1.12rem/1.15 var(--display); text-transform: uppercase; }
#possession-dna .dna-headline > span { display: flex; align-items: baseline; gap: 6px; width: 100%; margin-top: auto; color: #9fb4cb; font-size: .6rem; }
#possession-dna .dna-headline b { color: var(--dna-tone); font: 800 2rem/1 var(--display); }
#possession-dna .dna-headline span small { color: #8da3bc; font: 500 .65rem/1 var(--font); }
#possession-dna .dna-headline:hover { border-color: var(--dna-tone); }
#possession-dna .dna-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 4px; padding: 0 14px 8px 20px; }
#possession-dna .dna-units { margin: 0; color: #91a9c1; font: 600 .57rem/1.4 var(--font); text-transform: uppercase; letter-spacing: .03em; }
#possession-dna .dna-info-button { width: 44px; min-height: 44px; flex: none; padding: 0; border: 0; background: transparent; color: #a8c9e3; font-size: 1.15rem; cursor: pointer; }
#possession-dna .dna-method-popover { width: min(360px, calc(100vw - 32px)); margin: auto; padding: 22px; border: 1px solid #416382; border-radius: 8px 2px; background: #101e30; color: #b8cbe0; box-shadow: 0 16px 60px #000a; }
#possession-dna .dna-method-popover::backdrop { background: #030b164d; }
#possession-dna .dna-method-popover h3 { margin: 0 28px 12px 0; color: #e1f0ff; font: 800 1.3rem/1.2 var(--display); text-transform: uppercase; }
#possession-dna .dna-method-popover p { margin: 12px 0 0; font: 400 .78rem/1.6 var(--font); }
#possession-dna .dna-method-popover > button { position: absolute; top: 7px; right: 7px; width: 44px; height: 44px; background: transparent; border: 0; color: #a8c9e3; font-size: 1.5rem; cursor: pointer; }
#possession-dna .dna-column-labels {
  display: grid; grid-template-columns: var(--dna-columns); column-gap: var(--dna-column-gap);
  padding: 7px var(--dna-row-inset) 9px; color: #9cb3cb; font: 600 .58rem/1.3 var(--font); letter-spacing: .05em; text-transform: uppercase;
}
#possession-dna .dna-column-labels > :nth-child(2) { text-align: right; }
#possession-dna .dna-column-labels > :nth-child(3) { text-align: center; white-space: nowrap; }
#possession-dna .dna-group > h3 { margin: 0; padding: 11px 20px; color: #8ebcdc; background: #0a1422; border-top: 1px solid #86a7c225; font: 700 .58rem/1.2 var(--font); letter-spacing: .12em; text-transform: uppercase; }
#possession-dna .dna-metric { scroll-margin-top: calc(var(--site-header-height, 120px) + 12px); border-top: 1px solid #89a7c118; }
#possession-dna .dna-metric > summary {
  display: grid; grid-template-columns: var(--dna-columns); align-items: center; gap: 9px var(--dna-column-gap); min-height: 70px; padding: 10px var(--dna-row-inset); list-style: none; cursor: pointer;
  background: #122034;
}
#possession-dna .dna-metric > summary::-webkit-details-marker, #totals.season-totals > summary::-webkit-details-marker { display: none; }
#possession-dna .dna-name { grid-column: 1; grid-row: 1; min-width: 0; overflow-wrap: anywhere; color: #edf4ff; font: 700 1.2rem/1.1 var(--display); }
#possession-dna .dna-number { grid-column: 2; grid-row: 1; text-align: right; color: #f1f7ff; font: 800 1.95rem/1 var(--display); font-variant-numeric: tabular-nums; white-space: nowrap; }
#possession-dna .dna-number .dna-unit { font-size: .6em; }
#possession-dna .dna-rank { grid-column: 3; grid-row: 1; display: grid; place-items: center; width: 100%; height: 32px; border: 1px solid color-mix(in srgb, var(--dna-tone) 16%, transparent); border-radius: 4px; background: color-mix(in srgb, var(--dna-tone) 6%, #0b1523); text-align: center; }
#possession-dna .dna-rank b { color: var(--dna-tone); font: 800 1.2rem/1 var(--display); font-variant-numeric: tabular-nums; white-space: nowrap; }
#possession-dna .dna-chevron { grid-column: 4; grid-row: 1 / 3; color: #b8dcf6; font: 600 1.5rem/1 var(--font); text-align: center; transition: color .15s; }
#possession-dna .dna-chevron::before { content: '+'; }
#possession-dna .dna-metric[open] > summary { background: #172b43; }
#possession-dna .dna-metric[open] > summary .dna-chevron { color: #7dd3fc; }
#possession-dna .dna-metric[open] > summary .dna-chevron::before { content: '−'; }
#possession-dna .dna-meter { position: relative; grid-column: 1 / 4; grid-row: 2; width: 100%; height: 3px; margin: 1px 0 3px; border-radius: 2px; background: linear-gradient(90deg, #f18e9b33 0% 30%, #ffd84d33 30% 55%, #86d9ab33 55% 80%, #86efac33 80%); }
#possession-dna .dna-meter i { position: absolute; top: 50%; width: 7px; height: 7px; border: 1px solid #bdcbdc; background: var(--dna-tone); border-radius: 50%; transform: translate(-50%, -50%); box-shadow: 0 0 0 1px #0d1828; }
#possession-dna .dna-detail { padding: 18px 20px; background: #0b1727; border-top: 1px solid #44648355; }
#possession-dna .dna-compare-values { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
#possession-dna .dna-compare-values > div { display: flex; flex-direction: column; gap: 5px; padding: 12px; border-radius: 4px; background: #15283f; }
#possession-dna .dna-compare-values > div:first-child { box-shadow: inset 3px 0 0 var(--dna-tone); }
#possession-dna .dna-compare-values span { color: #b1c8df; font: 600 .65rem/1.4 var(--font); }
#possession-dna .dna-compare-values strong { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px 8px; color: #e9f3ff; font: 800 2rem/1 var(--display); }
#possession-dna .dna-compare-values small { color: #8fa9c3; font-size: .6rem; }
#possession-dna .dna-delta { color: #9bb3cd; font: 700 .85rem/1.3 var(--font); white-space: nowrap; }
#possession-dna .is-positive { color: #86efac; }
#possession-dna .is-negative { color: #f18e9b; }
#possession-dna .dna-note { margin: 7px 0 0; color: #8fa9c3; font-size: .65rem; line-height: 1.55; }
#possession-dna .dna-trend { margin-top: 16px; padding-top: 14px; border-top: 1px solid #86a7c225; }
#possession-dna .dna-trend-heading { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px; font-size: .67rem; color: #abc5df; }
#possession-dna .dna-trend svg { display: block; width: 100%; height: 76px; margin-top: 10px; overflow: visible; }
#possession-dna .dna-trend polyline { fill: none; stroke: var(--pi-blue); stroke-width: 2; }
#possession-dna .dna-trend circle { fill: var(--pi-blue); stroke: #0b1727; stroke-width: 1; }
#possession-dna .dna-trend-baseline { stroke: #6e8ba53b; stroke-width: 1; }
#possession-dna .dna-trend-dates { display: flex; justify-content: space-between; color: #91aac4; font-size: .6rem; }
#possession-dna :is(summary, button):focus-visible, #totals.season-totals > summary:focus-visible { outline: 2px solid var(--pi-yellow); outline-offset: -3px; }
#totals.season-totals { margin-top: 18px; }
#totals.season-totals > summary { display: flex; align-items: center; gap: 12px; min-height: 62px; padding: 12px 20px; list-style: none; cursor: pointer; background: linear-gradient(118deg, transparent 64%, #65caff20 64% 77%, transparent 77% 81%, #ffd84d20 81% 85%, transparent 85%), #14243a; }
#totals.season-totals > summary > span { color: #edf5ff; font: 800 1.3rem/1 var(--display); text-transform: uppercase; }
#totals.season-totals > summary small { margin-left: auto; color: #9bc8e8; font-size: .68rem; }
#totals.season-totals > summary b { color: var(--pi-yellow); font: 500 1.5rem/1 var(--font); }
#totals.season-totals .totals-close-label { display: none; }
#totals.season-totals[open] .totals-open-label { display: none; }
#totals.season-totals[open] .totals-close-label { display: inline; }
#totals.season-totals[open] > summary b { transform: rotate(45deg); }
#totals .season-totals-content { padding: 20px; border-top: 1px solid #29435d; }
@media (max-width: 700px) {
  #possession-dna { --dna-columns: minmax(0, 1fr) 70px 48px 14px; --dna-column-gap: 8px; --dna-row-inset: 12px; }
  #possession-dna .dna-header { padding: 14px; }
  #possession-dna .dna-headlines { grid-template-columns: 1fr 1fr; gap: 8px; padding: 12px; }
  #possession-dna .dna-headline { min-height: 96px; padding: 6px 10px; }
  #possession-dna .dna-headline > strong { font-size: 1.05rem; }
  #possession-dna .dna-toolbar { padding: 0 6px 8px 12px; }
  #possession-dna .dna-units { font-size: .54rem; }
  #possession-dna .dna-group > h3 { padding-inline: 12px; }
  #possession-dna .dna-metric > summary { row-gap: 6px; }
  #possession-dna .dna-name { font-size: 1.05rem; }
  #possession-dna .dna-number { font-size: 1.8rem; }
  #possession-dna .dna-rank { height: 30px; }
  #possession-dna .dna-rank b { font-size: 1.15rem; }
  #possession-dna .dna-detail { padding: 14px 12px; }
  #totals.season-totals > summary { padding-inline: 12px; }
  #totals .season-totals-content { padding: 16px 10px; }
}
@media (prefers-reduced-motion: reduce) { #possession-dna .dna-chevron { transition: none; } }

/* Game-log details stay behind a tap, so the score rows remain compact. */
#log .log-game > summary, #log .log-head { grid-template-columns: 74px 86px minmax(100px, 1fr) 80px 80px minmax(116px, 1fr) 12px; }
#log .log-game > summary { list-style: none; cursor: pointer; border-top: 1px solid #89a7c120; }
#log .log-game > summary::-webkit-details-marker, #log .log-stats-details > summary::-webkit-details-marker { display: none; }
#log .log-game > summary:hover { background: #8bbfe308; }
#log .log-game > summary:focus-visible, #log .log-stats-details > summary:focus-visible { outline: 2px solid var(--pi-blue); outline-offset: -3px; }
#log .log-chevron { color: #a8cee9; font: 500 1.1rem/1 var(--font); text-align: center; }
#log .log-game[open] .log-chevron { transform: rotate(45deg); color: var(--pi-yellow); }
#log .log-game-detail { padding: 15px 20px 18px; background: #0c192b; border-top: 1px solid #7295ad38; }
#log .log-game-detail > p { color: #acbfd6; font-size: .75rem; line-height: 1.6; margin: 12px 0; }
#log .log-game-detail .log-final-label { margin: 0 0 12px; color: #95bdda; font: 700 .6rem/1.3 var(--font); letter-spacing: .07em; text-transform: uppercase; }
#log .log-detail-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
#log .log-detail-metrics > span { display: flex; flex-direction: column; gap: 5px; color: #9fbad4; font: 600 .65rem/1.4 var(--font); }
#log .log-detail-metrics b { color: #8bdcff; font: 800 1.8rem/1 var(--display); }
#log .log-breakdown-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 44px; padding: 10px 13px; background: #17344f; color: #c4e9ff; border-radius: 5px 1px; font: 700 .7rem/1.3 var(--font); text-transform: uppercase; text-decoration: none; }
#log .log-breakdown-link:hover { background: #214968; }
#log .log-sim-label.is-simulated { padding: 3px 5px; background: #65caff; border-radius: 2px; color: #0b1829; font-weight: 800; font-size: .47rem; }
#log .log-stats-details { grid-column: 1 / -1; min-width: 0; }
#log .log-stats-details > summary { display: flex; justify-content: flex-end; align-items: center; gap: 8px; min-height: 44px; padding: 5px 0; list-style: none; cursor: pointer; color: #abcce5; }
#log .log-stats-details > summary > span:first-child { margin-right: auto; font: 700 .55rem/1.2 var(--font); text-transform: uppercase; letter-spacing: .04em; }
#log .log-stats-details > summary > b { font: 700 .7rem/1 var(--font); }
#log .log-stats-details > summary > i { font: 500 1.1rem/1 var(--font); color: var(--pi-blue); }
#log .log-stats-details[open] > summary > i { transform: rotate(45deg); }
#log .log-stats-breakdown { padding: 13px 0 0; border-top: 1px solid #8eb9d733; }
#log .log-stats-breakdown h3 { color: #e0f2ff; margin: 0; font: 800 1.15rem/1.2 var(--display); text-transform: uppercase; }
#log .log-stats-breakdown p { color: #adc3d9; font-size: .65rem; line-height: 1.6; margin: 8px 0; }
#log .log-stats-breakdown dl { margin: 14px 0; }
#log .log-stat-line { display: grid; grid-template-columns: minmax(0, 1fr) 66px 74px; align-items: center; gap: 8px; padding: 10px 8px; background: #0b172acc; border-top: 1px solid #89a7c120; }
#log .log-stat-line dt { color: #e0ebf8; font: 700 1rem/1.2 var(--display); }
#log .log-stat-line dt small { display: block; margin-top: 3px; color: #9eafc5; font: 600 .55rem/1.2 var(--font); }
#log .log-stat-line[data-verdict="won"] dt small { color: #86efac; }
#log .log-stat-line[data-verdict="lost"] dt small { color: #f18e9b; }
#log .log-stat-line[data-verdict="tied"] dt small { color: #ffd84d; }
#log .log-stat-line dd { display: flex; flex-direction: column; gap: 4px; margin: 0; text-align: right; }
#log .log-stat-line dd b { color: #d6eafb; font: 800 1.1rem/1 var(--display); }
#log .log-stat-line dd small { color: #95afca; font: 600 .48rem/1.25 var(--font); }
#log .log-stats-breakdown .log-save-note { margin: 12px 0 0; padding: 10px; background: #0a172b; border-left: 2px solid var(--pi-blue); }
.game-opportunity-context, .saved-sim-comparison { margin: 20px 0; padding: 20px; border: 1px solid #305273; border-radius: 8px 2px; background: linear-gradient(118deg, #14243b, #0c192a); }
.game-opportunity-context h2, .saved-sim-comparison h3 { margin: 0 0 12px; color: #d7edff; font: 800 1.5rem/1.2 var(--display); text-transform: uppercase; }
.game-opportunity-context > p, .saved-sim-comparison > p { color: #aabfd6; font-size: .78rem; line-height: 1.6; }
.conversion-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 16px 0; }
.conversion-grid > div { display: grid; gap: 5px; padding: 14px; border-radius: 4px; background: #182d45; }
.conversion-grid strong { color: var(--pi-yellow); font: 700 1rem/1 var(--display); }
.conversion-grid b { color: #d8f1ff; font: 800 1.9rem/1 var(--display); margin-top: 8px; }
.conversion-grid small { color: #a2bbd6; font-size: .65rem; }
.game-opportunity-context .conversion-note, .saved-sim-comparison > p { font-size: .65rem; }
.saved-sim-comparison table { width: 100%; border-collapse: collapse; color: #d3e6f7; font: 600 .75rem/1.5 var(--font); }
.saved-sim-comparison :is(th, td) { padding: 10px 8px; border-bottom: 1px solid #6d93b12b; text-align: right; }
.saved-sim-comparison th:first-child { text-align: left; color: #a8c0d8; }
.saved-sim-comparison thead { color: #8bdcff; }
#log .saved-sim-comparison { padding: 12px; margin: 14px 0; }
#log .saved-sim-comparison h3 { font-size: 1.1rem; }
@media (max-width: 760px) {
  #log .log-game > summary, #log .log-head { grid-template-columns: 48px 62px minmax(68px, 1fr) 58px 50px 10px; }
  #log .log-game-detail { padding-inline: 12px; }
  #log .log-stat-line { grid-template-columns: minmax(0, 1fr) 50px 60px; gap: 6px; }
}
@media (max-width: 520px) {
  #log .log-game > summary, #log .log-head { grid-template-columns: 38px 50px minmax(54px, 1fr) 48px 40px 10px; }
  #log .log-game-detail { padding-inline: 10px; }
  .game-opportunity-context, .saved-sim-comparison { padding: 14px 12px; }
}
@media (max-width: 360px) {
  #log .log-game > summary, #log .log-head { grid-template-columns: 34px 44px minmax(50px, 1fr) 44px 34px 10px; }
  #log .log-stats-details > summary { gap: 5px; }
  #log .log-stats-details .score-marks { font-size: .65rem; letter-spacing: 1px; }
}
