#gamesPage .toolbar {
  margin-bottom:12px
}
.game-detail-page { position:relative; max-width:1100px }
.game-detail-back { display:inline-flex; align-items:center; gap:7px; margin-bottom:18px; color:var(--green); font-size:13px; font-weight:650; text-decoration:none }
.game-detail-back:hover { text-decoration:underline }
.game-detail-back .ico,.game-detail-back svg { width:15px; height:15px }
.page-heading.game-detail-heading { display:flex; align-items:center; justify-content:flex-start; gap:28px; min-width:0 }
.game-detail-heading-text { min-width:0 }
.game-detail-pagination { display:flex; flex:none; gap:6px; margin-left:auto; align-self:flex-start }
.game-detail-pagination a,.game-detail-pagination span { display:grid; place-items:center; width:36px; height:36px; border:1px solid var(--line); border-radius:7px; background:#fff; color:var(--green) }
.game-detail-pagination a { text-decoration:none }
.game-detail-pagination a:hover,.game-detail-pagination a:focus-visible { border-color:var(--green); background:var(--greenbg) }
.game-detail-pagination .is-disabled { color:#a8b2b9; background:#f5f7f8 }
.game-detail-pagination svg { width:18px; height:18px }
.game-detail-heading .game-detail-logo { width:132px; height:132px; border:0; border-radius:0; background:transparent; font-size:32px; letter-spacing:-1px }
.game-detail-heading .game-detail-logo img { padding:0; background:transparent }
.game-detail-logo[hidden],.game-detail-logo img[hidden] { display:none }
.game-detail-page .page-heading p { margin:4px 0 0; color:var(--muted); font-size:13px }
.game-detail-nav { display:flex; gap:5px; margin:22px 0 20px; padding:4px; overflow-x:auto; border-bottom:1px solid var(--line) }
.game-detail-nav[hidden] { display:none }
.game-detail-nav a { flex:none; padding:10px 15px; border-radius:7px 7px 0 0; color:var(--muted); font-size:13px; font-weight:700; text-decoration:none; white-space:nowrap }
.game-detail-nav a:hover { color:var(--green); background:var(--greenbg) }
.game-detail-nav a[aria-current="page"] { color:var(--green); background:var(--greenbg); box-shadow:inset 0 -2px var(--green) }
.game-detail-nav .game-detail-overview-link,.game-detail-nav .game-detail-edit-link { display:inline-flex; align-items:center; justify-content:center; min-width:39px }
.game-detail-nav .game-detail-edit-link { margin-left:auto }
.game-detail-nav .game-detail-overview-link .ico,.game-detail-nav .game-detail-overview-link svg,.game-detail-nav .game-detail-edit-link .ico,.game-detail-nav .game-detail-edit-link svg { width:16px; height:16px }
.game-detail-form { max-width:650px }
.game-attendance-scroll { overflow-x:auto }
.game-attendance-table { width:100%; border-collapse:collapse; font-size:12px; text-align:left }
.game-attendance-table th,.game-attendance-table td { padding:12px 14px; border-bottom:1px solid var(--line); vertical-align:middle }
.game-attendance-table thead th { color:var(--muted); background:#f7f9fa; font-size:11px }
.game-attendance-table tbody th { font-weight:650 }
.game-attendance-table select { width:100%; max-width:190px; padding:8px 10px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font:inherit }
.game-attendance-table .attendance-response { margin:0; max-width:none; display:inline-block; width:auto; padding:6px 9px }
.game-attendance-table .attendance-confirm,.game-attendance-table .attendance-pending { margin:0; display:inline-block; width:auto; max-width:none; padding:6px 9px }
.game-detail-layout { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(260px,1fr); gap:20px; align-items:start }
.game-detail-main,.game-detail-side { display:grid; gap:18px; min-width:0 }
.game-detail-section { background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:var(--shadow); padding:20px }
.game-detail-section h2 { font-size:16px; margin:0 0 16px }
.game-detail-count-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px }
.game-detail-count-heading h2 { margin:0 }
.game-detail-count-chip { flex:none; padding:5px 9px; border-radius:999px; background:#eef2f3; color:#536774; font-size:11px; font-weight:700; white-space:nowrap }
.game-detail-section .detail-line:first-child { border-top:0 }
#detailResponse .response-actions { width:100%; margin:0 }
.game-detail-section .person-pill { display:inline-block; margin:0 6px 6px 0 }
.game-detail-section .detail-wish-chip { display:inline-flex; align-items:center; gap:8px; max-width:100%; padding:4px 4px 4px 8px; border:1px solid transparent }
.detail-wish-name { min-width:0; overflow-wrap:anywhere }
button.detail-wish-name { padding:0; border:0; background:transparent; color:inherit; font:inherit; text-align:left; cursor:pointer }
button.detail-wish-name:hover { text-decoration:underline }
button.detail-wish-name:focus-visible { outline:2px solid var(--green); outline-offset:2px }
.detail-wish-chip .wish-counts { background:#5f6b73; color:#fff }
.game-detail-section .detail-wish-chip.is-assigned { background:#e0f3e6; border-color:#8cc9a2; color:#176644 }
.detail-wish-chip.is-assigned .wish-counts { background:#176644 }
.game-detail-section .form-field textarea { min-height:90px }
.game-detail-section .detail-line strong { min-width:0; overflow-wrap:anywhere; text-align:right }
.game-detail-section .detail-line strong a { color:var(--green) }
.infocenter-document {display:flex;flex-direction:column;gap:6px;padding:12px 0;border-bottom:1px solid #eef1f3;font-size:12px}
.infocenter-document:first-child {padding-top:0}
.infocenter-document:last-child {padding-bottom:0;border-bottom:0}
.infocenter-document strong {font-size:12px}
.infocenter-document a {color:var(--green);font-weight:650;overflow-wrap:anywhere}
.full-infocenter-top {display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:18px;align-items:stretch}
.full-infocenter-top > .game-detail-section {min-width:0}
.full-infocenter-documents .infocenter-document {min-width:0}
.full-infocenter-content-heading {display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px}
.full-infocenter-content-heading h2 {min-width:0;margin:0}
.full-infocenter-send {flex:none}
.full-infocenter-sent-status {margin:-8px 0 16px}
.infocenter-mail-preview {max-height:240px;overflow:auto;padding-left:20px;line-height:1.7}
.full-infocenter-content-areas {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.full-infocenter-content-area {min-width:0;border:1px solid var(--line);border-radius:8px;padding:14px}
.full-infocenter-content-area h3 {font-size:13px;margin:0 0 12px}
.full-infocenter-content-list {display:grid;gap:10px}
.full-infocenter-content-list .micro-note {margin:0}
.full-infocenter-content-item {min-width:0;border-top:1px solid var(--line);padding-top:10px;overflow-wrap:anywhere}
.full-infocenter-content-item:first-child {border-top:0;padding-top:0}
.full-infocenter-content-item-heading {display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:5px}
.full-infocenter-content-item strong {display:block;flex:1;min-width:0}
.full-infocenter-content-item p {margin:0;white-space:pre-wrap;line-height:1.5}
.full-infocenter-content-actions {display:flex;flex:none;gap:4px}
.full-infocenter-content-action {display:grid;place-items:center;width:26px;height:26px;padding:0;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--green)}
.full-infocenter-content-action:hover {background:var(--greenbg)}
.full-infocenter-content-action.is-delete {color:var(--red)}
.full-infocenter-content-action.is-delete:hover {background:var(--redbg)}
.full-infocenter-content-action svg {width:13px;height:13px}
.full-infocenter-content-add {display:grid;place-items:center;width:100%;min-height:42px;margin-top:14px;padding:8px;border:1px dashed #aabcc4;border-radius:8px;background:#fafcfc;color:var(--green)}
.full-infocenter-content-add:hover {border-color:var(--green);background:var(--greenbg)}
.full-infocenter-content-add svg {width:18px;height:18px}
.full-infocenter-standings {margin-top:18px}
.full-infocenter-standings-heading {display:flex;align-items:start;justify-content:space-between;gap:16px}
.full-infocenter-standings-heading h2 {margin-bottom:4px}
.full-infocenter-standings-heading .micro-note {margin:0 0 14px}
.full-infocenter-standings-heading .btn {flex:none}
.full-infocenter-standings-heading .btn[hidden] {display:none}
.full-infocenter-standings-scroll {overflow-x:auto}
.full-infocenter-standings-table {width:max-content;min-width:100%;border-collapse:collapse;font-size:12px;text-align:right}
.full-infocenter-standings-table th,.full-infocenter-standings-table td {padding:10px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
.full-infocenter-standings-table thead th {color:var(--muted);background:#f7f9fa;font-size:11px}
.full-infocenter-standings-table th:first-child {text-align:left;width:32px}
.full-infocenter-standings-table thead th:nth-child(2) {text-align:left}
.full-infocenter-standings-table .standings-team-name {text-align:left;white-space:nowrap}
.standings-team-name strong {display:inline-block;margin-right:6px}
.standings-team-marker {display:inline-block;margin:2px 4px 2px 0;padding:2px 6px;border-radius:4px;font-size:10px;font-weight:700;white-space:nowrap}
.standings-team-marker.home {color:#225530;background:#ddf1e1}
.standings-team-marker.guest {color:#774314;background:#fff0d8}
.full-infocenter-standings-table .is-home-team {background:#f0f9f1}
.full-infocenter-standings-table .is-guest-team {background:#fff8ec}
.full-infocenter-standings-table .is-home-team.is-guest-team {background:#eef5f6}
.game-detail-section .btn[type=submit] { margin-top:10px }
.game-detail-section[hidden] { display:none }
@media(max-width:760px) { .game-detail-layout { grid-template-columns:1fr } .game-detail-section { padding:16px } .game-detail-heading .game-detail-logo { width:92px; height:92px; font-size:24px } .page-heading.game-detail-heading { gap:16px } .game-detail-back { min-height:36px } .game-detail-pagination { position:absolute; top:0; right:0; margin-left:0 } }
@media(max-width:560px) { .page-heading.game-detail-heading { flex-wrap:wrap } .game-detail-heading-text { flex:1 1 calc(100% - 108px) } }
@media(max-width:560px) { .full-infocenter-top {grid-template-columns:1fr} }
@media(max-width:900px) { .full-infocenter-content-areas {grid-template-columns:1fr} }
#gamesPage .toolbar-right {
  margin-left:auto
}
.scroll-controls {
  display:flex;
  align-items:center;
  gap:6px;
  border-left:1px solid var(--line);
  padding-left:12px;
  margin-left:auto
}
.scroll-controls[hidden] { display:none }
.square-btn {
  border:1px solid var(--line);
  height:32px;
  width:32px;
  background:#fff;
  border-radius:6px;
  display:grid;
  place-items:center;
  color:#536774
}
.square-btn:hover {
  background:#eef2f3
}
.square-btn .ico {
  height:15px;
  width:15px
}
.scroll-shell {
  width:100%;
  overflow:hidden;
  position:relative
}
.cards {
  display:flex;
  gap:14px;
  overflow-x:auto;
  scroll-snap-type:x proximity;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  padding:1px 1px 3px;
  scrollbar-width:none;
  -ms-overflow-style:none;
  cursor:grab
}
.cards.is-dragging { scroll-snap-type:none }
.cards.is-dragging,
.cards.is-dragging * { cursor:grabbing!important; user-select:none }
.cards::-webkit-scrollbar {
  display:none;
  width:0;
  height:0
}
.square-btn:disabled {
  opacity:.4;
  cursor:default
}
@media (max-width:760px) {
  .cards { scroll-snap-type:x mandatory }
  .game-card { scroll-snap-stop:always }
}
@media (max-width:650px) {
  #gamesPage .toolbar-right { margin-left:0 }
}
.game-card {
  scroll-snap-align:start;
  flex:0 0 274px;
  min-width:274px;
  display:flex;
  flex-direction:column;
  background:white;
  border:1px solid #e1e7eb;
  border-radius:10px;
  box-shadow:var(--shadow);
  overflow:hidden;
  cursor:pointer
}
.game-card:focus-visible {outline:2px solid var(--green);outline-offset:3px}
.card-header {
  padding:15px 15px 11px;
  background:#fff
}
.card-topline {
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:7px
}
.card-game-label {display:flex;align-items:center;gap:6px;white-space:nowrap}
.game-wish-chip,.game-count-chip {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:3px;
  height:23px;
  padding:0 5px;
  border:1px solid #d2d9de;
  border-radius:12px;
  background:#eceff1;
  color:#53616c;
  font-size:10px;
  font-weight:700
}
.game-wish-chip {min-width:36px;cursor:pointer}
.game-wish-chip .ico,.game-count-chip .ico,.game-count-chip svg {width:12px;height:12px}
.game-wish-chip:hover,.game-wish-chip.is-active {background:#dce2e6;border-color:#acb9c1}
.game-wish-chip:focus-visible {outline:2px solid var(--green);outline-offset:2px}
.game-response-chip {gap:5px;cursor:pointer}
.game-response-chip:hover,.game-response-chip.is-active {background:#dce2e6;border-color:#acb9c1}
.game-response-chip:focus-visible {outline:2px solid var(--green);outline-offset:2px}
.game-response-chip > span {display:inline-flex;align-items:center;gap:2px}
.game-response-chip > span:first-child {color:var(--green)}
.game-response-chip > span:last-child {color:var(--red)}
.game-filled-chip.good {background:var(--greenbg);border-color:var(--green);color:var(--green)}
.game-filled-chip.warn {background:var(--amberbg);border-color:var(--amber);color:var(--amber)}
.game-filled-chip.bad {background:var(--redbg);border-color:var(--red);color:var(--red)}
.card-statuses {
  display:flex;
  align-items:center;
  gap:5px;
  margin-left:auto;
  white-space:nowrap
}
.game-number {
  font-size:11px;
  font-weight:650;
  color:#647581
}
.status {
  font-size:10px;
  font-weight:700;
  border-radius:5px;
  padding:5px 7px;
  white-space:nowrap
}
.status.green {
  background:var(--greenbg);
  color:var(--green)
}
.status.amber {
  background:var(--amberbg);
  color:var(--amber)
}
.status.red {
  background:var(--redbg);
  color:var(--red)
}
.date-line {
  display:flex;
  align-items:baseline;
  gap:8px;
  margin-top:12px;
  flex-wrap:wrap
}
.date-line strong {
  font-size:20px;
  letter-spacing:-.55px;
  font-weight:750
}
.date-line small {
  font-size:11px;
  color:#697985
}
.team-logo {
  position:relative;
  overflow:hidden;
  height:43px;
  width:43px;
  flex:none;
  background:#f1f4f6;
  border:1px solid #e4e9ed;
  border-radius:10px;
  display:grid;
  place-items:center;
  font-size:12px;
  font-weight:800;
  letter-spacing:-.9px;
  color:#3d5363
}
.team-logo img {position:absolute;inset:0;width:100%;height:100%;box-sizing:border-box;object-fit:contain;padding:4px;background:#fff}
.team-logo-small {width:32px;height:32px;border-radius:7px;font-size:10px}
.game-logo-button {padding:0;border:0;background:transparent;cursor:pointer}
.game-logo-button,.list-game-details {text-decoration:none}
.game-logo-button:focus-visible {outline:2px solid var(--green);outline-offset:3px;border-radius:5px}
.list-logo {display:grid;place-items:center}
.list-logo .team-logo {width:68px;height:68px;border:0;border-radius:0;background:transparent;font-size:18px}
.list-logo .team-logo img {padding:0;background:transparent}
.list-opponent {min-width:0}
.team-logo.orange {
  background:#fff1e8;
  color:#db6b2c
}
.team-logo.blue {
  background:#eaf3fa;
  color:#206aa4
}
.team-logo.red {
  background:#fbecee;
  color:#a92e4d
}
.team-logo.green {
  background:#ebf5e6;
  color:#377e3e
}
.team-logo.gold {
  background:#fff5d8;
  color:#ac7c19
}
.team-logo.navy {
  background:#ecf0f6;
  color:#233d72
}
.card-logo {
  display:flex;
  justify-content:center;
  align-items:center;
  margin-top:16px;
  min-height:110px;
  width:100%
}
.card-logo .team-logo {
  width:100%;
  height:110px;
  border:0;
  border-radius:0;
  background:transparent;
  font-size:28px;
  letter-spacing:-1px
}
.card-logo .team-logo img {
  padding:0;
  background:transparent
}
.game-card-times {
  position:relative;
  min-height:25px;
  display:flex;
  gap:8px 16px;
  align-items:center;
  flex-wrap:wrap;
  color:#82929d;
  font-size:11px;
  margin-top:9px
}
.game-card-times:focus-visible {outline:2px solid var(--green);outline-offset:2px;border-radius:3px}
.game-card-time {display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.game-card-time strong {font-weight:750;color:var(--ink)}
.game-card-time .ico {
  height:13px;
  width:13px
}
.game-card-times-tooltip {
  position:absolute;
  z-index:3;
  bottom:calc(100% + 7px);
  left:0;
  display:grid;
  gap:4px;
  width:max-content;
  max-width:calc(100% - 16px);
  padding:8px 10px;
  border-radius:6px;
  background:#1e2931;
  box-shadow:0 5px 14px rgba(20,31,39,.2);
  color:#fff;
  font-size:11px;
  line-height:1.35;
  white-space:nowrap;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .12s ease
}
.game-card-times:hover .game-card-times-tooltip,
.game-card-times:focus .game-card-times-tooltip {opacity:1;visibility:visible}
.game-time-label {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.card-body {
  border-top:1px solid var(--line);
  margin:2px 15px 0;
  padding-top:14px;
  flex:1;
  display:flex;
  flex-direction:column
}
.card-assignment-details {display:flex;flex-direction:column}
.card-assignment-details[hidden],.card-wish-details[hidden],.card-response-details[hidden] {display:none}
.card-wish-title {display:block;font-size:11px;color:#445767;margin-bottom:8px}
.card-response-details {display:grid;gap:12px}
.card-response-group > strong {display:block;margin-bottom:6px;color:#445767;font-size:11px}
.card-response-list {display:flex;flex-wrap:wrap;gap:5px;list-style:none;margin:0;padding:0}
.card-response-list li {padding:5px 8px;border:1px solid #c9e1f2;border-radius:12px;background:#edf6fd;color:#274b66;font-size:11px;font-weight:600;overflow-wrap:anywhere}
.card-wish-list {list-style:none;margin:0;padding:0;display:grid;gap:5px}
.card-wish-person {display:flex;align-items:center;gap:8px;width:100%;padding:5px 6px 5px 9px;border:1px solid #c9e1f2;border-radius:12px;background:#edf6fd;color:#274b66;font-size:11px;font-weight:600;overflow-wrap:anywhere}
.card-wish-name {min-width:0;flex:1;padding:2px 0;border:0;background:transparent;color:inherit;text-align:left;font:inherit;cursor:pointer}
.card-wish-name:hover {text-decoration:underline}
.wish-counts {display:inline-flex;align-items:center;flex:none;border-radius:8px;background:#174d72;color:#fff;font-size:11px;font-weight:800;white-space:nowrap}
.card-wish-confirmed,.card-wish-planned {display:inline-flex;align-items:center;gap:4px;min-height:23px;padding:0 6px}
.wish-counts .ico {width:12px;height:12px;flex:none}
.card-wish-confirmed,.card-wish-planned {cursor:help}
.card-wish-planned {border-left:1px solid rgba(255,255,255,.35)}
.card-wish-person:hover {background:#dceffc}
.card-wish-person.is-assigned {background:#e0f3e6;border-color:#8cc9a2;color:#176644}
.card-wish-person.is-assigned .wish-counts {background:#176644}
.card-wish-person.is-assigned:hover {background:#cdefd8}
.card-wish-name:focus-visible,.card-wish-confirmed:focus-visible,.card-wish-planned:focus-visible {outline:2px solid var(--green);outline-offset:2px}
.card-wish-name:disabled {cursor:default;opacity:.65;text-decoration:none}
.card-wish-empty {margin:0;font-size:11px;color:#697985}
.wish-history-tooltip {position:fixed;z-index:65;width:260px;max-width:calc(100vw - 16px);max-height:calc(100vh - 16px);overflow-y:auto;padding:10px 11px;background:#fff;border:1px solid #cbd9e2;border-radius:8px;box-shadow:0 8px 24px rgba(20,32,42,.2);color:#314656;font-size:11px}
.wish-history-total {display:block;margin-bottom:8px;font-size:12px;color:#173f5e}
.wish-history-section+.wish-history-section {margin-top:10px;padding-top:9px;border-top:1px solid #dbe4ea}
.wish-history-section>strong {display:block;margin-bottom:5px;font-size:11px}
.wish-history-tooltip ol {list-style:none;display:grid;gap:7px;margin:0;padding:0}
.wish-history-tooltip li {display:grid;gap:1px;padding-top:6px;border-top:1px solid #edf0f2}
.wish-history-tooltip p {margin:0;color:#697985}
.wish-position-menu {position:fixed;z-index:60;width:190px;max-height:min(250px,calc(100vh - 16px));overflow:auto;padding:6px;background:#fff;border:1px solid #cbd9e2;border-radius:8px;box-shadow:0 8px 24px rgba(20,32,42,.2)}
.wish-position-menu strong {display:block;padding:5px 7px 7px;color:#536571;font-size:10px}
.wish-position-menu button {display:block;width:100%;padding:8px 9px;border:0;border-radius:5px;background:#fff;color:var(--ink);text-align:left;font-size:11px;cursor:pointer}
.wish-position-menu button:hover,.wish-position-menu button:focus-visible {background:var(--greenbg);outline:none}
.wish-position-menu button:disabled {cursor:wait;opacity:.6}
.wish-position-menu p {margin:4px 7px 6px;color:#697985;font-size:11px}
.filled {
  font-size:10px;
  border-radius:5px;
  background:#edf2f4;
  color:#536571;
  padding:4px 6px;
  font-weight:700
}
.filled.good {
  background:var(--greenbg);
  color:var(--green)
}
.filled.warn {
  background:var(--amberbg);
  color:var(--amber)
}
.filled.bad {
  background:var(--redbg);
  color:var(--red)
}
.progress-track {
  height:5px;
  border-radius:7px;
  background:#edf0f2;
  overflow:hidden;
  margin-bottom:9px
}
.progress-track>span {
  display:block;
  height:100%;
  background:#73c393;
  border-radius:7px
}
.progress-track>span.warn {
  background:#e5b663
}
.progress-track>span.bad {
  background:#e59797
}
.role {
  display:flex;
  align-items:center;
  min-height:32px;
  width:100%;
  padding:0;
  border:0;
  border-bottom:1px solid #edf0f2;
  background:transparent;
  color:var(--ink);
  text-align:left;
  gap:7px
}
.role:is(button):hover {
  background:#f8fafb
}
.role-name {
  display:flex;
  align-items:center;
  gap:7px;
  flex:1;
  min-width:0;
  font-size:11px;
  color:#445767
}
.role-name span:not(.dot) {
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.role-name em {
  font-style:normal;
  color:#9aa6af;
  font-size:9px
}
.dot {
  width:7px;
  height:7px;
  background:#9ba9b2;
  border-radius:50%;
  flex:none
}
.dot.blue {
  background:#519ad3
}
.dot.green {
  background:#4ab787
}
.dot.purple {
  background:#a47de3
}
.dot.orange {
  background:#f2a444
}
.dot.cyan {
  background:#28a5bc
}
.dot.pink {
  background:#db729d
}
.dot.gray {
  background:#9ba9b2
}
.role-person {
  color:#2a3845;
  font-size:11px;
  max-width:102px;
  text-overflow:ellipsis;
  white-space:nowrap;
  overflow:hidden;
  font-weight:600
}
.role-person.empty {
  color:#b4bec6;
  font-weight:400
}
.edit-pen {
  width:12px;
  height:12px;
  color:#9ba8b1;
  opacity:0
}
.role:hover .edit-pen {
  opacity:1
}
.card-bottom {
  padding:10px 15px 13px
}
.doc-link {
  border:0;
  background:transparent;
  color:#415466;
  font-size:11px;
  padding:6px 0;
  display:flex;
  gap:7px;
  align-items:center;
  width:100%;
  text-align:left
}
.doc-link:hover {
  color:#1681b8
}
.doc-link .ico {
  width:13px;
  height:13px
}
.doc-link .arrow {
  margin-left:auto
}
.card-footer {
  padding:0 15px 13px
}
.card-footer .response-actions { margin-bottom:0 }
.response-actions {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:8px;position:relative}
.response-button {min-width:0;height:35px;border-radius:7px;font-size:11px;font-weight:700;cursor:pointer}
.response-yes {background:var(--green);border:1px solid var(--green);color:#fff}
.response-yes:hover:not(:disabled) {background:#176d4c}
.response-wish {background:#2372b8;border:1px solid #2372b8;color:#fff}
.response-wish:hover:not(:disabled) {background:#185b96}
.response-no {background:var(--red);border:1px solid var(--red);color:#fff}
.response-no:hover:not(:disabled) {background:#aa3d3e}
.response-button.is-muted,.response-button.is-muted:hover:not(:disabled) {background:#e5e9ec;border-color:#d4dde2;color:#a5afb6;opacity:1}
.response-button.is-selected {box-shadow:inset 0 0 0 2px #fff}
.response-button:disabled {cursor:default;opacity:.6}
.response-button.is-selected:disabled {opacity:1}
.position-menu {position:absolute;left:0;right:0;bottom:calc(100% + 7px);z-index:20;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 24px rgba(20,32,42,.2);padding:7px;max-height:240px;overflow:auto}
.position-menu strong {display:block;color:var(--muted);font-size:10px;padding:5px 7px 7px}
.position-menu button {display:block;width:100%;padding:8px 9px;text-align:left;background:#fff;border:0;border-radius:5px;color:var(--ink);font-size:12px;cursor:pointer}
.position-menu button:hover,.position-menu button:focus {background:var(--greenbg);outline:none}
#modal .position-menu {top:calc(100% + 7px);bottom:auto}
.empty-state {
  border:1px dashed #ccd8df;
  border-radius:10px;
  padding:48px;
  color:#687a86;
  text-align:center;
  min-width:100%
}
.empty-state strong {
  display:block;
  color:var(--ink);
  font-size:15px;
  margin-bottom:7px
}
.progress-track {
  display:block;
  width:100%;
  appearance:none;
  border:0
}
.progress-track::-webkit-progress-bar {
  background:#edf0f2;
  border-radius:7px
}
.progress-track::-webkit-progress-value {
  background:#73c393;
  border-radius:7px
}
.progress-track.warn::-webkit-progress-value {
  background:#e5b663
}
.progress-track.bad::-webkit-progress-value {
  background:#e59797
}
.progress-track::-moz-progress-bar {
  background:#73c393;
  border-radius:7px
}
.progress-track.warn::-moz-progress-bar {
  background:#e5b663
}
.progress-track.bad::-moz-progress-bar {
  background:#e59797
}
.status.good {
  background:var(--greenbg);
  color:var(--green)
}
.status.warn {
  background:var(--amberbg);
  color:var(--amber)
}
.status.bad {
  background:var(--redbg);
  color:var(--red)
}
.list-chevron {
  justify-self:end;
  color:#7e919f
}
.role:focus-visible .edit-pen {
  opacity:1
}

/* Keep past games readable while making them visually recede in both views. */
.game-card.is-past,
.list-game.is-past .list-game-panel {
  background:#f3f5f6;
  border-color:#dce2e5;
  box-shadow:none;
  color:#64717b
}
.game-card.is-past .card-header {
  background:transparent
}
.game-card.is-past .team-logo,
.list-game.is-past .team-logo {
  filter:grayscale(1);
  opacity:.55
}
.game-card.is-past .status,
.game-card.is-past .filled,
.game-card.is-past .game-count-chip,
.list-game.is-past .status,
.list-game.is-past .filled {
  background:#e5e9eb;
  color:#65727b
}
.game-card.is-past .game-filled-chip {border-color:#929fa8}
.game-card.is-past .game-response-chip > span {color:inherit}
.game-card.is-past .progress-track::-webkit-progress-value { background:#aeb9bf }
.game-card.is-past .progress-track::-moz-progress-bar { background:#aeb9bf }
.game-card.is-past .dot { background:#9faab0 }
.game-card.is-past .role-person,
.game-card.is-past .role-name,
.list-game.is-past .list-staff { color:#64717b }
.list-game.is-past .list-game-panel:hover { background:#e9eef0 }

.response-log-list {
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:8px;
}
.response-log-section { min-width:0 }
.response-log-heading { display:flex; align-items:end; justify-content:space-between; gap:16px; margin-bottom:18px }
.response-log-heading h2 { margin:0 0 7px; font-size:18px }
.response-log-filter { display:grid; gap:6px; width:min(100%,280px); flex:none }
.response-log-filter label { color:var(--muted); font-size:11px; font-weight:700 }
.response-log-filter select { height:37px; padding:0 11px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); font-size:12px }
@media (max-width:600px) { .response-log-heading { align-items:stretch; flex-direction:column } .response-log-filter { width:100% } }
.response-log-list li {
  display:grid;
  grid-template-columns:minmax(115px,auto) minmax(100px,1fr) minmax(130px,1fr);
  gap:4px 12px;
  align-items:baseline;
  padding:10px 12px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:10px;
  box-shadow:var(--shadow);
}
.response-log-list time,
.response-log-list small { color:#60717c; }
.response-log-list small { grid-column:2 / -1; }
@media (max-width:600px) {
  .response-log-list li { grid-template-columns:1fr; }
  .response-log-list small { grid-column:auto; }
}