/* Game Songs page. Builds on game-film.css (the .gf tokens, board, picker, legend and notes). */
.gs .gs-bar{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;padding:4px 20px 14px}
.gs .gs-play{font:700 15px var(--f-body);background:var(--ink);color:var(--panel);border-color:var(--ink);padding:10px 18px;min-width:108px}
.gs .gs-now{display:grid;gap:4px;flex:1 1 220px;min-width:0}
.gs .gs-ticker{font:500 13px var(--f-mono);color:var(--ink-2);min-height:1.4em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gs .gs-mutes{display:flex;flex-wrap:wrap;gap:6px}
.gs .gs-mute{display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:6px 11px;font-size:13px}
.gs .gs-mute i{width:9px;height:9px;border-radius:50%;background:var(--c);opacity:.35;transition:opacity 60ms}
.gs .gs-mute.lit i{opacity:1}
.gs .gs-mute[aria-pressed="false"]{opacity:.45;text-decoration:line-through}
.gs .gs-roll{padding:0 20px 10px}
.gs #roll{display:block;cursor:pointer;border:1px solid var(--rule);border-radius:4px;background:var(--ice)}
.gs .gs-legend{padding:0 20px 12px}
.gs .gs-k{display:inline-block;width:14px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.gs .gs-home{background:var(--home)}.gs .gs-away{background:var(--away)}
.gs .gs-pp{background:color-mix(in oklab,var(--home) 14%,var(--panel));border:1px solid var(--rule)}
.gs .gs-acts{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;padding:4px 20px 6px;border-top:1px solid var(--rule);padding-top:14px}
.gs .gs-link{font:500 13px var(--f-body);color:var(--home);text-decoration:none;padding:7px 4px}
.gs .gs-link:hover{text-decoration:underline}
.gs .gs-status{padding:0 20px 14px;min-height:1.4em;margin:0}
.gs .gs-map td:first-child{font-weight:600;white-space:nowrap}
.gs .gs-map td{vertical-align:top;padding-right:14px}
@media (max-width:620px){
  .gs .gs-bar,.gs .gs-roll,.gs .gs-legend,.gs .gs-acts,.gs .gs-status{padding-left:14px;padding-right:14px}
  .gs .gs-play{flex:1 1 100%}
}
@media (prefers-reduced-motion:reduce){.gs .gs-mute i{transition:none}}
.gs .gs-map th,.gs .gs-map td{text-align:left}
@media (max-width:620px){
  .gs .gs-map thead{display:none}
  .gs .gs-map tr{display:grid;gap:2px;padding:10px 0;border-bottom:1px solid var(--rule)}
  .gs .gs-map td{border:0;padding:0}
  .gs .gs-map td:nth-child(2){font:500 11px var(--f-mono);text-transform:uppercase;letter-spacing:.05em;color:var(--ink-3)}
}
