/* Three distinct action cards within the illustrated volunteer rail. */
.tournaments-page #volunteer-signup { padding-top: 0; }
.tournaments-page #volunteer-signup > .section-wrap { padding-right: 16px; padding-left: 16px; }
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer {
  --rail-divider: linear-gradient(180deg, transparent, rgba(255, 255, 255, .48) 22%, #fff 50%, rgba(255, 255, 255, .48) 78%, transparent);
  display: grid !important;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.35fr) minmax(0, .73fr) minmax(0, .95fr) !important;
  grid-template-areas: "brand views change message" !important;
  align-items: stretch;
  gap: 0 !important;
  width: 100%;
  max-width: none;
  min-height: 96px !important;
  margin: 0 auto 10px !important;
  padding: 0;
  overflow: visible;
  border: 1px solid #35577c;
  border-radius: 7px;
  background:
    radial-gradient(circle at 12% 20%, rgba(35, 92, 124, .23), transparent 35%),
    linear-gradient(110deg, #0c223f 0%, #0b1c35 51%, #151b39 100%);
  box-shadow: inset 0 1px rgba(160, 202, 237, .12), 0 12px 24px rgba(0, 8, 24, .22);
  text-align: left;
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer::after {
  display: none !important;
}

.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .tourney-panel-intro-title {
  grid-area: brand !important;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  min-width: 0;
  padding: 12px 10px 8px 14px;
  text-align: left !important;
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .tourney-panel-intro-title::after {
  position: absolute;
  top: 16px;
  right: 0;
  bottom: 16px;
  width: 1px;
  background: var(--rail-divider);
  content: "";
  pointer-events: none;
}
.tournaments-page #volunteer-signup .volunteer-brand-main {
  display: flex;
  align-items: center;
  gap: clamp(7px, 1vw, 14px);
}
.tournaments-page #volunteer-signup .volunteer-brand-icon {
  display: grid;
  flex: 0 0 clamp(48px, 4.3vw, 62px);
  place-items: center;
  width: clamp(48px, 4.3vw, 62px);
  height: clamp(48px, 4.3vw, 62px);
}
.tournaments-page #volunteer-signup .volunteer-brand-icon img,
.tournaments-page #volunteer-signup .volunteer-message-icon img,
.tournaments-page #volunteer-signup .volunteer-action-icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .section-title {
  margin: 0;
  color: #fff;
  font-size: clamp(1.25rem, 2.3vw, 1.8rem);
  line-height: .96;
  text-align: left !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, .25);
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .section-title span {
  display: block;
}
.tournaments-page #volunteer-signup .volunteer-brand-tagline {
  margin: 6px 0 0 2px;
  color: #d9e5f3;
  font: 700 clamp(.39rem, .52vw, .47rem)/1.2 "Josefin Sans", sans-serif;
  letter-spacing: .07em;
  text-transform: uppercase;
  white-space: nowrap;
}

