/* Modal routes on the per-hill route maps (report → player paths by phase). */
.hr-panel { --team:74,127,229; position:absolute; z-index:2; display:grid; align-content:start; gap:9px; overflow:hidden; padding:10px 12px; border:1px solid rgba(255,255,255,.08); border-radius:10px; background:rgba(10,10,12,.78); line-height:1.3; font-family:var(--font-ui) !important; }
.hr-blue { --team:74,127,229; }
.hr-red { --team:232,76,76; }
.hr-block { display:grid; gap:5px; min-width:0; }
.hr-block + .hr-block { padding-top:9px; border-top:1px solid rgba(255,255,255,.07); }
.hr-head { display:flex; align-items:center; gap:7px; color:#b8b5ad; font-size:9px; font-weight:900; letter-spacing:1.3px; text-transform:uppercase; }
.hr-head b { margin-left:auto; color:rgb(var(--team)); font-family:var(--font-display) !important; font-size:22px; line-height:1; letter-spacing:0; }
.hr-dot { width:8px; height:8px; flex:0 0 8px; border-radius:50%; background:rgb(var(--team)); }
.hr-route { display:flex; flex-wrap:wrap; align-items:center; gap:4px 5px; min-width:0; }
.hr-route span { padding:3px 7px; border:1px solid rgba(var(--team),.45); border-radius:6px; background:rgba(var(--team),.12); color:#f4f0e8; font-size:10px; font-weight:900; letter-spacing:.4px; text-transform:uppercase; white-space:nowrap; }
.hr-route i { color:#74766f; font-size:11px; font-style:normal; }
.hr-route em { color:#74766f; font-size:10px; font-style:normal; font-weight:700; }
.hr-note { color:#8f938d; font-size:10px; font-weight:700; }
.hr-across { color:#c9ac45; }

/* No open corner (grid view, small screens): the same blocks sit under the map. */
.hr-strip { position:static; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:12px; border:0; border-top:1px solid var(--border); border-radius:0; background:#101010; }
.hr-strip .hr-block + .hr-block { padding-top:0; border-top:0; }

.hr-players { border-top:1px solid var(--border); background:#121212; font-family:var(--font-ui) !important; }
.hr-players summary { padding:10px 14px; color:#b8b5ad; font-size:10px; font-weight:900; letter-spacing:1.2px; text-transform:uppercase; cursor:pointer; }
.hr-players summary:hover { color:var(--yellow); }
.hr-player-list { display:grid; gap:4px; padding:0 12px 4px; }
.hr-player { display:grid; grid-template-columns:8px minmax(70px,120px) minmax(0,1fr) auto; gap:10px; align-items:center; min-height:34px; padding:5px 8px; border-radius:7px; background:rgba(255,255,255,.025); }
.hr-player > b { overflow:hidden; color:#f0ece3; font-size:11px; font-weight:900; text-overflow:ellipsis; white-space:nowrap; }
.hr-share { color:#b8b5ad; font-size:10px; font-weight:900; white-space:nowrap; }
.hr-foot { padding:6px 14px 12px; color:#74766f; font-size:10px; font-weight:700; line-height:1.5; }
@media(max-width:600px){ .hr-player { grid-template-columns:8px minmax(0,1fr) auto; } .hr-player .hr-route { grid-column:2 / -1; } }

html[data-theme="light"] body .hr-panel { border-color:#d3dbea; background:rgba(255,255,255,.9); }
html[data-theme="light"] body .hr-route span { color:#172033; }
html[data-theme="light"] body :is(.hr-head,.hr-share,.hr-players summary) { color:#5d687a; }
html[data-theme="light"] body :is(.hr-note,.hr-foot) { color:#6b7587; }
html[data-theme="light"] body .hr-across { color:#9a6700; }
html[data-theme="light"] body .hr-strip, html[data-theme="light"] body .hr-players { background:#f8fafd; }
html[data-theme="light"] body .hr-player { background:#eef2f8; }
html[data-theme="light"] body .hr-player > b { color:#172033; }

/* Corner panels are compact so they fit the open space around the map. */
.hr-panel:not(.hr-strip) { gap:7px; padding:8px 10px; }
.hr-panel:not(.hr-strip) .hr-block { gap:4px; }
.hr-panel:not(.hr-strip) .hr-block + .hr-block { padding-top:7px; }
.hr-panel:not(.hr-strip) .hr-head b { font-size:19px; }
.hr-panel:not(.hr-strip) .hr-route span { padding:2px 6px; font-size:9px; }
.hr-panel:not(.hr-strip) .hr-note { font-size:9px; }

/* Route split: every route with its share, the modal route first. */
.hr-count { margin-left:auto; color:#74766f; font-size:9px; letter-spacing:.6px; }
.hr-rows { display:grid; gap:3px; }
.hr-row { position:relative; display:grid; grid-template-columns:34px minmax(0,1fr) auto; gap:8px; align-items:center; min-height:20px; padding:2px 7px; overflow:hidden; border-radius:5px; background:rgba(255,255,255,.03); }
.hr-row::before { content:""; position:absolute; inset:0 auto 0 0; width:var(--share); background:rgba(var(--team),.14); }
.hr-row > * { position:relative; }
.hr-row b { color:#d8d5ce; font-size:11px; font-weight:900; }
.hr-row.is-top { background:rgba(var(--team),.06); box-shadow:inset 0 0 0 1px rgba(var(--team),.38); }
.hr-row.is-top::before { background:rgba(var(--team),.26); }
.hr-row.is-top b { color:rgb(var(--team)); font-size:12px; }
.hr-path { overflow:hidden; color:#f0ece3; font-size:10px; font-weight:800; letter-spacing:.3px; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }
.hr-row small { color:#74766f; font-size:9px; font-weight:900; }

.hr-breakdowns { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:14px; padding:2px 14px 12px; }
.hr-breakdown { --team:74,127,229; display:grid; gap:6px; }
.hr-breakdown.hr-red { --team:232,76,76; }
.hr-player { grid-template-columns:8px minmax(70px,120px) minmax(0,1fr); align-items:start; }
.hr-player > .hr-dot { margin-top:6px; }
.hr-player > b { padding-top:2px; }
.hr-player-routes { display:grid; gap:4px; min-width:0; }
.hr-player-route { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px 10px; opacity:.72; }
.hr-player-route.is-top { opacity:1; }
.hr-player em { color:#74766f; font-size:10px; font-style:normal; font-weight:700; }

html[data-theme="light"] body .hr-row { background:rgba(23,32,51,.04); }
html[data-theme="light"] body .hr-row b { color:#334155; }
html[data-theme="light"] body .hr-path { color:#172033; }
html[data-theme="light"] body .hr-row.is-top b { color:rgb(var(--team)); }
.hr-breakdowns { align-items:start; }
.hr-breakdown { align-content:start; }
.hr-head { white-space:nowrap; }
.hr-count { overflow:hidden; text-overflow:ellipsis; }
.hr-row.is-other .hr-path { color:#8f938d; font-style:normal; text-transform:none; letter-spacing:0; }
.hr-row.is-other::before { background:rgba(255,255,255,.07); }
html[data-theme="light"] body .hr-row.is-other .hr-path { color:#6b7587; }

/* Readable everywhere except the fixed-size corner panels: rows wrap instead of
   cutting the route off, so the hill at the end of the path is always visible. */
.hr-strip .hr-row, .hr-breakdown .hr-row { align-items:start; padding-block:5px; }
.hr-strip .hr-path, .hr-breakdown .hr-path { white-space:normal; overflow:visible; text-overflow:clip; overflow-wrap:anywhere; line-height:1.35; }
.hr-strip .hr-row > b, .hr-breakdown .hr-row > b, .hr-strip .hr-row small, .hr-breakdown .hr-row small { line-height:1.35; }
@media(max-width:600px){
  .hr-players summary { font-size:11px; line-height:1.4; }
  .hr-breakdowns { grid-template-columns:1fr; padding-inline:10px; }
  .hr-strip .hr-path, .hr-breakdown .hr-path { font-size:11px; }
  .hr-strip .hr-row, .hr-breakdown .hr-row { grid-template-columns:38px minmax(0,1fr) auto 12px; gap:8px; }
  .hr-strip .hr-row > b, .hr-breakdown .hr-row > b { font-size:12px; }
  .hr-head { white-space:normal; flex-wrap:wrap; row-gap:2px; }
  .hr-player-list { padding-inline:10px; }
  .hr-player { grid-template-columns:8px minmax(0,1fr); }
  .hr-player .hr-player-routes { grid-column:1 / -1; }
  .hr-player-route { justify-content:flex-start; }
  .hr-route span { font-size:10px; }
  .hr-foot { padding-inline:10px; }
}

/* Rows are buttons. Long routes and "other routes" show an arrow and open in place. */
button.hr-row { width:100%; border:0; color:inherit; font:inherit; text-align:left; cursor:default; -webkit-appearance:none; appearance:none; }
.hr-row { grid-template-columns:34px minmax(0,1fr) auto 12px; }
.hr-chev { display:none; width:7px; height:7px; margin-top:-3px; border-right:2px solid rgb(var(--team)); border-bottom:2px solid rgb(var(--team)); transform:rotate(45deg); transition:transform .15s ease; }
.hr-row.is-long, .hr-row.is-open, .hr-row.is-other { cursor:pointer; }
.hr-row.is-long .hr-chev, .hr-row.is-open .hr-chev, .hr-row.is-other .hr-chev { display:block; }
.hr-row.is-long:hover, .hr-row.is-open:hover, .hr-row.is-other:hover { background:rgba(var(--team),.12); }
.hr-row.is-open .hr-chev, .hr-row.is-other[aria-expanded="true"] .hr-chev { margin-top:3px; transform:rotate(-135deg); }
.hr-row.is-open { align-items:start; padding-block:5px; }
.hr-row.is-open .hr-path { white-space:normal; overflow:visible; text-overflow:clip; overflow-wrap:anywhere; line-height:1.35; }
.hr-row.is-other .hr-path { color:rgb(var(--team)); font-weight:900; }
.hr-row.is-other[aria-expanded="true"] { background:none; }
.hr-row.is-other[aria-expanded="true"]::before { display:none; }
.hr-row:focus-visible { outline:2px solid rgb(var(--team)); outline-offset:1px; }
.hr-panel:not(.hr-strip) { overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.25) transparent; }
.hr-row[hidden], .hr-row small[hidden] { display:none !important; }

/* Jump-bar anchor for "Hill Approach": land below the sticky report header. */
#sHillApproach { scroll-margin-top:var(--report-anchor-offset,190px); }

/* Spawns per hill: where each team came back after dying. */
.hs-panel { display:grid; gap:10px; padding:12px 14px; border-top:1px solid var(--border); background:#0d0d0f; font-family:var(--font-ui) !important; }
.hs-title { display:flex; align-items:baseline; gap:10px; color:#f4f0e8; font-size:10px; font-weight:900; letter-spacing:1.6px; text-transform:uppercase; }
.hs-title span { color:#8f938d; font-size:10px; font-weight:700; letter-spacing:.3px; text-transform:none; }
.hs-team { --team:74,127,229; display:grid; gap:6px; }
.hs-team.hs-red { --team:232,76,76; }
.hs-head { display:flex; align-items:center; flex-wrap:wrap; gap:7px; color:#b8b5ad; font-size:9px; font-weight:900; letter-spacing:1.3px; text-transform:uppercase; }
.hs-read { margin-left:auto; color:rgb(var(--team)); font-size:10px; letter-spacing:.5px; }
.hs-spots { display:flex; flex-wrap:wrap; gap:6px; }
.hs-spot { position:relative; display:inline-flex; align-items:center; gap:6px; overflow:hidden; padding:5px 9px; border:1px solid rgba(var(--team),.28); border-radius:8px; background:rgba(255,255,255,.03); color:#cfcac0; font-size:11px; line-height:1.2; }
.hs-spot::before { content:""; position:absolute; inset:0 auto 0 0; width:var(--share); background:rgba(var(--team),.14); }
.hs-spot > * { position:relative; }
.hs-spot em { padding:1px 5px; border-radius:4px; background:rgba(255,255,255,.08); color:#8f938d; font-size:8.5px; font-style:normal; font-weight:900; letter-spacing:.8px; text-transform:uppercase; }
.hs-spot b { color:#f4f0e8; font-size:11px; font-weight:900; letter-spacing:.3px; text-transform:uppercase; }
.hs-share { color:rgb(var(--team)); font-weight:900; }
.hs-spot small { color:#8f938d; font-size:10px; }
.hs-spot.is-major { border-color:rgba(var(--team),.7); }
.hs-spot.is-major em { background:rgb(var(--team)); color:#fff; }
.hs-more { align-self:center; color:#8f938d; font-size:10px; font-weight:700; }
.hs-across { color:#c9ac45; font-size:10px; font-weight:700; }
.hs-foot { margin:0; color:#8f938d; font-size:10px; line-height:1.5; }
.hs-key-ring, .hs-key-dot { display:inline-block; width:8px; height:8px; margin:0 2px -1px; border-radius:50%; vertical-align:baseline; }
.hs-key-ring { border:1.5px solid #b8b5ad; }
.hs-key-dot { background:#b8b5ad; }
.hs-key-tag { padding:0 4px; border-radius:3px; background:#b8b5ad; color:#111; font-size:8px; font-weight:900; letter-spacing:.6px; }
/* Major spawn tags on the route map. Two teams on one callout stack. */
.hs-marker { --team:74,127,229; position:absolute; z-index:3; display:inline-flex; align-items:center; gap:4px; padding:2px 6px 2px 4px; border-radius:5px; background:rgb(var(--team)); color:#fff; font:900 9.5px/1.2 var(--font-ui); letter-spacing:.3px; white-space:nowrap; box-shadow:0 2px 8px rgba(0,0,0,.55); transform:translate(-50%,calc(-50% + var(--stack) * 18px)); pointer-events:auto; }
.hs-marker.hs-red { --team:232,76,76; }
.hs-marker b { padding:0 3px; border-radius:3px; background:rgba(0,0,0,.28); font-size:8px; letter-spacing:.7px; }
html[data-theme="light"] body .hs-panel { background:#f7f8fa; }
html[data-theme="light"] body .hs-title { color:#172033; }
html[data-theme="light"] body .hs-spot { background:#fff; color:#3d4655; }
html[data-theme="light"] body .hs-spot b { color:#172033; }
html[data-theme="light"] body :is(.hs-head,.hs-foot,.hs-spot small,.hs-more,.hs-title span) { color:#5d687a; }
html[data-theme="light"] body .hs-across { color:#9a6700; }

/* Spawn areas: clustered spawn circles on the map, with a coach's read per team. */
.hs-areas { display:grid; gap:10px; padding-top:4px; }
.hs-areas-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.hs-areas-head b { display:block; color:#f4f0e8; font-size:10px; font-weight:900; letter-spacing:1.6px; text-transform:uppercase; }
.hs-areas-head span { display:block; margin-top:3px; color:#8f938d; font-size:11px; line-height:1.45; max-width:560px; }
.hs-download { flex:none; padding:7px 12px; border:1px solid rgba(255,208,31,.55); border-radius:8px; background:rgba(255,208,31,.1); color:#FFD01F; font:900 10px/1 var(--font-ui); letter-spacing:1px; text-transform:uppercase; cursor:pointer; }
.hs-download:hover { background:rgba(255,208,31,.2); }
.hs-download:disabled { opacity:.6; cursor:default; }
.hs-areas-map { overflow:hidden; border:1px solid rgba(255,255,255,.08); border-radius:10px; background:#050506; }
.hs-areas-map canvas { display:block; width:100%; }
.hs-areas-legend { display:grid; gap:8px; }
.hs-area-team { --team:74,127,229; display:grid; gap:5px; }
.hs-area-team.hs-red { --team:232,76,76; }
.hs-area-read { display:flex; align-items:center; flex-wrap:wrap; gap:7px; color:#cfcac0; font-size:12px; }
.hs-area-read b { color:rgb(var(--team)); font-size:11px; font-weight:900; letter-spacing:1px; text-transform:uppercase; }
.hs-area-list { display:flex; flex-wrap:wrap; gap:6px; }
.hs-area-item { display:inline-flex; align-items:center; gap:6px; padding:4px 9px; border:1px dashed rgba(var(--team),.5); border-radius:999px; color:#e9e4da; font-size:11px; font-weight:700; }
.hs-area-item i { width:9px; height:9px; border-radius:50%; border:1.5px dashed rgb(var(--team)); }
.hs-area-item b { color:rgb(var(--team)); font-weight:900; }
.hs-area-item small { color:#8f938d; font-size:10px; font-weight:600; }
.hs-area-item.is-major { border-style:solid; background:rgba(var(--team),.12); }
.hs-area-item.is-major i { border-style:solid; background:rgba(var(--team),.5); }
html[data-theme="light"] body .hs-areas-head b { color:#172033; }
html[data-theme="light"] body :is(.hs-areas-head span,.hs-area-item small) { color:#5d687a; }
html[data-theme="light"] body .hs-area-read { color:#3d4655; }
html[data-theme="light"] body .hs-area-item { color:#172033; }
html[data-theme="light"] body .hs-download { background:#fff7d1; color:#7a5a00; border-color:#d9b53a; }