.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs {
  grid-area: views !important;
  display: grid;
  box-sizing: border-box;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 9px;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 10px 0 10px 10px;
  border: 0;
  background: none;
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button,
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button[data-volunteer-view="results"] {
  --action-border: #2fbcad;
  --action-glow: rgba(24, 214, 197, .18);
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
  width: 100%;
  min-width: 0;
  min-height: 68px;
  height: 68px;
  margin: 0;
  padding: 6px 20px 6px 5px;
  border: 1px solid var(--action-border);
  border-radius: 6px;
  background: linear-gradient(125deg, #092a38, #071d32);
  color: #fff;
  box-shadow: inset 0 1px rgba(255, 255, 255, .12), 0 0 9px var(--action-glow);
  font-size: .6rem;
  opacity: 1;
  transform: none;
  white-space: normal;
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button[data-volunteer-view="results"] {
  --action-border: #286bc1;
  --action-glow: rgba(47, 132, 245, .2);
  background: linear-gradient(125deg, #0b315b, #091c3f);
}
.tournaments-page #volunteer-signup .volunteer-view-tabs button::after,
.tournaments-page #volunteer-signup .volunteer-change summary::after {
  position: absolute;
  top: 50%;
  right: 7px;
  display: block;
  width: auto;
  height: auto;
  border: 0;
  background: none;
  box-shadow: none;
  color: #fff;
  content: "›";
  font: 700 1.5rem/1 Arial, sans-serif;
  opacity: 1;
  transform: translateY(-50%);
  pointer-events: none;
}
.tournaments-page #volunteer-signup .volunteer-view-tabs button::before,
.tournaments-page #volunteer-signup .volunteer-change summary::before {
  display: none !important;
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button[aria-selected="true"] {
  border-color: #71ffe8;
  background: linear-gradient(125deg, #0b4e56, #07313b);
  box-shadow: inset 0 0 0 1px rgba(134, 255, 240, .6), inset 0 0 20px rgba(44, 229, 212, .2), 0 0 14px rgba(42, 232, 218, .6);
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button[data-volunteer-view="results"][aria-selected="true"] {
  border-color: #72c8ff;
  background: linear-gradient(125deg, #124e83, #092a56);
  box-shadow: inset 0 0 0 1px rgba(145, 214, 255, .6), inset 0 0 20px rgba(70, 155, 250, .2), 0 0 14px rgba(54, 153, 255, .58);
}
.tournaments-page #volunteer-signup .volunteer-view-tabs button:is(:hover, :focus-visible) {
  border-color: #a9e5ff;
  box-shadow: inset 0 0 0 1px rgba(186, 232, 255, .42), 0 0 17px var(--action-glow);
}
.tournaments-page #volunteer-signup .volunteer-view-tabs button[data-volunteer-view="signup"]:is(:hover, :focus-visible) {
  border-color: #8bffed;
  box-shadow: inset 0 0 0 1px rgba(134, 255, 240, .45), 0 0 17px rgba(42, 232, 218, .45);
}
.tournaments-page #volunteer-signup .volunteer-view-tabs button[data-volunteer-view="signup"][aria-selected="true"]:is(:hover, :focus-visible) {
  border-color: #71ffe8;
  background: linear-gradient(125deg, #0b4e56, #07313b);
  box-shadow: inset 0 0 0 1px rgba(134, 255, 240, .6), inset 0 0 20px rgba(44, 229, 212, .2), 0 0 14px rgba(42, 232, 218, .6);
}
.tournaments-page #volunteer-signup .volunteer-view-tabs button[data-volunteer-view="results"][aria-selected="true"]:is(:hover, :focus-visible) {
  border-color: #72c8ff;
  background: linear-gradient(125deg, #124e83, #092a56);
  box-shadow: inset 0 0 0 1px rgba(145, 214, 255, .6), inset 0 0 20px rgba(70, 155, 250, .2), 0 0 14px rgba(54, 153, 255, .58);
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button:focus-visible,
.tournaments-page #volunteer-signup .volunteer-change summary:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}
.tournaments-page #volunteer-signup .volunteer-action-icon {
  display: grid;
  flex: 0 0 clamp(46px, 4.7vw, 62px);
  place-items: center;
  width: clamp(46px, 4.7vw, 62px);
  height: clamp(46px, 4.7vw, 62px);
  margin: 0;
  pointer-events: none;
}
.tournaments-page #volunteer-signup .volunteer-action-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
  text-align: left;
}
.tournaments-page #volunteer-signup .volunteer-action-icon img {
  transition: transform .3s cubic-bezier(.2, .8, .2, 1), filter .3s ease;
}
.tournaments-page #volunteer-signup .volunteer-view-tabs button:is(:hover, :focus-visible) .volunteer-action-icon img,
.tournaments-page #volunteer-signup .volunteer-change summary:is(:hover, :focus-visible) .volunteer-action-icon img {
  transform: scale(1.14);
  filter: drop-shadow(0 0 10px rgba(131, 206, 255, .75));
}
.tournaments-page #volunteer-signup .volunteer-view-tabs button[data-volunteer-view="signup"]:is(:hover, :focus-visible) .volunteer-action-icon img {
  filter: drop-shadow(0 0 10px rgba(62, 206, 185, .75));
}
.tournaments-page #volunteer-signup .volunteer-change summary:is(:hover, :focus-visible) .volunteer-action-icon img {
  filter: drop-shadow(0 0 10px rgba(203, 126, 255, .75));
}
.tournaments-page #volunteer-signup .volunteer-view-tabs button:is(:hover, :focus-visible) .volunteer-action-label,
.tournaments-page #volunteer-signup .volunteer-change summary:is(:hover, :focus-visible) .volunteer-action-label {
  color: #fff;
  text-shadow: 0 0 12px currentColor;
}
.tournaments-page #volunteer-signup .volunteer-action-label {
  display: block;
  font: 700 clamp(.57rem, .95vw, .72rem)/1.2 "Josefin Sans", sans-serif;
  letter-spacing: .09em;
  text-align: left;
  text-transform: uppercase;
}
.tournaments-page #volunteer-signup .volunteer-view-tabs button[data-volunteer-view="signup"] .volunteer-action-label { color: #62bda3; }
.tournaments-page #volunteer-signup .volunteer-view-tabs button[data-volunteer-view="results"] .volunteer-action-label { color: #a3d2fb; }
.tournaments-page #volunteer-signup .volunteer-view-tabs button[data-volunteer-view="signup"]:is(:hover, :focus-visible) .volunteer-action-label { color: #62bda3; }
.tournaments-page #volunteer-signup .volunteer-view-tabs button[data-volunteer-view="results"]:is(:hover, :focus-visible) .volunteer-action-label { color: #a3d2fb; }
.tournaments-page #volunteer-signup .volunteer-view-tabs button[data-volunteer-view="results"][aria-selected="true"] .volunteer-action-label { color: #6cc9ff; }
.tournaments-page #volunteer-signup .volunteer-view-tabs button[data-volunteer-view="results"][aria-selected="true"] .volunteer-action-caption { color: #fff; }
.tournaments-page #volunteer-signup .volunteer-view-tabs button[data-volunteer-view="results"][aria-selected="true"] .volunteer-action-icon img {
  filter: brightness(1.16) contrast(1.08) drop-shadow(0 0 6px rgba(67, 173, 255, .65));
}
.tournaments-page #volunteer-signup .volunteer-action-caption {
  display: block;
  margin-top: 4px;
  color: #e2eafa;
  font: 400 clamp(.49rem, .72vw, .6rem)/1.2 "Josefin Sans", sans-serif;
  text-align: left;
}

.tournaments-page #volunteer-signup .volunteer-change {
  grid-area: change !important;
  position: relative;
  display: flex;
  align-items: center;
  min-width: 0;
}
.tournaments-page #volunteer-signup .volunteer-change::before,
.tournaments-page #volunteer-signup .volunteer-change::after {
  position: absolute;
  top: 16px;
  bottom: 16px;
  width: 1px;
  background: var(--rail-divider);
  content: "";
  pointer-events: none;
}
.tournaments-page #volunteer-signup .volunteer-change::before { left: 0; }
.tournaments-page #volunteer-signup .volunteer-change::after { right: 0; }
.tournaments-page #volunteer-signup .volunteer-change::before { display: none; }
.tournaments-page #volunteer-signup .volunteer-change[open] { z-index: 10; }
.tournaments-page #volunteer-signup .volunteer-change summary {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
  box-sizing: border-box;
  width: calc(100% - 18px);
  min-height: 68px;
  height: 68px;
  margin: 10px 10px 10px 8px;
  padding: 6px 20px 6px 5px;
  border: 1px solid #9051b9;
  border-radius: 6px;
  background: linear-gradient(125deg, #30204f, #161d3e);
  box-shadow: inset 0 1px rgba(255, 255, 255, .12), 0 0 9px rgba(154, 78, 209, .24);
  list-style: none;
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.tournaments-page #volunteer-signup .volunteer-change summary::-webkit-details-marker { display: none; }
.tournaments-page #volunteer-signup .volunteer-change summary:hover,
.tournaments-page #volunteer-signup .volunteer-change summary:focus-visible,
.tournaments-page #volunteer-signup .volunteer-change[open] summary {
  border-color: #d29bff;
  background: linear-gradient(125deg, #492768, #242053);
  box-shadow: inset 0 0 0 1px rgba(215, 161, 255, .5), inset 0 0 20px rgba(187, 91, 241, .18), 0 0 14px rgba(177, 90, 231, .48);
}
.tournaments-page #volunteer-signup .volunteer-change[open] summary {
  border-color: #d29bff;
}
.tournaments-page #volunteer-signup .volunteer-change .volunteer-action-label { color: #ddd0ff; }
.tournaments-page #volunteer-signup .volunteer-change .volunteer-manage-actions {
  position: absolute;
  top: calc(100% + 5px);
  right: 4px;
  z-index: 11;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  width: 255px;
  max-width: calc(100vw - 32px);
  margin: 0;
  padding: 12px;
  border: 1px solid #a292cf;
  border-radius: 8px;
  background: #12223f;
  box-shadow: 0 15px 32px rgba(0, 8, 22, .55);
}
.tournaments-page #volunteer-signup .volunteer-change .volunteer-manage-actions button { width: 100%; }

/* One chosen card stays lit; hovering any part of another card lights it temporarily. */
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button[data-volunteer-view="signup"] {
  --hover-border: #91ffec;
  --hover-glow: rgba(42, 232, 218, .8);
  --hover-surface: linear-gradient(125deg, #12636a, #0a3d49);
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button[data-volunteer-view="results"] {
  --hover-border: #9bdcff;
  --hover-glow: rgba(65, 164, 255, .8);
  --hover-surface: linear-gradient(125deg, #185a92, #103a72);
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-change summary {
  --hover-border: #dda9ff;
  --hover-glow: rgba(190, 105, 245, .8);
  --hover-surface: linear-gradient(125deg, #593078, #30255f);
  opacity: .55;
  transition: opacity .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button {
  transition: opacity .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button[aria-selected="false"],
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer:has(.volunteer-change[open]) .volunteer-view-tabs button {
  opacity: .55;
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-change[open] summary {
  opacity: 1;
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button:is([aria-selected="true"], [aria-selected="false"]):is(:hover, :focus-visible),
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-change summary:is(:hover, :focus-visible),
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer:has(.volunteer-change[open]) .volunteer-view-tabs button:is(:hover, :focus-visible) {
  opacity: 1;
  border-color: var(--hover-border);
  background: var(--hover-surface);
  box-shadow: inset 0 0 0 1px var(--hover-border), inset 0 0 18px var(--hover-glow), 0 0 17px var(--hover-glow);
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button[aria-selected="true"] .volunteer-action-icon img,
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-change[open] summary .volunteer-action-icon img {
  filter: brightness(1.18) drop-shadow(0 0 7px var(--hover-glow));
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button:is([aria-selected="true"], [aria-selected="false"]):is(:hover, :focus-visible) .volunteer-action-icon img,
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-change summary:is(:hover, :focus-visible) .volunteer-action-icon img {
  transform: scale(1.12);
  filter: brightness(1.35) drop-shadow(0 0 12px var(--hover-glow));
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button[aria-selected="true"]::after,
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-change[open] summary::after {
  text-shadow: 0 0 9px var(--hover-glow);
}
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button:is([aria-selected="true"], [aria-selected="false"]):is(:hover, :focus-visible)::after,
.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-change summary:is(:hover, :focus-visible)::after {
  color: #fff;
  text-shadow: 0 0 6px #fff, 0 0 14px var(--hover-glow);
  transform: translateY(-50%) scale(1.1);
}

.tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .tourney-panel-intro-copy {
  grid-area: message !important;
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 10px;
  text-align: left !important;
}
.tournaments-page #volunteer-signup .volunteer-message-copy { min-width: 0; }
.tournaments-page #volunteer-signup .volunteer-message-icon {
  display: grid;
  flex: 0 0 59px;
  place-items: center;
  width: 59px;
  height: 59px;
}
.tournaments-page #volunteer-signup .tourney-panel-intro-copy .section-label {
  display: block;
  margin: 0 0 7px;
  color: #f4d178;
  font: 700 .702rem/1.25 "Josefin Sans", sans-serif;
  letter-spacing: .11em;
  text-align: left;
  text-transform: uppercase;
}
.tournaments-page #volunteer-signup .volunteer-message-thanks {
  margin: 0;
  color: #dbe3ef;
  font: 400 .635rem/1.35 "Josefin Sans", sans-serif;
}

@media (min-width: 981px) and (max-width: 1199px) {
  .tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .tourney-panel-intro-copy { gap: 6px; padding: 6px; }
  .tournaments-page #volunteer-signup .volunteer-message-icon { flex-basis: 43px; width: 43px; height: 43px; }
  .tournaments-page #volunteer-signup .tourney-panel-intro-copy .section-label { margin-bottom: 4px; font-size: .55rem; letter-spacing: .06em; }
  .tournaments-page #volunteer-signup .volunteer-message-thanks { font-size: .48rem; line-height: 1.2; }
}
@media (max-width: 980px) {
  .tournaments-page #volunteer-signup .tourney-panel-intro--volunteer {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-template-areas: "brand brand message" "views views change" !important;
  }
  .tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .tourney-panel-intro-title,
  .tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .tourney-panel-intro-copy {
    min-height: 102px;
    border-bottom: 1px solid rgba(141, 180, 214, .24);
  }
  .tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .tourney-panel-intro-title::after {
    top: 16px;
    bottom: 16px;
  }
  .tournaments-page #volunteer-signup .volunteer-change::after { display: none; }
  .tournaments-page #volunteer-signup .volunteer-change summary { margin-right: 10px; }
}
@media (max-width: 760px) {
  .tournaments-page #volunteer-signup .tourney-panel-intro--volunteer {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas: "brand" "views" "change" "message" !important;
  }
  .tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .tourney-panel-intro-title::after { display: none; }
  .tournaments-page #volunteer-signup .volunteer-change::before { display: none; }
  .tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .tourney-panel-intro-title { min-height: 105px; }
  .tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .section-title { font-size: clamp(1.5rem, 6.5vw, 2rem); }
  .tournaments-page #volunteer-signup .volunteer-brand-tagline { font-size: .46rem; letter-spacing: .1em; }
  .tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs { padding: 10px; }
  .tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button { min-height: 72px; height: 72px; }
  .tournaments-page #volunteer-signup .volunteer-change { border-bottom: 1px solid rgba(141, 180, 214, .24); padding: 0 10px 10px; }
  .tournaments-page #volunteer-signup .volunteer-change summary {
    justify-content: flex-start;
    width: 100%;
    min-height: 72px;
    height: 72px;
    margin: 0;
    padding: 8px 20px 8px 8px;
  }
  .tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .tourney-panel-intro-copy { min-height: 86px; border-bottom: 0; }
}
@media (max-width: 350px) {
  .tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs {
    grid-template-columns: minmax(0, 1fr);
  }
  .tournaments-page #volunteer-signup .tourney-panel-intro--volunteer .volunteer-view-tabs button {
    justify-content: flex-start;
    width: 100%;
    min-height: 72px;
    padding: 8px 20px 8px 8px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .tournaments-page #volunteer-signup .volunteer-view-tabs button,
  .tournaments-page #volunteer-signup .volunteer-action-icon img,
  .tournaments-page #volunteer-signup .volunteer-change summary { transition: none; }
}