    @font-face {
      font-family: "Geogrotesque Wide";
      src: url("/assets/fonts/geogrotesque-wide-regular.pzqe7gIxYCEv-SH3hAf0l.woff2") format("woff2");
      font-weight: 400;
      font-style: normal;
      font-display: swap;
    }

    @font-face {
      font-family: "Geogrotesque Wide";
      src: url("/assets/fonts/geogrotesque-wide-medium.UxiF-7Pcfp_T-yqDopEK3.woff2") format("woff2");
      font-weight: 500;
      font-style: normal;
      font-display: swap;
    }

    @font-face {
      font-family: "Geogrotesque Wide";
      src: url("/assets/fonts/geogrotesque-wide-semi-bold.8gTfg12XmqgC-rrpZVBFO.woff2") format("woff2");
      font-weight: 600;
      font-style: normal;
      font-display: swap;
    }

    @font-face {
      font-family: "Geogrotesque Wide";
      src: url("/assets/fonts/geogrotesque-wide-bold.gXRWMHj9Yrnb-DBOVmEUH.woff2") format("woff2");
      font-weight: 700;
      font-style: normal;
      font-display: swap;
    }

    @font-face {
      font-family: "Geogrotesque Wide";
      src: url("/assets/fonts/GeogrotesqueWide-BdIt-B7Y8997N.woff2") format("woff2");
      font-weight: 800;
      font-style: italic;
      font-display: swap;
    }

    @font-face {
      font-family: "Geogrotesque Wide Banner";
      src: url("/assets/fonts/GeogrotesqueWide-BdIt-B7Y8997N.woff2") format("woff2");
      font-weight: 800;
      font-style: italic;
      font-display: swap;
    }

    @font-face {
      font-family: "gg-sans-Semibold";
      src: url("/assets/fonts/gg-sans-Semibold.woff2") format("woff2");
      font-weight: 600;
      font-style: normal;
      font-display: swap;
    }

    :root {
      --font: "Geogrotesque Wide", ui-sans-serif, system-ui, -apple-system,
        "SF Pro Display", "SF Pro Text",
        "Segoe UI Variable", "Segoe UI",
        Inter, Roboto, Arial, sans-serif;


      --headerBg: #1B1D28;
      --appBg: #1B1D28;
      --headerLine: #11131A;
      --headerHeight: 63px;
      --sidePanelBg: #1F2330;
      --leftSidePanelWidth: 240px;
      --rightSidePanelWidth: 248px;
      --leftSidePanelCollapsedWidth: 40px;
      --sideNavButtonHeight: 36px;
      --sideNavButtonRadius: 8px;
      --sideNavButtonPadY: 6px;
      --sideNavButtonPadX: 10px;

      --text: #eaf2ff;
      --muted: #B2B6C4;

      --border: rgba(255, 255, 255, .09);
      --shadow: 0 16px 38px rgba(0, 0, 0, .38);
      --radius: 8px;
      --siteRadius: 8px;

      --btn: rgba(255, 255, 255, .06);
      --btnHover: rgba(255, 255, 255, .11);
      --btnActive: rgba(255, 255, 255, .14);
      --btnBorder: rgba(255, 255, 255, .16);
      --btnBorderHover: rgba(255, 255, 255, .26);

      --bad: #ff4949;
      --good: #66FF45;

      --containerMax: 1920px;
      /*
        Whole-page width where the table area stops growing.
        Above this page width, only the background gap between sidebars and tables grows.
      */
      --tableStopViewportWidth: 1448px;
      /*
        Fixed board width target.
        This is always calculated from the normal open-left + open-right sidebar layout,
        so closing either sidebar does not make the tables expand wider.
      */
      --tableAreaFixedWidth: calc(var(--tableStopViewportWidth) - var(--leftSidePanelWidth) - var(--rightSidePanelWidth));
      --tableAreaMaxWidthAt1448: var(--tableAreaFixedWidth);
      --tableAreaWidthWhenSidebarClosed: var(--tableAreaFixedWidth);
      --pageSidePad: 6px;
      --rightSidebarAttachedPad: calc(var(--pageSidePad) + 18px);
      --leftSidebarAttachedPad: calc(var(--pageSidePad) + 18px);
      --lbCardBleed: 14px;

      --tableBg: rgba(255, 255, 255, .06);
      --tableRowHover: rgba(255, 255, 255, .07);
      --tableDivider: rgba(255, 255, 255, .10);
      --tableOuter: rgba(255, 255, 255, .12);
      --tableColDivider: rgba(215, 221, 232, .20);

      --tableOddRow: rgba(174, 193, 230, .040);
      --tableEvenRow: rgba(205, 219, 246, .085);
      --tableOddHover: rgba(205, 219, 246, .120);
      --tableEvenHover: rgba(226, 235, 252, .165);

      --gold: #ffe07a;
      --goldSoft: rgba(255, 224, 122, .24);
      --goldRow: rgba(255, 224, 122, .42);
      --goldRowHover: rgba(255, 224, 122, .56);
      --goldFrame: rgba(255, 224, 122, .48);

      --silver: #d7dde8;
      --silverSoft: rgba(215, 221, 232, .22);
      --silverRow: rgba(215, 221, 232, .38);
      --silverRowHover: rgba(215, 221, 232, .50);

      --bronze: #cd8b5a;
      --bronzeSoft: rgba(205, 139, 90, .24);
      --bronzeRow: rgba(205, 139, 90, .38);
      --bronzeRowHover: rgba(205, 139, 90, .50);

      --fontScale: 0.88;
      --tableScale: 0.82;

      --tableAreaMinHeight: 700px;
      --actionRowHeight: 46px;

      --tableHeadHeight: 46px;

    }

    * {
      box-sizing: border-box;
    }

    :root {
      --bottomPageAreaHeight: 448px;
      --topBoxToTableGap: 24px;
      --bottomPageAreaGap: calc(var(--topBoxToTableGap) * 3);
    }

    .globalBottomArea {
      width: 100vw;
      height: var(--bottomPageAreaHeight);
      min-height: var(--bottomPageAreaHeight);
      background: #141622;
      margin-top: var(--bottomPageAreaGap);
      margin-left: calc(50% - 50vw);
      margin-right: calc(50% - 50vw);
      flex: 0 0 auto;
      pointer-events: none;
    }

    .globalBottomAreaInner {
      width: calc(100% - var(--leftSidePanelWidth) - var(--rightSidePanelWidth));
      height: 100%;
      margin-left: var(--leftSidePanelWidth);
      margin-right: var(--rightSidePanelWidth);
      display: flex;
      justify-content: center;
      align-items: flex-start;
      transition: margin-left .18s ease, margin-right .18s ease, width .18s ease;
      pointer-events: none;
    }

    .globalBottomContent {
      width: 100%;
      max-width: var(--tableAreaFixedWidth);
      height: 100%;
      /*
        Keep the footer content aligned with the visible board/table edge.
        The page container has --pageSidePad, and the board shells add 18px
        of left/right padding before the actual table/top-box edge starts.
      */
      padding: 55px calc(var(--pageSidePad) + 18px);
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: flex-start;
      pointer-events: auto;
    }

    .globalBottomBrand {
      --globalBottomEventsTextOffsetY: -0.37px;
      display: inline-flex;
      align-items: center;
      gap: 4px;
      min-width: 0;
      transform: translateX(3.4px) translateY(-10px);
    }

    .globalBottomLogo {
      display: block;
      width: 200px;
      max-width: 200px;
      height: auto;
      margin: 0;
      object-fit: contain;
      user-select: none;
      -webkit-user-drag: none;
      flex: 0 0 auto;
    }

    .globalBottomEventsText {
      display: inline-block;
      transform: translateY(var(--globalBottomEventsTextOffsetY));
      pointer-events: none;
      user-select: none;
      white-space: nowrap;
      text-transform: uppercase;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: italic !important;
      font-size: calc(23px * 200 / 108);
      line-height: 1;
      letter-spacing: -0.02em;
      color: rgb(254, 161, 1);
      flex: 0 0 auto;
    }

    .globalBottomTextArea {
      font-size: 10px;
      line-height: 1.45;
      font-weight: 500;
      color: #B2B6C4;
      margin-top: 10px;
      margin-bottom: 16px;
      margin-left: 3.4px;
      max-width: 310px;
    }

    body.rightSidebarClosed .globalBottomAreaInner {
      width: calc(100% - var(--leftSidePanelWidth));
      margin-right: 0;
    }

    body.sidebarCollapsed .globalBottomAreaInner {
      width: calc(100% - var(--leftSidePanelCollapsedWidth) - var(--rightSidePanelWidth));
      margin-left: var(--leftSidePanelCollapsedWidth);
    }

    body.sidebarCollapsed.rightSidebarClosed .globalBottomAreaInner {
      width: calc(100% - var(--leftSidePanelCollapsedWidth));
      margin-right: 0;
    }

    @media (max-width: 980px) {
      .globalBottomAreaInner {
        width: calc(100% - var(--leftSidePanelWidth));
        margin-right: 0;
      }

      body.sidebarCollapsed .globalBottomAreaInner {
        width: calc(100% - var(--leftSidePanelCollapsedWidth));
        margin-right: 0;
      }
    }


    * {
      scrollbar-width: thin;
      scrollbar-width: 5px;
      scrollbar-color: rgba(203, 215, 255, .1) transparent;
    }

    *::-webkit-scrollbar {
      width: 5px;
      height: 5px;
    }

    *::-webkit-scrollbar-track {
      background: transparent;
    }

    *::-webkit-scrollbar-thumb {
      background: rgba(203, 215, 255, .1);
      border-radius: 999px;
    }

    *::-webkit-scrollbar-corner {
      background: transparent;
    }

    *,
    *::before,
    *::after {
      font-family: var(--font) !important;
    }

    html {
      font-size: calc(16px * var(--fontScale));
      scroll-behavior: auto;
      overscroll-behavior-x: none;
      overscroll-behavior-y: auto;
    }

    body {
      margin: 0;
      padding-top: var(--headerHeight);
      overscroll-behavior-x: none;
      overscroll-behavior-y: auto;
      font-family: var(--font);
      color: var(--text);
      background: var(--appBg);
      min-height: 100vh;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      font-size: 1rem;
      overflow-x: hidden;
    }

    button,
    input,
    select,
    textarea {
      font-family: inherit;
      font-size: inherit;
    }


    body.analyticsHowItWorksOpen,
    html.analyticsHowItWorksOpen {
      overflow: hidden !important;
      overscroll-behavior: none !important;
    }

    .siteHeader {
      width: 100%;
      background: var(--headerBg);
      border-bottom: 1px solid var(--headerLine);
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 10000;
    }

    .siteHeaderInner {
      width: 100%;
      height: var(--headerHeight);
      margin: 0 auto;
      padding: 0 12px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      position: relative;
    }

    .brand {
      --brandEventsTextOffsetY: -0.2px;
      display: flex;
      align-items: center;
      gap: 2px;
      min-width: 0;
      position: relative;
      z-index: 2;
      flex: 0 1 auto;
      margin-left: 12px;
    }

    .brandLogo {
      height: 32px;
      width: auto;
      display: block;
      object-fit: contain;
      user-select: none;
      -webkit-user-drag: none;
      flex: 0 0 auto;
    }

    .brandEventsText {
      position: static;
      transform: translateY(var(--brandEventsTextOffsetY));
      z-index: 4;
      pointer-events: none;
      user-select: none;
      white-space: nowrap;
      text-transform: uppercase;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: italic !important;
      font-size: 23px;
      line-height: 1;
      letter-spacing: -0.02em;
      color: rgb(254, 161, 1);
      flex: 0 0 auto;
    }

    .brandActions {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      flex: 0 0 auto;
    }

    .headerEmojiBtn {
      width: 46px;
      height: 40px;
      border-radius: 8px;
      border: none;
      outline: none;
      background: #21232F;
      color: #FFFFFF;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      user-select: none;
      transition: background .12s ease, filter .12s ease;
      flex: 0 0 auto;
      font-size: 25px;
      line-height: 1;
      padding: 0;
    }

    .headerEmojiBtn:hover {
      background: #252734;
      color: #FFFFFF;
      filter: brightness(1.03);
    }

    .headerEmojiBtn:active {
      background: #252734;
      color: #FFFFFF;
      transform: translateY(0);
    }

    .headerEmojiBtn:focus,
    .headerEmojiBtn:focus-visible {
      outline: none;
      box-shadow: none;
    }

    .headerEmojiBtn:disabled {
      opacity: 1;
      cursor: not-allowed;
      transform: none;
      filter: none;
      background: #21232F;
      color: #FFFFFF;
      box-shadow: none;
    }

    .headerEmojiBtn:disabled:hover {
      background: #21232F;
      color: #FFFFFF;
      transform: none;
      filter: none;
    }

    .headerEmojiBtn.headerPngBtn,
    .headerEmojiBtn.headerDownloadBtn {
      border: none;
      background: #21232F;
      color: #FFFFFF;
    }

    .headerEmojiBtn.headerPngBtn:hover,
    .headerEmojiBtn.headerDownloadBtn:hover {
      border: none;
      background: #252734;
      color: #FFFFFF;
    }




    .headerEmojiBtn.headerPngBtn#exportCurrentPngBtn {
      position: relative;
      overflow: visible;
    }

    .headerEmojiBtn.headerPngBtn#exportCurrentPngBtn .headerImportIconStack {
      overflow: visible;
    }

    .headerEmojiBtn.headerPngBtn#exportCurrentPngBtn.pngExportUnavailable {
      background: #1b1d27;
      color: #6f7485;
      cursor: not-allowed;
      filter: grayscale(.35);
    }

    .headerEmojiBtn.headerPngBtn#exportCurrentPngBtn.pngExportUnavailable:hover,
    .headerEmojiBtn.headerPngBtn#exportCurrentPngBtn.pngExportUnavailable:active {
      background: #1b1d27;
      color: #6f7485;
      filter: grayscale(.35);
    }

    .headerEmojiBtn.headerPngBtn {
      width: 40px;
      min-width: 40px;
      max-width: 40px;
      height: 40px;
      min-height: 40px;
      max-height: 40px;
      padding: 0;
      justify-content: center;
      gap: 0;
      border-radius: 8px;
    }

    .headerEmojiBtn.headerPngBtn .headerExportIcon {
      width: 24px;
      height: 24px;
    }


    .headerImportIconStack {
      position: relative;
      width: 24px;
      height: 24px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 24px;
      overflow: visible;
    }

    .headerImportIconStack .headerExportIcon {
      width: 24px;
      height: 24px;
    }

    .headerExportArrowSvg {
      width: 8px;
      height: 7px;
      display: block;
      fill: #B2B6C5;
      color: #B2B6C5;
      pointer-events: none;
      flex: 0 0 auto;
      transition: none;
      transform: none !important;
      opacity: 1;
    }

    .headerExportArrowSvg path {
      fill: #B2B6C5 !important;
    }

    .headerEmojiBtn.headerPngBtn:hover .headerExportArrowSvg,
    .headerEmojiBtn.headerPngBtn:active .headerExportArrowSvg,
    .headerEmojiBtn.headerPngBtn:disabled .headerExportArrowSvg,
    .headerEmojiBtn.headerPngBtn:disabled:hover .headerExportArrowSvg {
      fill: #B2B6C5;
      color: #B2B6C5;
      transform: none !important;
    }


    .headerRight {
      display: flex;
      align-items: center;
      gap: 10px;
      z-index: 2;
      min-width: 0;
    }

    .headerRight .headerEmojiBtn {
      margin-left: 2px;
    }

    .headerLoadWrap {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }

    .headerFileInput {
      position: absolute;
      left: -9999px;
      width: 1px;
      height: 1px;
      opacity: 0;
      pointer-events: none;
    }

    .btnSmall {
      height: 32px;
      padding: 7px 9px;
      border-radius: 11px;
      font-weight: 700;
      font-size: 11px;
      letter-spacing: .2px;
    }

    .headerPngBtn {
      border: none;
      outline: none;
      background: #21232F;
      color: #FFFFFF;
    }

    .headerPngBtn:hover {
      border: none;
      background: #252734;
      color: #FFFFFF;
    }

    .headerPngBtn:active {
      border: none;
      background: #252734;
      color: #FFFFFF;
    }



    .headerSlot:empty {
      display: none;
    }

    #openSettingsBtn,
    #openRightSidebarBtn {
      width: 40px;
      height: 40px;
      min-width: 40px;
      max-width: 40px;
      padding: 0;
      border-radius: 8px;
      flex: 0 0 40px;
    }

    @keyframes animation-1h5r8ub {
      from {
        opacity: 0;
        transform: translate3d(0, -4px, 0);
      }

      to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
      }
    }




    .headerDropdownBalanceHeader {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      color: rgb(177, 182, 198);
      font-size: 14px;
      font-family: "Geogrotesque Wide", sans-serif;
      font-weight: 500;
      font-style: normal;
      line-height: 1;
      padding: 0;
      margin: 0;
      flex: 0 0 auto;
      white-space: nowrap;
      pointer-events: none;
      user-select: none;
      margin-top: 4px;
      margin-bottom: 12px;
    }

    .headerDropdownBalanceTitle,
    .headerDropdownBalanceTotal {
      min-width: 0;
      color: rgb(177, 182, 198);
      font-size: 14px;
      font-weight: 500;
      line-height: 1;
    }

    .headerDropdownBalanceTotal {
      margin-left: auto;
      text-align: right;
    }

    .headerDropdownBalanceTotal span {
      margin-left: 4px;
      color: rgb(114, 242, 56);
    }




    .sportsSubmissionsAnswerExportMount {
      width: 100%;
      max-width: 100%;
      margin-top: 12px;
    }

    .sportsSubmissionsAnswerExportBox {
      width: calc((100% - 12px) / 3);
      min-width: 0;
      min-height: calc((var(--questionPageButtonHeight) * 3) - 32px);
      max-width: 100%;
      display: flex;
    }

    .sportsSubmissionsAnswerExportBox .questionExportCsvButton {
      width: 100%;
      min-width: 0;
      min-height: 100%;
    }

    .sportsSubmissionsAnswerExportBox .questionImportExportTitleGlyph,
    .eventSetupDailyStandingsExportBox .questionImportExportTitleGlyph {
      width: 23px;
      height: 23px;
      flex-basis: 23px;
    }

    .sportsSubmissionsAnswerExportBox .questionImportExportTitleGlyph svg,
    .eventSetupDailyStandingsExportBox .questionImportExportTitleGlyph svg {
      width: 23px;
      height: 23px;
    }

    .headerExportMenuBtn,
    .headerImportMenuBtn {
      width: 100%;
      min-height: 50px;
      border: none;
      outline: none;
      border-radius: 10px;
      background: rgba(15, 17, 26, 0.55);
      color: #B2B6C4;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 10px;
      padding: 12px 12px;
      cursor: pointer;
      font-weight: 700;
      font-size: 13px;
      letter-spacing: .1px;
      text-align: left;
      white-space: nowrap;
      transition: background .12s ease, color .12s ease, filter .12s ease;
    }

    .headerExportMenuBtn:hover,
    .headerExportMenuBtn:active,
    .headerImportMenuBtn:hover,
    .headerImportMenuBtn:active {
      background: rgba(203, 215, 255, 0.065);
      color: #FFFFFF;
      filter: none;
    }

    .headerExportMenuBtn:disabled,
    .headerImportMenuBtn:disabled {
      opacity: .45;
      cursor: not-allowed;
      filter: none;
      background: rgba(15, 17, 26, 0.36);
    }

    .headerExportMenuBtn:disabled:hover,
    .headerImportMenuBtn:disabled:hover {
      background: rgba(15, 17, 26, 0.36);
      color: #B2B6C4;
      filter: none;
    }

    .headerExportMenuIcon,
    .headerImportMenuIcon {
      width: 21px;
      height: 21px;
      display: block;
      fill: currentColor;
      color: currentColor;
      flex: 0 0 auto;
      pointer-events: none;
    }

    .headerImportMenuBtn.loadedImport {
      color: #B2B6C4;
      background: rgba(15, 17, 26, 0.55);
      justify-content: space-between;
      padding-right: 9px;
    }

    .headerImportMenuBtn.loadedImport:hover,
    .headerImportMenuBtn.loadedImport:active {
      color: #FFFFFF;
      background: rgba(203, 215, 255, 0.065);
    }

    .headerImportMenuBtn.removedFeedback {
      color: #FFFFFF;
      background: rgba(255, 73, 73, 0.10);
      justify-content: flex-start;
    }

    .headerImportMenuBtn.removedFeedback:hover,
    .headerImportMenuBtn.removedFeedback:active {
      color: #FFFFFF;
      background: rgba(255, 73, 73, 0.12);
    }

    .headerImportMenuIcon.loaded {
      width: 18px;
      height: 18px;
      fill: currentColor;
      color: currentColor;
    }

    .loadedImportReadyContent,
    .loadedImportRemoveContent {
      display: inline-flex;
      align-items: center;
      min-width: 0;
    }

    .loadedImportReadyContent {
      gap: 10px;
      flex: 1 1 auto;
      overflow: hidden;
    }

    .loadedImportReadyContent span {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .loadedImportRemoveContent {
      flex: 0 0 auto;
      width: 30px;
      height: 30px;
      justify-content: center;
      margin-left: 8px;
      border-radius: 999px;
      color: #B2B6C4;
      background: transparent;
      cursor: pointer;
      pointer-events: auto;
    }

    .loadedImportRemoveContent:hover,
    .loadedImportRemoveContent:active {
      color: #FFFFFF;
    }

    .loadedImportRemoveContent span {
      display: none;
    }

    .headerImportMenuIcon.remove,
    .headerImportMenuIcon.removed,
    .loadedImportRemoveContent .headerImportMenuIcon {
      width: 24px;
      min-width: 24px;
      height: auto;
      margin-left: 0;
      padding: 3px;
      fill: currentColor;
      stroke: none;
      color: currentColor;
    }


    .headerImportMenuItem .headerImportMenuBtn {
      flex: 1 1 auto;
      min-width: 0;
    }

    .headerImportClearBtn {
      width: 30px;
      height: 30px;
      border: none;
      outline: none;
      border-radius: 999px;
      background: transparent;
      color: var(--bad);
      display: none;
      align-items: center;
      justify-content: center;
      padding: 0;
      cursor: pointer;
      flex: 0 0 auto;
      transition: color .12s ease, filter .12s ease;
    }

    .headerImportClearBtn.visible {
      display: inline-flex;
    }

    .headerImportClearBtn:hover,
    .headerImportClearBtn:active {
      background: transparent;
      color: #ff7c88;
      filter: brightness(1.05);
    }

    .headerImportClearIcon {
      width: 18px;
      height: 18px;
      display: block;
      fill: currentColor;
      pointer-events: none;
    }


    .headerSlot {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 168px;
      height: 34px;
      flex: 0 0 168px;
    }

    .headerSlot .btnSmall,
    .headerSlot .statusBtn {
      width: 100%;
      justify-content: center;
      height: 34px;
      padding: 8px 10px;
      line-height: 1;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }

    .statusBtn {
      width: 100%;
      height: 34px;
      border-radius: 12px;
      border: 1px solid rgba(255, 255, 255, .16);
      background: rgba(255, 255, 255, .06);
      color: rgb(255, 255, 255);
      display: inline-flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      padding: 0 10px;
      cursor: pointer;
      user-select: none;
      font-weight: 700;
      font-size: 11px;
      letter-spacing: .2px;
      line-height: 1;
      transition: background .12s ease, border-color .12s ease, filter .12s ease;
    }

    .statusBtn:hover {
      background: rgba(255, 255, 255, .10);
      border-color: rgba(255, 255, 255, .26);
      filter: brightness(1.02);
    }

    .statusBtn.ok {
      border-color: rgba(102, 255, 69, .38);
      background: rgba(102, 255, 69, .12);
    }

    .statusLeft {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
    }

    .statusDot {
      width: 8px;
      height: 8px;
      border-radius: 99px;
      background: rgba(255, 255, 255, .30);
      box-shadow: 0 1px 0 rgba(0, 0, 0, .25);
      flex: 0 0 auto;
    }

    .statusBtn.ok .statusDot {
      background: rgba(102, 255, 69, .95);
    }

    .statusText {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      line-height: 1;
    }

    .statusClear {
      width: 22px;
      height: 22px;
      border-radius: 999px;
      border: 1px solid rgba(255, 255, 255, .18);
      background: rgba(0, 0, 0, .18);
      color: rgb(255, 255, 255);
      font-weight: 700;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      line-height: 1;
      padding: 0;
      transition: filter .12s ease, background .12s ease, border-color .12s ease;
      flex: 0 0 auto;
    }

    .statusClear:hover {
      filter: brightness(1.08);
      background: rgba(0, 0, 0, .26);
      border-color: rgba(255, 255, 255, .26);
    }

    .iconBtn {
      width: 0px;
      height: 34px;
      border-radius: 12px;
      border: 1px solid rgba(255, 255, 255, .16);
      background: rgba(255, 255, 255, .06);
      color: rgb(255, 255, 255);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      user-select: none;
      transition: background .12s ease, border-color .12s ease, filter .12s ease;
      flex: 0 0 auto;
      font-weight: 700;
    }

    .iconBtn:hover {
      background: rgba(255, 255, 255, .10);
      border-color: rgba(255, 255, 255, .26);
      filter: brightness(1.03);
    }

    .iconBtn:active {
      background: rgba(255, 255, 255, .12);
    }

    .settingsCogIcon {
      width: 18px;
      height: 18px;
      display: block;
      opacity: .96;
      fill: currentColor;
      flex: 0 0 auto;
      pointer-events: none;
    }

    .headerExportIcon {
      width: 24px;
      height: 24px;
      display: block;
      color: currentColor;
      flex: 0 0 auto;
      pointer-events: none;
    }


    .headerRandomDiceIcon {
      width: 32.2px;
      height: 24.15px;
      display: block;
      color: currentColor;
      fill: currentColor;
      flex: 0 0 auto;
      pointer-events: none;
    }

    .headerRandomDiceIcon .diceVisible {
      fill: currentColor;
    }

    .headerRandomDiceIcon .diceCutout {
      fill: #21232F;
    }

    .headerImportStatusIcon {
      width: 13.2px;
      height: 13.2px;
      display: block;
      flex: 0 0 auto;
      pointer-events: none;
      color: var(--bad);
      fill: currentColor;
      transform: none;
      filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .45));
    }

    .headerImportStatusIcon.ok {
      width: 12.6px;
      height: 12.6px;
      color: rgb(20, 23, 34);
      fill: none;
      stroke: currentColor;
      filter: none;
      position: relative;
      z-index: 2;
    }

    .headerImportStatusIcon.ok path {
      fill: none !important;
      stroke: currentColor !important;
      stroke-width: 3.45;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .headerImportStatusIcon.warn {
      width: 13.2px;
      height: 13.2px;
      color: #ff4949;
      fill: currentColor;
      filter: none;
      position: relative;
      z-index: 2;
    }

    .headerImportStatusIcon.warn .warningInner {
      fill: rgb(20, 23, 34) !important;
    }

    .headerImportStatusIcon path,
    .headerImportStatusIcon g {
      fill: currentColor !important;
    }

    .headerImportStatusWrap {
      position: absolute;
      right: -11px;
      top: -10px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 auto;
      overflow: visible;
      z-index: 2;
    }

    .headerImportStatusWrap.importStatusOk,
    .headerImportStatusWrap.importStatusWarn,
    .headerImportStatusWrap.importStatusLoading {
      width: 20.4px;
      height: 20.4px;
      border-radius: 999px;
      color: rgb(20, 23, 34);
      border: 2px solid rgb(39, 43, 56);
      overflow: visible;
      isolation: isolate;
    }

    .headerImportStatusWrap.importStatusOk {
      background: rgb(114, 242, 56);
      box-shadow: rgba(114, 242, 56, 0.4) 0px 0px 10px 0px;
    }

    .headerImportStatusWrap.importStatusWarn {
      background: #ff4949;
      box-shadow: rgba(255, 73, 73, 0.4) 0px 0px 10px 0px;
    }

    .headerImportStatusWrap.importStatusLoading {
      background: rgb(39, 43, 56);
      box-shadow: rgba(255, 255, 255, 0.16) 0px 0px 10px 0px;
    }

    .headerImportStatusLoadingImg {
      width: 20.4px;
      height: 20.4px;
      display: block;
      border-radius: 999px;
      object-fit: contain;
      animation: headerImportStatusLoadingSpin .85s linear infinite;
      pointer-events: none;
      user-select: none;
      -webkit-user-drag: none;
    }

    @keyframes headerImportStatusLoadingSpin {
      from { transform: rotate(0deg); }
      to { transform: rotate(360deg); }
    }

    .headerImportStatusWrap::after {
      content: attr(data-import-tooltip);
      position: absolute;
      left: 50%;
      top: calc(100% + 21px);
      transform: translateX(-50%) translateY(-4px);
      width: max-content;
      max-width: min(600px, calc(100vw - 26px));
      padding: 16px 20px 18px;
      border-radius: 10px;
      border: none;
      background: #2A2D3A;
      color: #FFFFFF;
      box-shadow: 0 14px 30px rgba(0, 0, 0, .30);
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      z-index: 2147483647;
      text-align: center;
      white-space: normal;
      line-height: 1.55;
      font-weight: 500;
      font-size: 16px;
      letter-spacing: .01em;
      transition: opacity .12s ease, visibility .12s ease, transform .12s ease;
    }

    .headerImportStatusWrap::before {
      content: "";
      position: absolute;
      left: 50%;
      top: calc(100% + 2px);
      transform: translateX(-50%) translateY(-4px);
      width: 0;
      height: 0;
      border-left: 18px solid transparent;
      border-right: 18px solid transparent;
      border-bottom: 19px solid #2A2D3A;
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      z-index: 2147483647;
      transition: opacity .12s ease, visibility .12s ease, transform .12s ease;
    }

    .headerImportStatusWrap:hover::after,
    .headerImportStatusWrap:hover::before,
    .headerImportStatusWrap:focus-within::after,
    .headerImportStatusWrap:focus-within::before {
      opacity: 1;
      visibility: visible;
      transform: translateX(-50%) translateY(0);
    }


    #exportCurrentPngBtn .headerImportStatusWrap::after {
      left: auto;
      right: -7px;
      transform: translateY(-4px);
      max-width: min(420px, calc(100vw - 28px));
      text-align: right;
    }

    #exportCurrentPngBtn .headerImportStatusWrap::before {
      left: auto;
      right: -2px;
      transform: translateY(-4px);
    }

    #exportCurrentPngBtn .headerImportStatusWrap:hover::after,
    #exportCurrentPngBtn .headerImportStatusWrap:hover::before,
    #exportCurrentPngBtn .headerImportStatusWrap:focus-within::after,
    #exportCurrentPngBtn .headerImportStatusWrap:focus-within::before {
      transform: translateY(0);
    }


    .modalTitle .settingsCogIcon {
      width: 18px;
      height: 18px;
      color: var(--gold);
      opacity: 1;
    }

    .contentArea {
      min-width: 0;
      background: var(--appBg);
      padding-top: 18px;
      margin-left: var(--leftSidePanelWidth);
      margin-right: var(--rightSidePanelWidth);
      width: calc(100% - var(--leftSidePanelWidth) - var(--rightSidePanelWidth));
      overflow-x: auto;
      overflow-y: visible;
      overscroll-behavior-x: contain;
      transition: margin-left .18s ease, margin-right .18s ease, width .18s ease;
    }

    .leftSidePanel,
    .rightSidePanel {
      position: fixed;
      top: calc(var(--headerHeight) + 1px);
      left: 0;
      bottom: 0;
      background: var(--sidePanelBg);
      border-right: none;
      z-index: 20;
      overflow-y: auto;
      transition: width .18s ease;
    }

    .leftSidePanel {
      width: var(--leftSidePanelWidth);
    }

    .rightSidePanel {
      width: var(--rightSidePanelWidth);
    }

    .rightSidePanel {
      left: auto;
      right: 0;
      border-right: none;
      border-left: none;
      overflow: hidden;
    }

    .rightSidePanelInner {
      height: 100%;
      padding: 18px 8.4px;
      position: relative;
      --rightSidebarChatTop: 115.5px;
      --rightSidebarComposerHeight: 83.2px;
    }

    .rightSidebarPlaceholderStack {
      position: absolute;
      left: 8.4px;
      right: 5px;
      top: calc(var(--rightSidebarChatTop) - 16px);
      bottom: calc(var(--rightSidebarComposerHeight) + 32px);
      display: flex;
      flex-direction: column;
      gap: 6.15px;
      pointer-events: auto;
      overflow-x: hidden;
      overflow-y: auto;
      padding-right: 3.4px;
      scrollbar-width: thin;
      scrollbar-width: 5px;
      scrollbar-color: rgba(203, 215, 255, .1) transparent;
      background: transparent;
      overscroll-behavior: contain;
    }

    .rightSidebarPlaceholderStack::before {
      content: "";
      display: block;
      flex: 1 1 auto;
      min-height: 0;
    }

    .rightSidebarPlaceholderStack::-webkit-scrollbar {
      width: 5px;
      height: 5px;
    }

    .rightSidebarPlaceholderStack::-webkit-scrollbar-track {
      background: transparent;
    }

    .rightSidebarPlaceholderStack::-webkit-scrollbar-thumb {
      background: rgba(203, 215, 255, .1);
      border-radius: 999px;
    }

    .rightSidebarPlaceholderStack::-webkit-scrollbar-corner {
      background: transparent;
    }

    .rightSidebarPlaceholderRect {
      width: 100%;
      height: var(--sideNavButtonHeight);
      min-height: var(--sideNavButtonHeight);
      border-radius: var(--siteRadius);
      background: #252935;
      border: none;
      opacity: 1;
    }

    .rightSidebarMessageCard {
      width: 100%;
      min-height: var(--sideNavButtonHeight);
      height: auto;
      border-radius: var(--siteRadius);
      background: #252935;
      border: none;
      display: block;
      padding: 9px 9px;
      overflow: hidden;
      pointer-events: auto;
      user-select: text;
      -webkit-user-select: text;
      flex: 0 0 auto;
    }

    .rightSidebarMessageAvatar {
      width: 17px;
      height: 17px;
      border-radius: 4px;
      object-fit: contain;
      display: block;
      float: left;
      margin: 2.5px 7px 0 0;
      user-select: none;
      -webkit-user-drag: none;
    }

    .rightSidebarMessageText {
      min-width: 0;
      display: block;
      white-space: normal;
      overflow: visible;
      text-overflow: clip;
      line-height: 1.5;
      font-size: 13px;
      letter-spacing: 0.01em;
      overflow-wrap: anywhere;
      word-break: break-word;
      user-select: text;
      -webkit-user-select: text;
    }

    .rightSidebarMessageUser {
      color: #FFFFFF;
      font-size: 13px;
      font-weight: 600;
      white-space: nowrap;
      line-height: inherit;
    }

    .rightSidebarMessageBody {
      color: #B2B6C4;
      font-size: 13px;
      font-weight: 500;
      white-space: normal;
      overflow: visible;
      text-overflow: clip;
      min-width: 0;
      line-height: inherit;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    .rightSidebarChatComposer {
      position: absolute;
      left: 50%;
      bottom: 16px;
      width: 216px;
      transform: translateX(-50%);
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 12px;
      pointer-events: auto;
      overflow: visible;
      z-index: 4;
    }

    .rightSidebarChatInputLabel {
      cursor: text;
      margin: 0 auto;
      width: 216px;
      min-width: 216px;
      max-width: 216px;
      display: block;
      pointer-events: auto;
      overflow: visible;
      align-self: center;
    }

    .rightSidebarChatInputBox {
      display: flex;
      -webkit-box-align: start;
      align-items: flex-start;
      min-height: 40px;
      height: var(--chatInputHeight, 40px);
      max-height: none;
      width: 216px;
      min-width: 216px;
      max-width: 216px;
      padding: 9px 10px 9px 15px;
      border-radius: 6px;
      border: 1px solid transparent;
      background: rgba(15, 17, 26, 0.55);
      transition: background 0.1s, border-color 0.1s, box-shadow 0.1s;
      position: relative;
      overflow: visible;
      box-sizing: border-box;
    }

    .rightSidebarChatInputBox:focus-within {
      border: 1px solid rgb(255, 255, 193);
      box-shadow: rgb(255, 252, 57) 0px 0px 1px inset, rgb(255, 93, 0) 0px 0px 4px;
    }

    .rightSidebarChatInputBox .rollbit-chat-input {
      width: 189px;
      height: auto;
      min-width: 189px;
      max-width: 189px;
      min-height: 20px;
      max-height: none;
      font-family: "Geogrotesque Wide", sans-serif;
      font-weight: 500;
      font-style: normal;
      font-size: 14px;
      overflow: visible;
    }

    .rightSidebarChatInputBox .rollbit-chat-input--multiLine {
      position: relative;
      overflow-y: visible;
    }

    .rightSidebarChatInputBox .rollbit-chat-input__control {
      position: relative;
      width: 189px;
      height: var(--chatTextHeight, 20px);
      min-height: 20px;
      max-height: none;
      overflow: visible;
    }

    .rightSidebarChatInputBox .rollbit-chat-input__highlighter {
      position: relative;
      box-sizing: border-box;
      width: 189px;
      height: var(--chatTextHeight, 20px);
      min-height: 20px;
      max-height: none;
      color: transparent;
      overflow: hidden;
      white-space: pre-wrap;
      overflow-wrap: break-word;
      border: 1px solid transparent;
      text-align: start;
      line-height: 20px;
    }

    .rightSidebarChatInputBox .rollbit-chat-input__input {
      display: block;
      width: 100%;
      position: absolute;
      margin: 0;
      top: 0;
      left: 0;
      box-sizing: border-box;
      background-color: transparent;
      font-family: inherit;
      font-size: inherit;
      font-weight: inherit;
      letter-spacing: inherit;
      color: #FFFFFF;
      height: var(--chatTextHeight, 20px);
      min-height: 20px;
      max-height: none;
      bottom: auto;
      overflow: hidden;
      resize: none;
      border: 1px solid transparent;
      outline: none;
      padding: 0;
      line-height: 20px;
      white-space: pre-wrap;
      overflow-wrap: break-word;
    }

    .rightSidebarChatInputBox .rollbit-chat-input__input::placeholder {
      color: #696B73;
      opacity: 1;
    }

    .rightSidebarChatFooter {
      width: 216px;
      display: flex;
      -webkit-box-align: center;
      align-items: center;
      justify-content: flex-end;
      padding-top: 0;
    }

    .rightSidebarChatCount {
      margin-right: 12px;
      font-size: 12px;
      font-weight: 600;
      line-height: 1;
      color: #B2B6C4;
      font-variant-numeric: tabular-nums;
    }

    .rightSidebarSendBtn:disabled {
      opacity: 0.5;
      cursor: default;
    }

    .rightSidebarSendBtn {
      display: inline-flex;
      -webkit-box-align: center;
      align-items: center;
      -webkit-box-pack: center;
      justify-content: center;
      white-space: nowrap;
      transition: 0.1s;
      appearance: none;
      border-width: medium;
      border-style: none;
      border-color: currentcolor;
      border-image: initial;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      cursor: pointer;
      user-select: none;
      height: 24px;
      padding: 0px 8px;
      border-radius: 4px;
      font-family: "Geogrotesque Wide", sans-serif;
      font-weight: 600;
      font-style: normal;
      font-size: 12px;
      color: rgb(20, 23, 34);
      background: rgb(134, 244, 84);
      box-shadow: rgba(118, 255, 25, 0.4) 0px 0px 10px, rgba(255, 255, 255, 0.2) 0px 1px 0px inset, rgba(0, 0, 0, 0.15) 0px -3px 0px inset, rgb(59, 198, 14) 0px 0px 8px inset;
    }

    .rightSidebarSendBtn:disabled:hover,
    .rightSidebarSendBtn:disabled:active {
      transform: none;
      filter: none;
    }

    .rightSidebarTopMessageCard {
      position: absolute;
      left: 8px;
      right: 8px;
      top: 44px;
      min-height: var(--sideNavButtonHeight);
      border-radius: 10px;
      background: #5963E1;
      border: none;
      color: #FFFFFF;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      padding: 10px 12px;
      overflow: hidden;
      pointer-events: auto;
    }

    .rightSidebarTopMessageText {
      min-width: 0;
      color: #FFFFFF;
      font-size: 13.5px;
      font-weight: 600;
      line-height: 1.3;
      letter-spacing: -0.01em;
      white-space: normal;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    .rightSidebarTopMessageLink {
      color: #FFFFFF;
      text-decoration: underline;
      text-decoration-thickness: 1px;
      text-underline-offset: 2px;
      pointer-events: auto;
    }

    .rightSidebarTopMessageLink:hover {
      color: #FFFFFF;
      filter: brightness(1.08);
    }

    .rightSidebarTopMessageX {
      color: #FFFFFF;
      line-height: 1;
      flex: 0 0 18px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 18px;
      height: 18px;
      transform: translateX(0.5px);
      pointer-events: none;
      user-select: none;
      -webkit-user-select: none;
    }

    .rightSidebarTopMessageIcon {
      width: 18px;
      height: 18px;
      display: block;
      fill: currentColor;
      pointer-events: none;
      flex: 0 0 auto;
    }

    .rightSidebarCloseBtn {
      width: 32px;
      height: 32px;
      border: none;
      outline: none;
      border-radius: 0;
      background: transparent;
      color: #878DA4;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0;
      cursor: pointer;
      position: absolute;
      top: 9px;
      right: 4px;
      transition: color .12s ease;
    }

    .rightSidebarCloseBtn:hover,
    .rightSidebarCloseBtn:active {
      background: transparent;
      color: #B1B5C3;
      filter: none;
      transform: none;
    }

    .rightSidebarCloseBtn:focus,
    .rightSidebarCloseBtn:focus-visible {
      outline: none;
      box-shadow: none;
    }

    .rightSidebarCloseIcon {
      width: 20px;
      height: 20px;
      display: block;
      fill: currentColor;
      pointer-events: none;
      flex: 0 0 auto;
    }

    .rightSidebarOpenIcon {
      width: 20px;
      height: 20px;
      display: block;
      fill: currentColor;
      pointer-events: none;
      flex: 0 0 auto;
    }

    #openRightSidebarBtn {
      display: none;
    }

    body.rightSidebarClosed .rightSidePanel {
      display: none;
    }

    body.rightSidebarClosed #openRightSidebarBtn {
      display: inline-flex;
    }

    body.rightSidebarClosed .contentArea {
      margin-right: 0;
      width: calc(100% - var(--leftSidePanelWidth));
    }

    body.sidebarCollapsed.rightSidebarClosed .contentArea {
      margin-right: 0;
      width: calc(100% - var(--leftSidePanelCollapsedWidth));
    }

    body.sidebarCollapsed .leftSidePanel {
      width: var(--leftSidePanelCollapsedWidth);
    }

    body.sidebarCollapsed .contentArea {
      margin-left: var(--leftSidePanelCollapsedWidth);
      margin-right: var(--rightSidePanelWidth);
      width: calc(100% - var(--leftSidePanelCollapsedWidth) - var(--rightSidePanelWidth));
    }

    @media (max-width: 980px) {
      .rightSidePanel {
        display: none;
      }

      .contentArea {
        margin-right: 0;
        width: calc(100% - var(--leftSidePanelWidth));
      }

      body.sidebarCollapsed .contentArea {
        margin-right: 0;
        width: calc(100% - var(--leftSidePanelCollapsedWidth));
      }
    }

    
    .sidebarSectionTitle {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 12px 0px 4px 3.6px;
      margin-left: 0.4px;
      text-transform: uppercase;
      color: rgb(103, 109, 124);
      font-family: "Geogrotesque Wide", sans-serif;
      font-weight: 600;
      font-style: normal;
      font-size: 12px;
      line-height: 1;
      user-select: text;
      -webkit-user-select: text;
      flex: 0 0 auto;
    }



    /* Only the left sidebar section headings should be selectable/highlightable. */
    .leftSidePanel .sideNavBtn,
    .leftSidePanel .sideNavSubBtn,
    .leftSidePanel .moreSideNavLink,
    .leftSidePanel .sidebarToggleBtn,
    .leftSidePanel .sideNavLabelWrap,
    .leftSidePanel .sideNavText,
    .leftSidePanel .sideNavSubBtnText,
    .leftSidePanel .sideNavGlyph,
    .leftSidePanel .sideNavArrowBox {
      user-select: none;
      -webkit-user-select: none;
    }

    .leftSidePanel .sidebarSectionTitle {
      user-select: text;
      -webkit-user-select: text;
    }

    body.sidebarCollapsed .sidebarSectionTitle {
      display: none;
    }

.leftSidePanelInner {
      min-height: 100%;
      height: auto;
      padding: 18px 8px;
      display: flex;
      flex-direction: column;
      gap: 5.4px;
    }

    .sidebarSectionTitle.sportsSidebarTitle {
      padding-top: 0;
      padding-bottom: 4px;
      margin-top: 13px;
    }

    .sidebarSectionTitle.moreSidebarTitle {
      padding-top: 0;
      padding-bottom: 4px;
      margin-top: 13px;
    }

    .moreSideNavLink {
      text-decoration: none;
    }

    .sideNavGlyph.rewindGlyph svg,
    .sideNavGlyph.sheetsGlyph svg {
      width: 86%;
      height: 86%;
    }

    body.sidebarCollapsed .sideNavGlyph.rewindGlyph svg,
    body.sidebarCollapsed .sideNavGlyph.sheetsGlyph svg {
      width: 86%;
      height: 86%;
    }

    .sideNavFooter {
      margin-top: auto;
      display: flex;
      justify-content: flex-end;
      padding-top: 4px;
      padding-right: 3.5px;
    }

    .sidebarToggleBtn {
      display: inline-flex;
      -webkit-box-align: center;
      align-items: center;
      -webkit-box-pack: center;
      justify-content: center;
      white-space: nowrap;
      transition: 0.1s;
      appearance: none;
      border-width: medium;
      border-style: none;
      border-color: currentcolor;
      border-image: initial;
      letter-spacing: 0.5px;
      cursor: pointer;
      user-select: none;
      width: 32px;
      min-width: 32px;
      max-width: 32px;
      height: 30px;
      min-height: 30px;
      max-height: 30px;
      padding: 0px;
      border-radius: 6px;
      font-family: "Geogrotesque Wide", sans-serif;
      font-weight: 700;
      font-style: normal;
      font-size: 13px;
      text-transform: uppercase;
      color: rgb(255, 255, 255);
      background: rgba(203, 215, 255, 0.03);
      flex: 0 0 32px;
    }

    .sidebarToggleBtn:not(:disabled):hover {
      background: rgba(203, 215, 255, 0.055);
      color: rgb(255, 255, 255);
    }

    .sidebarToggleBtn:active {
      background: rgba(203, 215, 255, 0.055);
      transform: none;
      filter: none;
    }

    .sidebarToggleIcon {
      width: 18px;
      min-width: 18px;
      height: auto;
      display: block;
      fill: #868da6;
      color: #868da6;
      transition: none !important;
      pointer-events: none;
      flex: 0 0 18px;
    }

    .sidebarToggleIcon path {
      fill: currentColor;
    }

    body.sidebarCollapsed .sidebarToggleIcon {
      transform: rotate(180deg);
    }

    body.sidebarCollapsed .leftSidePanelInner {
      padding-left: 6px;
      padding-right: 6px;
    }

    body.sidebarCollapsed .sideNavBtn {
      height: var(--sideNavButtonHeight);
      min-height: var(--sideNavButtonHeight);
      justify-content: center;
      align-items: center;
      padding: var(--sideNavButtonPadY) 0;
      border-radius: var(--sideNavButtonRadius);
    }

    body.sidebarCollapsed .sideNavLabelWrap {
      width: 100%;
      flex: 0 0 auto;
      justify-content: center;
      align-items: center;
      gap: 0;
    }

    body.sidebarCollapsed .sideNavText,
    body.sidebarCollapsed .sideNavArrowBox {
      display: none;
    }

    body.sidebarCollapsed .sideNavGlyph {
      width: 20px;
      height: 20px;
      font-size: 16px;
      transform: none;
      margin: 0;
    }

    body.sidebarCollapsed .sideNavGlyph svg {
      width: 100%;
      height: 100%;
    }

    body.sidebarCollapsed .sideNavGlyph.questionGlyph svg,
    body.sidebarCollapsed .sideNavGlyph.questionNumberGlyph svg {
      width: 99%;
      height: 99%;
    }

    body.sidebarCollapsed .sideNavGlyph.leaderboardGlyph svg,
    body.sidebarCollapsed .sideNavGlyph.resultsGlyph svg,
    body.sidebarCollapsed .sideNavGlyph.analyticsGlyph svg {
      width: 86%;
      height: 86%;
    }

    body.sidebarCollapsed .sideNavGlyph.submissionsGlyph svg {
      width: 110%;
      height: 110%;
    }

    body.sidebarCollapsed .sideNavGlyph.prizesGlyph {
      padding-top: 1px;
      padding-bottom: 0.9px;
    }

    body.sidebarCollapsed .sideNavGlyph.prizesGlyph svg {
      width: 82%;
      height: 82%;
    }

    body.sidebarCollapsed .sideNavGlyph.exportGlyph svg {
      width: 86%;
      height: 86%;
    }

    body.sidebarCollapsed .sideNavSubGroup {
      display: none !important;
    }

    body.sidebarCollapsed .sideNavFooter {
      order: -1;
      margin-top: 0;
      justify-content: center;
      padding-top: 0;
      padding-bottom: 4px;
    }

    body.sidebarCollapsed .sidebarToggleBtn {
      width: 32px;
      min-width: 32px;
      max-width: 32px;
      height: 30px;
      min-height: 30px;
      max-height: 30px;
      border-radius: 6px;
      flex-basis: 32px;
    }

    body.sidebarCollapsed .sidebarToggleIcon {
      width: 18px;
      min-width: 18px;
      height: auto;
    }

    .sideNavGroup {
      display: flex;
      flex-direction: column;
      gap: 0;
    }

    .sideNavSubGroup {
      display: none;
      flex-direction: column;
      gap: 0;
      margin-top: 0;
      margin-bottom: 13px;
      width: 100%;
    }

    #sidebarResultsSubGroup {
      margin-bottom: 0;
    }

    .sideNavSubGroup.open {
      display: flex;
    }

    .sideNavSubBtn {
      width: 100%;
      min-width: 0;
      height: var(--sideNavButtonHeight);
      min-height: var(--sideNavButtonHeight);
      border: 0;
      border-radius: var(--sideNavButtonRadius);
      background: transparent;
      color: #B2B6C4;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 12px;
      padding: var(--sideNavButtonPadY) var(--sideNavButtonPadX);
      cursor: pointer;
      text-align: left;
      transition: background .12s ease, color .12s ease;
    }

    .sideNavSubBtn:hover {
      background: #252935;
      color: #FFFFFF;
    }

    .sideNavSubBtn:active {
      transform: none;
    }

    .sideNavSubBtn.active {
      background: #252935;
      color: #ffffc1;
    }

    .sideNavSubBtn.active .sideNavGlyph::before {
      opacity: 1;
      transform: translate(-50%, -50%) scale(.9);
      filter: blur(7px);
    }

    .sideNavSubBtnText {
      min-width: 0;
      font-size: clamp(14px, 1vw, 20px);
      line-height: 1.08;
      font-weight: 500;
      letter-spacing: -.03em;
      color: currentColor;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      transition: text-shadow .16s ease, filter .16s ease;
    }

    .sideNavText,
    .sideNavSubBtnText {
      position: relative;
      display: inline-block;
      overflow: visible;
      isolation: isolate;
    }

    .sideNavText::before,
    .sideNavText::after,
    .sideNavSubBtnText::before,
    .sideNavSubBtnText::after {
      content: attr(data-text);
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      white-space: nowrap;
      pointer-events: none;
      user-select: none;
      color: transparent;
      opacity: 0;
      transition: opacity .16s ease, filter .16s ease, transform .16s ease;
      z-index: -1;
    }

    .sideNavText::before,
    .sideNavSubBtnText::before {
      text-shadow:
        0 0 2.4px rgba(235, 95, 25, .72),
        0 0 4.8px rgba(195, 65, 18, .50),
        0 0 7.8px rgba(140, 45, 12, .25);
      filter: blur(1.2px);
    }

    .sideNavText::after,
    .sideNavSubBtnText::after {
      text-shadow:
        0 0 3.4px rgba(195, 65, 18, .39),
        0 0 6.8px rgba(140, 45, 12, .27),
        0 0 10px rgba(90, 28, 8, .16);
      filter: blur(2.2px);
      transform: translate(-50%, -50%) scale(1.005, 1.014);
    }

    .sideNavBtn.active .sideNavText,
    .sideNavSubBtn.active .sideNavSubBtnText {
      text-shadow: 0 0 1px rgba(255, 247, 210, .16);
      filter: none;
    }

    .sideNavBtn.active .sideNavText::before,
    .sideNavSubBtn.active .sideNavSubBtnText::before {
      opacity: .86;
      filter: blur(1.45px);
      transform: translate(-50%, -50%) scale(1.000, 1.006);
    }

    .sideNavBtn.active .sideNavText::after,
    .sideNavSubBtn.active .sideNavSubBtnText::after {
      opacity: .76;
      filter: blur(3.2px);
      transform: translate(-50%, -50%) scale(1.010, 1.020);
    }

    .sideNavBtn {
      width: 100%;
      min-width: 0;
      height: var(--sideNavButtonHeight);
      min-height: var(--sideNavButtonHeight);
      border: 0;
      border-radius: var(--sideNavButtonRadius);
      background: transparent;
      color: #B2B6C4;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      padding: var(--sideNavButtonPadY) var(--sideNavButtonPadX);
      cursor: pointer;
      text-align: left;
      transition: background .12s ease, color .12s ease;
      transform: none;
    }

    .sideNavBtn:hover {
      background: rgba(203, 215, 255, 0.03);
      color: #B2B6C4;
      transform: none;
    }

    .sideNavBtn:active {
      transform: none;
    }

    .sideNavBtn.active {
      background: #252935;
      color: #B2B6C4;
      transform: none;
    }

    .sideNavLabelWrap {
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 12px;
      flex: 1 1 auto;
    }

    .sideNavText,
    .sideNavSubBtnText {
      transform: translateX(-4px);
    }

    .sideNavGlyph {
      width: 20px;
      height: 20px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #B2B6C4;
      font-size: 16px;
      font-weight: 700;
      flex: 0 0 auto;
      position: relative;
      isolation: isolate;
      overflow: visible;
      transition: color .12s ease;
      transform: translateX(-2px);
    }


    .sideNavGlyph::before {
      content: "";
      position: absolute;
      left: 45%;
      top: 50%;
      width: 146%;
      /* minimally increased glow spread */
      height: 146%;
      transform: translate(-50%, -50%) scale(.76);
      border-radius: 999px;
      pointer-events: none;
      z-index: -1;

      opacity: 0;

      background:
        radial-gradient(circle,
          rgba(255, 120, 35, .98) 0%,
          /* slightly stronger core */
          rgba(215, 75, 22, .76) 24%,
          /* minimally stronger orange */
          rgba(165, 55, 15, .40) 46%,
          /* slightly stronger mid */
          rgba(110, 35, 10, .17) 64%,
          /* slightly wider outer fade */
          rgba(110, 35, 10, 0) 76%);

      filter: blur(6.5px);
      transition: opacity .16s ease, transform .16s ease, filter .16s ease;
    }

    .sideNavGlyph svg {
      display: block;
      width: 100%;
      height: 100%;
      fill: currentColor;
      pointer-events: none;
      flex: 0 0 auto;
    }

    .sideNavGlyph.questionGlyph svg,
    .sideNavGlyph.questionNumberGlyph svg {
      width: 99%;
      height: 99%;
    }

    .sideNavGlyph.leaderboardGlyph svg,
    .sideNavGlyph.resultsGlyph svg,
    .sideNavGlyph.analyticsGlyph svg {
      width: 86%;
      height: 86%;
    }

    .sideNavGlyph.submissionsGlyph svg {
      width: 110%;
      height: 110%;
    }

    .sideNavGlyph.prizesGlyph {
      padding-top: 1px;
      padding-bottom: 1px;
    }

    .sideNavGlyph.prizesGlyph svg {
      width: 82%;
      height: 82%;
    }

    .sideNavGlyph.exportGlyph svg {
      width: 86%;
      height: 86%;
    }

    .sideNavText {
      min-width: 0;
      font-size: clamp(14px, 1vw, 20px);
      line-height: 1.08;
      font-weight: 500;
      letter-spacing: -.03em;
      color: currentColor;
      white-space: nowrap;
      overflow: visible;
      text-overflow: clip;
    }

    .sideNavArrowBox {
      width: 27px;
      height: 24px;
      border-radius: 7px;
      border: none;
      background: #2D303E;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin-right: -4px;
      color: #B2B6C4;
      flex: 0 0 auto;
      position: relative;
      isolation: isolate;
      overflow: visible;
      transition: background .12s ease, color .12s ease;
    }

    .sideNavArrowBox::before {
      content: "";
      position: absolute;
      left: 50%;
      top: 50%;
      width: 18px;
      height: 18px;
      transform: translate(-50%, -50%) scale(.92);
      border-radius: 999px;
      pointer-events: none;
      z-index: -1;
      opacity: 0;
      background:
        radial-gradient(circle,
          rgba(255, 120, 35, .58) 0%,
          rgba(215, 75, 22, .34) 32%,
          rgba(165, 55, 15, .16) 55%,
          rgba(110, 35, 10, 0) 76%);
      filter: blur(4.5px);
      transition: opacity .16s ease, transform .16s ease, filter .16s ease;
    }

    .sideNavBtn:hover .sideNavArrowBox {
      background: rgba(203, 215, 255, 0.075);
      color: #B2B6C4;
    }

    .sideNavBtn.active:hover .sideNavArrowBox {
      background: rgba(203, 215, 255, 0.075);
      color: #B2B6C4;
    }

    .sideNavArrowBox:hover,
    .sideNavBtn:hover .sideNavArrowBox:hover,
    .sideNavBtn.active:hover .sideNavArrowBox:hover {
      background: rgba(203, 215, 255, 0.1);
      color: #B2B6C4;
    }

    .sideNavBtn.active .sideNavArrowBox {
      background: #323644;
      color: #B2B6C4;
    }

    .sideNavBtn.active .sideNavArrowBox::before {
      opacity: .70;
      transform: translate(-50%, -50%) scale(.98);
      filter: blur(4.8px);
    }


    .sideNavBtn.active.arrowToggled .sideNavArrowBox::before {
      opacity: 0;
      transform: translate(-50%, -50%) scale(.92);
      filter: blur(4.5px);
    }

    .sideNavBtn:hover:not(.active) .sideNavArrowBox::before {
      opacity: 0;
      transform: translate(-50%, -50%) scale(.92);
      filter: blur(4.5px);
    }

    .sideNavArrowSvg {
      width: 8px;
      height: 7px;
      display: block;
      fill: currentColor;
      pointer-events: none;
      flex: 0 0 auto;
      position: relative;
      z-index: 1;
      transition: transform .18s ease;
      transform-origin: center center;
    }

    .sideNavBtn.arrowToggled {
      background: #1B1D28;
    }

    .sideNavBtn.arrowToggled:hover,
    .sideNavBtn.arrowToggled:active {
      background: rgba(203, 215, 255, 0.03);
    }

    .sideNavBtn.arrowToggled.active {
      background: #1B1D28;
    }

    .sideNavBtn.arrowToggled .sideNavArrowSvg {
      transform: rotate(180deg);
    }

    .sideNavBtn:hover .sideNavGlyph,
    .sideNavBtn:hover .sideNavText,
    .sideNavSubBtn:hover .sideNavGlyph,
    .sideNavSubBtn:hover .sideNavSubBtnText {
      color: #FFFFFF;
    }

    .sideNavBtn:hover .sideNavGlyph::before,
    .sideNavSubBtn:hover .sideNavGlyph::before {
      opacity: 0;
      transform: translate(-50%, -50%) scale(.78);
      filter: blur(10px);
    }

    .sideNavBtn.active .sideNavGlyph,
    .sideNavBtn.active .sideNavText,
    .sideNavSubBtn.active .sideNavGlyph,
    .sideNavSubBtn.active .sideNavSubBtnText {
      color: #ffffc1;
    }

    .sideNavBtn.active .sideNavGlyph::before,
    .sideNavSubBtn.active .sideNavGlyph::before {
      opacity: 1;
      transform: translate(-50%, -50%) scale(.86);
      filter: blur(7.5px);
    }

    .container {
      width: 100%;
      max-width: var(--tableAreaFixedWidth);
      margin: 0 auto;
      padding: 0 var(--pageSidePad) 18px;
    }

    /*
      Fixed table width behaviour:
      tables stay at the same width they would have at a 1448px browser window
      with both sidebars open. Closing one or both sidebars only creates more
      background gap around the centred tables. The tables shrink only when the
      available centre area is genuinely narrower than this fixed target.
    */
    .contentArea {
      display: flex;
      justify-content: flex-start;
      align-items: flex-start;
      overflow-x: auto;
      overflow-y: visible;
      scrollbar-gutter: stable;
    }

    .contentArea::before,
    .contentArea::after {
      content: "";
      flex: 1 0 0;
      min-width: 0;
    }

    .container,
    body.rightSidebarClosed .container,
    body.sidebarCollapsed .container,
    body.sidebarCollapsed.rightSidebarClosed .container {
      width: 100% !important;
      min-width: 0 !important;
      max-width: var(--tableAreaFixedWidth) !important;
      flex: 0 1 var(--tableAreaFixedWidth);
      margin-left: auto !important;
      margin-right: auto !important;
    }


    #questionCard h2,
    #selectedHeading {
      display: none !important;
    }

    .muted {
      color: var(--muted);
    }

    .tiny {
      font-size: 11px;
    }

    .error {
      color: #ff8a8a;
      font-weight: 700;
    }

    .row {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
      align-items: center;
    }

    .btn {
      width: auto;
      height: 40px;
      padding: 10px 12px;
      border-radius: 14px;
      border: 1px solid var(--btnBorder);
      background: var(--btn);
      color: rgba(234, 242, 255, .94);
      font-weight: 700;
      cursor: pointer;
      white-space: nowrap;
      transition: background .12s ease, border-color .12s ease, color .12s ease, filter .12s ease;
      letter-spacing: .2px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }

    .btn:hover {
      background: var(--btnHover);
      border-color: var(--btnBorderHover);
      color: rgba(234, 242, 255, .99);
    }

    .btn:active {
      background: var(--btnActive);
      border-color: rgba(255, 255, 255, .30);
    }

    .btn:disabled {
      opacity: .55;
      cursor: not-allowed;
    }

    .btnWide {
      width: 100%;
      height: 44px;
      border-radius: 16px;
      font-size: 14px;
    }

    code {
      font-family: var(--font);
      font-size: 11px;
      color: rgb(255, 255, 255);
      background: rgba(0, 0, 0, .22);
      border: 1px solid rgba(255, 255, 255, .10);
      padding: 2px 6px;
      border-radius: 10px;
    }

    .qPageGrid {
      display: grid;
      grid-template-columns: 1fr;
      gap: 0;
      align-items: start;
    }

    .qPageGrid>div,
    #qTableWrap,
    #lbWrap {
      margin-top: 0 !important;
    }

    .questionHomePlaceholder {
      min-height: var(--tableAreaMinHeight);
    }


    /* Rewind page calendar layout */
    .rewindPageShell {
      width: 100%;
      max-width: 100%;
      min-width: 0;
      min-height: var(--tableAreaMinHeight);
      display: flex;
      flex-direction: column;
      align-items: stretch;
      padding: 0 18px;
      margin: 0;
      background: transparent;
      border: none;
      border-radius: 0;
      box-shadow: none;
      overflow: hidden;
      box-sizing: border-box;
    }

    .rewindPageTitleLine {
      display: flex;
      -webkit-box-align: center;
      align-items: center;
      margin: 8px 0 24px;
      color: rgb(255, 255, 255);
      text-transform: uppercase;
      word-break: break-word;
      gap: 12px;
      font-size: 22px;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: normal;
      line-height: 1.15;
    }

    .rewindPageTitleGlyph {
      width: 20px;
      min-width: 20px;
      height: 20px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: currentColor;
      fill: currentColor;
      position: relative;
      top: -1px;
      flex: 0 0 20px;
    }

    .rewindPageTitleGlyph svg {
      width: 20px;
      height: 20px;
      display: block;
      fill: currentColor;
      color: currentColor;
      pointer-events: none;
    }





    /* Questions main page layout */
    .questionPageShell {
      width: 100%;
      max-width: 100%;
      min-width: 0;
      min-height: 0;
      display: flex;
      flex-direction: column;
      align-items: stretch;
      padding: 0 18px;
      margin: 0;
      background: transparent;
      border: none;
      border-radius: 0;
      box-shadow: none;
      overflow: hidden;
      box-sizing: border-box;
    }

    .questionPageTitleLine {
      display: flex;
      -webkit-box-align: center;
      align-items: center;
      margin: 8px 0 0;
      color: rgb(255, 255, 255);
      text-transform: uppercase;
      word-break: break-word;
      gap: 12px;
      font-size: 22px;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: normal;
      line-height: 1.15;
    }

    .questionPageTitleGlyph {
      width: 20px;
      min-width: 20px;
      height: 20px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: currentColor;
      fill: currentColor;
      position: relative;
      top: -1px;
      flex: 0 0 20px;
    }

    .questionPageTitleGlyph svg {
      width: 20px;
      height: 20px;
      display: block;
      fill: currentColor;
      color: currentColor;
      pointer-events: none;
    }


    .sportsPageShell {
      min-height: var(--tableAreaMinHeight);
    }

    .sportsPageShell .questionHomePlaceholder {
      flex: 1 1 auto;
      min-height: calc(var(--tableAreaMinHeight) - 42px);
    }

    .questionPageTitleGlyph.standingsTitleGlyph svg {
      width: 22px;
      height: 22px;
      overflow: visible;
    }

    .questionPageTitleGlyph.worldCupTitleGlyph svg {
      width: 22px;
      height: 22px;
      overflow: visible;
    }

    .questionPageTitleGlyph.worldCupTitleGlyph svg rect {
      display: none !important;
    }


    .eventSetupContent {
      width: 100%;
      display: flex;
      flex-direction: column;
      gap: 37.4px;
      padding-top: 24px;
      flex: 1 1 auto;
      min-height: calc(var(--tableAreaMinHeight) - 42px);
    }

    .eventSetupSection {
      width: 100%;
      display: flex;
      flex-direction: column;
      gap: 14px;
    }

    .eventSetupHeading {
      margin: 0 0 2px;
      text-transform: uppercase;
      color: rgb(255, 255, 255);
      font-size: 28px;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: normal;
      line-height: 1.15;
      letter-spacing: -0.02em;
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .eventSetupHeadingNumberGlyph {
      width: 28px;
      height: 28px;
      min-width: 28px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: currentColor;
      flex: 0 0 auto;
      transform: translateY(-1px);
    }

    .eventSetupHeadingNumberGlyph svg {
      width: 28px;
      height: 28px;
      display: block;
      fill: currentColor;
      color: currentColor;
    }

    .eventSetupText {
      margin: 0;
      color: rgb(177, 182, 198);
      font-size: 14px;
      line-height: 1.55;
      font-weight: 500;
      width: 100%;
      max-width: none;
    }


    .eventSetupTextLink {
      color: #FFFFFF;
      font-weight: 700;
      text-decoration: underline;
      text-underline-offset: 3px;
    }

    .eventSetupTextLink:hover,
    .eventSetupTextLink:focus-visible {
      color: rgb(254, 161, 1);
      outline: none;
    }

    .sportsSubmissionsImportOnlyRow {
      grid-template-columns: 2fr 1fr;
    }

    .sportsSubmissionsImportOnlyRow .questionImportPanel {
      grid-column: 1 / 2;
    }

    .eventSetupDiscordInline {
      color: #FFFFFF;
      font-family: "gg-sans-Semibold", "gg sans", "ABC Ginto Normal", "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
      font-weight: 600;
      letter-spacing: -0.01em;
      white-space: nowrap;
    }

    .eventSetupInstructionPlus {
      display: inline-block;
      color: #FFFFFF;
      font-size: 1.35em;
      font-weight: 800;
      line-height: 0;
      transform: translateY(1px);
    }

    .eventSetupTableArea {
      width: 100%;
      min-width: 0;
    }

    .eventSetupTableWithColumnButton {
      width: 100%;
      min-width: 0;
      display: flex;
      align-items: flex-start;
      gap: 7.2px;
    }

    .eventSetupTableWrap {
      width: 100%;
      min-width: 0;
      overflow-x: auto;
      border-radius: 0;
      border: none;
      background: transparent;
      box-shadow: none;
      flex: 1 1 auto;
    }

    .eventSetupTable {
      width: 100%;
      min-width: 760px;
      border-collapse: separate;
      border-spacing: 0 4px;
      table-layout: fixed;
      background: transparent;
    }

    .eventSetupTable.optionCount2 col.eventSetupQuestionCol {
      width: 74.5%;
    }

    .eventSetupTable.optionCount2 col.eventSetupOptionCol {
      width: 12.75%;
    }

    .eventSetupTable.optionCount3 col.eventSetupQuestionCol {
      width: 61.75%;
    }

    .eventSetupTable.optionCount3 col.eventSetupOptionCol {
      width: 12.75%;
    }

    .eventSetupTable.optionCount4 col.eventSetupQuestionCol {
      width: 52.4%;
    }

    .eventSetupTable.optionCount4 col.eventSetupOptionCol {
      width: 11.9%;
    }

    .eventSetupTable.optionCount5 col.eventSetupQuestionCol {
      width: 44.75%;
    }

    .eventSetupTable.optionCount5 col.eventSetupOptionCol {
      width: 11.05%;
    }

    .eventSetupTable col.eventSetupDeleteCol {
      width: 42px;
    }

    .eventSetupTable th,
    .eventSetupTable td {
      border: none;
      text-align: left;
      vertical-align: middle;
      box-sizing: border-box;
    }

    .eventSetupTable thead tr {
      height: calc(var(--sideNavButtonHeight) * 0.8738);
      min-height: calc(var(--sideNavButtonHeight) * 0.8738);
      background: #cbd7ff08;
      border-radius: 4px;
    }

    .eventSetupTable th {
      height: calc(var(--sideNavButtonHeight) * 0.8738);
      padding: 0 4.8px;
      color: #686D7B;
      background: #cbd7ff08;
      font-size: var(--fixedBoardHeaderFontSize, 12px);
      line-height: 1.1;
      font-weight: 600;
      letter-spacing: .02em;
      text-transform: uppercase;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .eventSetupTable th:first-child {
      border-top-left-radius: 4px;
      border-bottom-left-radius: 4px;
      padding-left: 14.4px;
    }

    .eventSetupTable th:last-child {
      border-top-right-radius: 4px;
      border-bottom-right-radius: 4px;
      padding-right: 14.4px;
    }

    .eventSetupTable tbody tr {
      height: auto;
      min-height: calc(var(--sideNavButtonHeight) * 1.3514);
      background: #cbd7ff08;
      border-radius: 4px;
      transition: background .12s ease;
    }

    .eventSetupTable tbody tr:hover {
      background: #252734;
    }

    .eventSetupTable td {
      height: auto;
      min-height: calc(var(--sideNavButtonHeight) * 1.3514);
      padding: 7px 4.8px;
      background: #cbd7ff08;
    }

    .eventSetupTable tbody tr:hover td {
      background: #252734;
    }

    .eventSetupTable td:first-child {
      border-top-left-radius: 4px;
      border-bottom-left-radius: 4px;
      padding-left: 14.4px;
    }

    .eventSetupTable td:last-child {
      border-top-right-radius: 4px;
      border-bottom-right-radius: 4px;
      padding-right: 14.4px;
    }

    .eventSetupTable th.eventSetupDeleteHead,
    .eventSetupTable td.eventSetupDeleteCell {
      width: 42px;
      min-width: 42px;
      padding-left: 3px;
      padding-right: 8px;
      text-align: center;
    }

    .eventSetupTable th.eventSetupDeleteHead {
      color: transparent;
    }

    .eventSetupDeleteCell {
      vertical-align: middle;
    }

    .eventSetupDeleteRowBtn {
      width: 30px;
      height: 30px;
      min-width: 30px;
      border: none;
      outline: none;
      border-radius: 999px;
      background: transparent;
      color: #B2B6C4;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0;
      margin: 0 auto;
      cursor: pointer;
      transition: color .12s ease, filter .12s ease;
    }

    .eventSetupDeleteRowBtn:hover,
    .eventSetupDeleteRowBtn:active {
      background: transparent;
      color: #FFFFFF;
      filter: none;
    }

    .eventSetupDeleteRowBtn .headerImportMenuIcon {
      width: 24px;
      min-width: 24px;
      height: auto;
      margin-left: 0;
      padding: 3px;
      fill: currentColor;
      stroke: none;
      color: currentColor;
      pointer-events: none;
    }

    .eventSetupInput {
      display: block;
      width: 100%;
      min-width: 0;
      min-height: 32px;
      height: 32px;
      max-height: none;
      border: 1px solid transparent;
      outline: none;
      border-radius: 6px;
      background: rgba(15, 17, 26, 0.55);
      color: #FFFFFF;
      padding: 7px 10px;
      font-size: var(--fixedBoardRowFontSize, 14px);
      line-height: 1.15;
      font-weight: 500;
      resize: none;
      overflow: hidden;
      white-space: pre-wrap;
      overflow-wrap: anywhere;
      word-break: break-word;
      transition: background .1s, border-color .1s, box-shadow .1s;
    }

    .eventSetupInput::placeholder {
      color: #696B73;
      opacity: 1;
    }

    .eventSetupInput:focus {
      border: 1px solid rgb(255, 255, 193);
      box-shadow: rgb(255, 252, 57) 0px 0px 1px inset, rgb(255, 93, 0) 0px 0px 4px;
    }

    .eventSetupAddOptionBtn,
    .eventSetupAddRowBtn,
    .eventSetupResetBtn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      appearance: none;
      border: none;
      outline: none;
      border-radius: 4px;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 700;
      font-style: normal;
      line-height: 1;
      color: rgb(20, 23, 34);
      background: rgb(134, 244, 84);
      box-shadow: rgba(118, 255, 25, 0.4) 0px 0px 10px, rgba(255, 255, 255, 0.2) 0px 1px 0px inset, rgba(0, 0, 0, 0.15) 0px -3px 0px inset, rgb(59, 198, 14) 0px 0px 8px inset;
      cursor: pointer;
      user-select: none;
      transition: background .1s ease, filter .1s ease, opacity .1s ease;
    }

    .eventSetupAddOptionBtn {
      width: 32px;
      min-width: 32px;
      height: 32px;
      padding: 0;
      font-size: 24px;
      flex: 0 0 32px;
      margin-top: 0;
      transform: none;
    }

    .eventSetupAddRowLine {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      margin-top: 6px;
    }

    .eventSetupAddRowBtn {
      width: 32px;
      min-width: 32px;
      height: 32px;
      padding: 0;
      font-size: 24px;
      text-transform: uppercase;
      letter-spacing: 0.5px;
    }


    .eventSetupResetBtn {
      width: 86px;
      min-width: 86px;
      height: 32px;
      padding: 0 13px;
      font-size: 14px;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      color: rgb(20, 23, 34);
      background: #ff4949;
      box-shadow:
        rgba(255, 73, 73, 0.4) 0px 0px 10px,
        rgba(255, 255, 255, 0.2) 0px 1px 0px inset,
        rgba(0, 0, 0, 0.15) 0px -3px 0px inset,
        rgb(203, 39, 57) 0px 0px 15px inset;
      flex: 0 0 86px;
    }

    .eventSetupResetBtn:hover,
    .eventSetupResetBtn:active {
      filter: brightness(1.04);
    }

    .eventSetupResetBtn:disabled,
    .eventSetupResetBtn:disabled:hover,
    .eventSetupResetBtn.isFreshState,
    .eventSetupResetBtn.isFreshState:hover {
      cursor: not-allowed;
      color: rgba(255, 255, 255, .38);
      background: rgba(203, 215, 255, 0.055);
      box-shadow: none;
      filter: none;
      opacity: 1;
    }

    .eventSetupAddOptionBtn:disabled,
    .eventSetupAddRowBtn:disabled {
      cursor: not-allowed;
      color: rgba(255, 255, 255, .38);
      background: rgba(203, 215, 255, 0.055);
      box-shadow: none;
      filter: none;
    }


    /* Event setup: side control rail + removable option columns. */
    .eventSetupTableWithColumnButton {
      align-items: flex-start;
      gap: 6px;
    }

    .eventSetupTableWrap {
      flex: 1 1 auto;
    }

    .eventSetupSideControls {
      width: 32px;
      min-width: 32px;
      flex: 0 0 32px;
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: 4px;
    }

    .eventSetupRowDeleteStack {
      display: flex;
      flex-direction: column;
      gap: 4px;
      width: 32px;
      min-width: 32px;
    }

    .eventSetupTable col.eventSetupDeleteCol,
    .eventSetupTable th.eventSetupDeleteHead,
    .eventSetupTable td.eventSetupDeleteCell {
      display: none !important;
      width: 0 !important;
      min-width: 0 !important;
      padding: 0 !important;
    }

    .eventSetupOptionHeaderInner {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0;
      width: 100%;
      min-width: 0;
    }

    .eventSetupOptionHeaderLabel {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .eventSetupDeleteOptionBtn {
      width: 18px;
      min-width: 18px;
      height: 18px;
      min-height: 18px;
      border: none;
      outline: none;
      border-radius: 999px;
      background: transparent;
      color: #B2B6C4;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0;
      margin: 0;
      cursor: pointer;
      transition: color .12s ease, filter .12s ease;
    }

    .eventSetupDeleteOptionBtn:hover,
    .eventSetupDeleteOptionBtn:active {
      color: #FFFFFF;
      background: transparent;
      filter: none;
    }

    .eventSetupDeleteOptionBtn .headerImportMenuIcon {
      width: 16px;
      min-width: 16px;
      height: 16px;
      padding: 2px;
      display: block;
      pointer-events: none;
      fill: currentColor;
      color: currentColor;
    }

    .eventSetupSideControls .eventSetupAddOptionBtn,
    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn {
      width: 32px;
      min-width: 32px;
      max-width: 32px;
      margin: 0;
      flex: 0 0 auto;
    }

    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn {
      border-radius: 4px;
      background: #cbd7ff08;
    }

    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn:hover,
    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn:active {
      background: #252734;
    }



    /* Final event setup table alignment fixes. */
    .eventSetupTable th:nth-child(n+2) {
      text-align: right;
    }

    .eventSetupTable td:nth-child(n+2) .eventSetupInput {
      text-align: right;
    }

    .eventSetupTable td:nth-child(n+2) .eventSetupInput::placeholder {
      text-align: right;
    }

    .eventSetupOptionHeaderInner {
      justify-content: flex-end;
      text-align: right;
    }

    .eventSetupOptionHeaderLabel {
      flex: 1 1 auto;
      text-align: right;
    }

    .eventSetupSideControls {
      gap: 0;
    }

    .eventSetupSideControls .eventSetupAddOptionBtn {
      margin-top: 0;
      align-self: stretch;
    }

    .eventSetupRowDeleteStack {
      gap: 4px;
      margin-top: 4px;
    }

    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn,
    .eventSetupDeleteRowBtn {
      background: transparent !important;
      border-radius: 0;
      color: #B2B6C4;
      box-shadow: none;
    }

    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn:hover,
    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn:active,
    .eventSetupDeleteRowBtn:hover,
    .eventSetupDeleteRowBtn:active {
      background: transparent !important;
      color: #FFFFFF;
      filter: none;
    }

    .eventSetupDeleteOptionBtn {
      color: #B2B6C4;
      background: transparent !important;
      box-shadow: none;
    }


    /* Keep the event setup side controls locked to the measured table geometry.
       These controls are deliberately outside the scrolling table so the + column
       button and row trashcans never become table columns, but their inline
       heights/margins are recalculated after resize, page switches and font loads. */
    .eventSetupTableWithColumnButton {
      position: relative;
    }

    .eventSetupSideControls,
    .eventSetupRowDeleteStack {
      contain: layout style;
    }

    .eventSetupSideControls .eventSetupAddOptionBtn,
    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn {
      box-sizing: border-box;
    }

    .eventSetupDeleteOptionBtn:hover,
    .eventSetupDeleteOptionBtn:active {
      color: #FFFFFF;
      background: transparent !important;
      filter: none;
    }

    .questionPageImportExportRow {
      --questionPageButtonHeight: 40px;
      --questionImportExportPadY: 20px;
      width: 100%;
      min-height: calc((var(--questionPageButtonHeight) * 3) + (var(--questionImportExportPadY) * 2));
      padding: var(--questionImportExportPadY) 0;
      margin: 0;
      display: grid;
      grid-template-columns: 2fr 1fr;
      gap: 12px;
      align-items: stretch;
      box-sizing: border-box;
      flex: 0 0 auto;
    }

    .questionImportExportPanel {
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 10px;
      align-items: stretch;
      justify-content: flex-start;
    }

    .questionImportExportTitle {
      height: 22px;
      display: inline-flex;
      align-items: center;
      justify-content: flex-start;
      gap: 8px;
      color: rgb(255, 255, 255);
      text-transform: uppercase;
      font-size: 14px;
      line-height: 1;
      font-weight: 800;
      letter-spacing: .02em;
      user-select: text;
      -webkit-user-select: text;
    }

    .questionImportExportTitleGlyph {
      width: 18.4px;
      height: 18.4px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: currentColor;
      fill: currentColor;
      flex: 0 0 18.4px;
      position: relative;
      top: -1px;
    }

    .questionImportExportTitleGlyph svg {
      width: 18.4px;
      height: 18.4px;
      display: block;
      fill: currentColor;
      color: currentColor;
      pointer-events: none;
    }



    .eventSetupExportCsvBtn .questionImportExportTitleGlyph {
      width: 23px;
      height: 23px;
      flex-basis: 23px;
    }

    .eventSetupExportCsvBtn .questionImportExportTitleGlyph svg {
      width: 23px;
      height: 23px;
    }

    .questionImportDropGrid {
      min-height: calc((var(--questionPageButtonHeight) * 3) - 32px);
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
      align-items: stretch;
    }

    .questionImportDropButton,
    .questionExportCsvButton {
      width: 100%;
      min-width: 0;
      min-height: 100%;
      border: 1px solid transparent;
      outline: none;
      border-radius: 10px;
      background: rgba(203, 215, 255, 0.03);
      color: #B2B6C4;
      display: flex;
      align-items: center;
      justify-content: space-between;
      text-align: left;
      gap: 12px;
      padding: 14px 10.5px;
      box-sizing: border-box;
      cursor: pointer;
      appearance: none;
      transition: background .1s ease, color .1s ease, text-shadow .1s ease, filter .1s ease, border-color .1s ease;
      overflow: visible;
    }

    .questionImportDropButton {
      border-style: dashed;
      border-color: rgba(255, 255, 255, 0.34);
    }

    .questionImportDropButton:hover,
    .questionImportDropButton:focus-visible {
      border-style: dashed;
      border-color: rgba(255, 255, 255, 0.34);
    }

    .questionImportDropButton.dragOver {
      border-style: dashed;
      border-color: rgba(255, 255, 255, 0.82);
    }

    .questionImportDropButton.dropAccepted,
    .questionImportDropButton.dropAccepted:hover,
    .questionImportDropButton.dropAccepted:focus-visible {
      border-style: dashed !important;
      border-width: 1px !important;
      border-color: rgb(102, 255, 69) !important;
      box-shadow: none !important;
    }

    .questionImportDropButton.dropRejected,
    .questionImportDropButton.dropRejected:hover,
    .questionImportDropButton.dropRejected:focus-visible {
      border-style: dashed !important;
      border-width: 1px !important;
      border-color: rgb(255, 73, 73) !important;
      box-shadow: none !important;
    }

    .questionImportDropButton,
    .questionImportDropButton .loadedImportReadyContent,
    .questionImportDropButton .headerImportLoadedRadio,
    .questionImportDropButton .headerImportLoadedRadio .css-13ahkye {
      overflow: visible !important;
    }

    .questionImportDropButton:hover,
    .questionImportDropButton:focus-visible,
    .questionImportDropButton.dragOver,
    .questionExportCsvButton:hover,
    .questionExportCsvButton:focus-visible {
      background: rgba(203, 215, 255, 0.055);
      color: #FFFFFF;
      filter: none;
      transform: none;
    }

    .questionImportDropButton.loaded,
    .questionImportDropButton.loaded:hover,
    .questionImportDropButton.loaded:focus-visible {
      background: #161821;
      color: #FFFFFF;
    }


    .questionImportDropButton.dropAccepted,
    .questionImportDropButton.loaded.dropAccepted,
    .questionImportDropButton.dropAccepted:hover,
    .questionImportDropButton.dropAccepted:focus-visible,
    .questionImportDropButton.loaded.dropAccepted:hover,
    .questionImportDropButton.loaded.dropAccepted:focus-visible {
      border-style: dashed !important;
      border-width: 1px !important;
      border-color: rgb(102, 255, 69) !important;
      box-shadow: none !important;
    }

    .questionImportDropButton.dropRejected,
    .questionImportDropButton.loaded.dropRejected,
    .questionImportDropButton.dropRejected:hover,
    .questionImportDropButton.dropRejected:focus-visible,
    .questionImportDropButton.loaded.dropRejected:hover,
    .questionImportDropButton.loaded.dropRejected:focus-visible {
      border-style: dashed !important;
      border-width: 1px !important;
      border-color: rgb(255, 73, 73) !important;
      box-shadow: none !important;
    }

    .questionImportDropButton .loadedImportReadyContent,
    .questionExportCsvButton .loadedImportReadyContent {
      width: 100%;
      min-width: 0;
      gap: 10px;
      align-items: center;
    }

    .questionImportDropButton .headerImportTextStack,
    .questionExportCsvButton .headerImportTextStack {
      gap: 5px;
      min-width: 0;
      overflow: hidden;
    }

    .questionImportDropButton .headerImportMainLabel {
      max-width: 100%;
      color: #FFFFFF !important;
      font-size: 13px;
      font-weight: 800;
      line-height: 1;
      text-transform: none;
      letter-spacing: .01em;
    }

    .questionExportCsvButton .headerImportMainLabel {
      max-width: 100%;
      color: #FFFFFF !important;
      font-size: 13px;
      font-weight: 800;
      line-height: 1;
      text-transform: none;
      letter-spacing: .01em;
    }

    .questionImportDropHint,
    .questionExportCsvHint {
      display: block;
      max-width: 100%;
      color: #B2B6C4 !important;
      font-size: 11px;
      font-weight: 600;
      line-height: 1.25;
      letter-spacing: 0;
      text-transform: none;
      overflow: visible;
      text-overflow: clip;
      white-space: normal;
      overflow-wrap: anywhere;
    }

    .questionImportErrorContent {
      width: 100%;
      min-width: 0;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      pointer-events: none;
    }

    .questionImportErrorText {
      display: block;
      width: 100%;
      max-width: 100%;
      color: rgb(255, 73, 73) !important;
      font-size: 11px;
      font-weight: 800;
      line-height: 1.25;
      letter-spacing: 0;
      text-transform: none;
      white-space: normal;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    .questionImportDropFileName {
      display: block;
      max-width: 100%;
      color: #FFFFFF !important;
      font-size: 11px;
      font-weight: 500;
      line-height: 1;
      opacity: .78;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .questionImportDropButton .loadedImportRemoveContent {
      color: #B2B6C5 !important;
      fill: #B2B6C5 !important;
      stroke: #B2B6C5 !important;
      margin-left: 8px;
    }

    .questionImportDropButton .loadedImportRemoveContent:hover,
    .questionImportDropButton .loadedImportRemoveContent:active {
      color: #FFFFFF !important;
      fill: #FFFFFF !important;
      stroke: #FFFFFF !important;
    }

    .questionImportDropButton .loadedImportRemoveContent svg,
    .questionImportDropButton .loadedImportRemoveContent svg * {
      color: currentColor !important;
      fill: currentColor !important;
      stroke: none !important;
    }

    .questionImportDropButton .headerImportLoadedRadio .css-1cwz9v1:checked+.css-13ahkye::before {
      background: rgb(255, 229, 0) !important;
      box-shadow: rgb(255, 176, 25) 0px 0px 12px 1px, rgb(255, 176, 25) 0px 0px 4px inset !important;
      border: 1px solid rgb(255, 229, 0) !important;
    }

    .questionImportDropButton .headerImportLoadedRadio .css-1cwz9v1:not(:checked)+.css-13ahkye::before {
      background: rgb(16, 18, 27) !important;
      border: 1px solid rgb(48, 53, 69) !important;
      box-shadow: none !important;
    }

    .questionImportDropButton .headerImportLoadedRadio .css-1cwz9v1:not(:checked)+.css-13ahkye .css-dm6haw {
      display: none !important;
    }

    .questionExportPlaceholderBox {
      min-height: calc((var(--questionPageButtonHeight) * 3) - 32px);
      width: 100%;
      min-width: 0;
      display: flex;
    }

    @media (max-width: 900px) {
      .questionPageImportExportRow {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 620px) {
      .questionImportDropGrid {
        grid-template-columns: 1fr;
      }
    }

    .questionPageTabsWrap {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding-bottom: 14px;
      margin: 0;
      flex: 0 0 auto;
    }

    .questionPageTabs {
      display: inline-flex;
      align-items: center;
      justify-content: flex-start;
      gap: 12px;
      flex-wrap: wrap;
      min-width: 0;
    }

    .questionPageButton {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 40px;
      min-height: 40px;
      min-width: 54px;
      padding: 0 16px;
      border: 0;
      outline: none;
      border-radius: 8px;
      text-transform: uppercase;
      transition: background .1s ease, filter .1s ease;
      font-size: 14px;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: normal;
      line-height: 1;
      user-select: none;
      cursor: pointer;
      background: rgba(203, 215, 255, 0.03);
      color: rgb(177, 182, 198);
      appearance: none;
      white-space: nowrap;
    }

    .questionPageButton:hover {
      background: rgba(203, 215, 255, 0.055);
      color: rgb(255, 255, 255);
      filter: none;
      transform: none;
    }

    .questionPageButton:active {
      background: rgba(203, 215, 255, 0.055);
      color: rgb(255, 255, 255);
      filter: none;
      transform: none;
    }

    .questionPageButton.active,
    .questionPageButton[aria-pressed="true"] {
      background: rgba(203, 215, 255, 0.055);
      color: rgb(255, 255, 193);
      text-shadow: rgb(255, 93, 0) 0px 0px 10px;
      cursor: default;
    }

    .questionPageButton:disabled,
    .questionPageButton.disabled,
    .questionPageButton[aria-disabled="true"] {
      opacity: .42;
      cursor: not-allowed;
      background: rgba(203, 215, 255, 0.018);
      color: rgba(177, 182, 198, .62);
      text-shadow: none;
      filter: none;
      transform: none;
    }

    .questionPageButton:disabled:hover,
    .questionPageButton.disabled:hover,
    .questionPageButton[aria-disabled="true"]:hover {
      background: rgba(203, 215, 255, 0.018);
      color: rgba(177, 182, 198, .62);
      text-shadow: none;
      filter: none;
      transform: none;
    }

    .worldCupPageTabsWrap {
      padding-top: 16px;
      padding-bottom: 0;
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      flex: 0 0 auto;
      margin: 0;
    }

    .worldCupPageTabsWrap .questionPageTabs {
      flex: 1 1 0%;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 12px;
      min-width: 0;
      white-space: nowrap;
      overflow: auto hidden;
      scrollbar-width: none;
      flex-wrap: nowrap;
    }

    .worldCupPageTabsWrap .questionPageTabs::-webkit-scrollbar {
      display: none;
    }

    .worldCupPageTabsWrap .questionPageButton {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      flex-direction: column;
      gap: 8px;
      height: 72px;
      min-height: 72px;
      width: 87px;
      min-width: 87px;
      max-width: 87px;
      padding: 0 0px 12px;
      border: 0;
      outline: none;
      border-radius: 8px;
      transition: background .1s ease, filter .1s ease;
      font-size: 14px;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 500 !important;
      font-style: normal;
      line-height: 1;
      user-select: none;
      cursor: pointer;
      background: transparent;
      color: rgb(177, 182, 198);
      appearance: none;
      white-space: normal;
      text-align: center;
      text-transform: none;
    }

    .worldCupPageTabsWrap .questionPageButtonIcon {
      display: block;
      width: 24px;
      min-width: 24px;
      height: 24px;
      flex: 0 0 24px;
      color: currentColor;
      fill: currentColor;
      pointer-events: none;
    }

    .worldCupPageTabsWrap .questionPageButtonIcon svg {
      display: block;
      width: 110.4%;
      height: 110.4%;
      overflow: visible;
      fill: currentColor;
      color: currentColor;
      transform: translateZ(0);
      transition: filter .1s ease;
    }

    .worldCupPageTabsWrap .questionPageButtonIcon path,
    .worldCupPageTabsWrap .questionPageButtonIcon g {
      fill: currentColor;
    }

    .worldCupPageTabsWrap .questionPageButtonIcon .worldCupSoccerBallIcon,
    .worldCupPageTabsWrap .questionPageButtonIcon .worldCupBracketIcon,
    .worldCupPageTabsWrap .questionPageButtonIcon .worldCupFinalsIcon,
    .worldCupPageTabsWrap .questionPageButtonIcon .worldCupOverallIcon {
      width: 100%;
      height: 100%;
    }

    .worldCupPageTabsWrap .questionPageButtonIcon .worldCupBracketIcon path {
      fill: currentColor !important;
    }

    .worldCupPageTabsWrap .questionPageButton:hover,
    .worldCupPageTabsWrap .questionPageButton:active {
      background: rgba(203, 215, 255, 0.055);
      filter: none;
      transform: none;
      text-shadow: none;
    }

    .worldCupPageTabsWrap .questionPageButton.active,
    .worldCupPageTabsWrap .questionPageButton[aria-pressed="true"] {
      background: rgba(203, 215, 255, 0.055) !important;
      color: rgb(255, 255, 193);
      text-shadow: rgb(255, 93, 0) 0px 0px 10px;
      cursor: default;
    }

    .worldCupPageTabsWrap .questionPageButton.active .questionPageButtonIcon,
    .worldCupPageTabsWrap .questionPageButton[aria-pressed="true"] .questionPageButtonIcon,
    .worldCupPageTabsWrap .questionPageButton.active .questionPageButtonIcon svg,
    .worldCupPageTabsWrap .questionPageButton[aria-pressed="true"] .questionPageButtonIcon svg {
      color: rgb(255, 255, 193);
      fill: rgb(255, 255, 193);
      filter: drop-shadow(0 0 10px rgb(255, 93, 0));
    }

    .worldCupPageTabsWrap .questionPageButton.active .questionPageButtonIcon path,
    .worldCupPageTabsWrap .questionPageButton[aria-pressed="true"] .questionPageButtonIcon path,
    .worldCupPageTabsWrap .questionPageButton.active .questionPageButtonIcon g,
    .worldCupPageTabsWrap .questionPageButton[aria-pressed="true"] .questionPageButtonIcon g {
      fill: rgb(255, 255, 193);
    }

    .worldCupPageTabsWrap .questionPageButton:disabled,
    .worldCupPageTabsWrap .questionPageButton.disabled,
    .worldCupPageTabsWrap .questionPageButton[aria-disabled="true"] {
      opacity: .42;
      cursor: not-allowed;
      background: rgba(203, 215, 255, 0.018);
      color: rgba(177, 182, 198, .62);
      text-shadow: none;
      filter: none;
      transform: none;
    }

    .worldCupPageTabsWrap .questionPageButton:disabled:hover,
    .worldCupPageTabsWrap .questionPageButton.disabled:hover,
    .worldCupPageTabsWrap .questionPageButton[aria-disabled="true"]:hover {
      background: rgba(203, 215, 255, 0.018);
      color: rgba(177, 182, 198, .62);
      text-shadow: none;
      filter: none;
      transform: none;
    }

    .worldCupDailyDayTabsWrap {
      margin-top: 14px;
      margin-bottom: 24px;
    }

    .worldCupDailyDayTabsWrap .questionPageTabs {
      justify-content: flex-start;
    }

    .worldCupDailyStatus {
      width: 100%;
      padding: 16px 18px;
      border-radius: 8px;
      background: rgba(255, 255, 255, .06);
      color: #B2B6C4;
      font-size: 13px;
      font-weight: 600;
      line-height: 1.45;
    }

    .worldCupPanels {
      width: 100%;
      margin-top: 0;
    }

    .worldCupPanel {
      display: none;
      width: 100%;
    }

    .worldCupPanel.active {
      display: block;
    }

    .worldCupStandingsMount .sportsStandingsCapture {
      width: 100%;
    }


    .sportsSubmissionsQuestionTabsWrap {
      padding-top: 14px;
      padding-bottom: 0;
    }


    .sportsSubmissionsBattlePanel {
      width: 100%;
      min-width: 0;
      margin-top: 24px;
      display: grid;
      grid-template-columns: 240px minmax(0, 1fr);
      gap: 50px;
      align-items: start;
    }

    .sportsSubmissionsBattleCard {
      width: 240px;
      min-width: 0;
      position: relative;
      display: flex;
      flex-direction: column;
      background: rgba(203, 215, 255, 0.075);
      border-radius: 8px;
      overflow: visible;
    }

    .sportsSubmissionsBattleLeftStack {
      width: 240px;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    .sportsSubmissionsDistributionCard {
      width: 240px;
      height: 240px;
      aspect-ratio: auto;
      min-width: 0;
      position: relative;
      display: flex;
      flex-direction: column;
      background: rgba(203, 215, 255, 0.075);
      border-radius: 8px;
      overflow: hidden;
      padding: 14px 14px 12px;
    }

    .sportsSubmissionsDistributionTitle {
      color: #FFFFFF;
      font-size: 14px;
      font-weight: 800;
      line-height: 1;
      text-transform: uppercase;
      letter-spacing: .02em;
      margin: 0 0 2px;
      flex: 0 0 auto;
    }

    .sportsSubmissionsDistributionChart {
      flex: 1 1 auto;
      min-height: 0;
      display: flex;
      align-items: flex-end;
      justify-content: center;
      gap: 20px;
      padding: 0 4px 0;
      border-radius: 6px;
    }

    .sportsSubmissionsDistributionBarWrap {
      min-width: 0;
      flex: 1 1 0;
      height: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-end;
      gap: 4px;
    }

    .sportsSubmissionsDistributionPercent {
      color: #FFFFFF;
      font-size: 9px;
      font-weight: 500;
      line-height: 1;
      min-height: 9px;
      font-variant-numeric: tabular-nums;
    }

    .sportsSubmissionsDistributionValue {
      color: #FFFFFF;
      font-size: 11px;
      font-weight: 500;
      line-height: 1;
      min-height: 11px;
      font-variant-numeric: tabular-nums;
    }

    .sportsSubmissionsDistributionTrack {
      width: 100%;
      max-width: 25px;
      height: 112px;
      display: flex;
      align-items: flex-end;
      justify-content: center;
      border-radius: 5px;
      background: rgba(255, 255, 255, .055);
      overflow: hidden;
    }

    .sportsSubmissionsDistributionBar {
      width: 100%;
      min-height: 0;
      height: var(--distribution-bar-height, 0%);
      border-radius: 5px 5px 0 0;
      background: var(--distribution-bar-colour, rgba(203, 215, 255, 0.30));
    }

    .sportsSubmissionsDistributionXAxisLabel {
      width: 100%;
      text-align: center;
      color: #FFFFFF;
      font-size: 11px;
      font-weight: 700;
      margin-top: 8px;
    }

    .sportsSubmissionsDistributionLabel {
      width: 100%;
      color: #FFFFFF;
      font-size: 10px;
      font-weight: 500;
      line-height: 1;
      text-align: center;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .sportsSubmissionsDistributionEmpty {
      width: 100%;
      min-height: 0;
      flex: 1 1 auto;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 6px;
      color: rgb(177, 182, 198);
      font-size: 12px;
      font-weight: 600;
      line-height: 1.25;
      text-align: center;
      padding: 12px;
    }

    .sportsSubmissionsBattleImageBox {
      position: relative;
      width: 100%;
      aspect-ratio: 1 / 1;
      border-radius: 8px 8px 0 0;
      overflow: visible;
      isolation: isolate;
    }

    .sportsSubmissionsBattleRollbitBg {
      display: none;
    }

    .sportsSubmissionsBattleImageBox::before {
      content: "";
      position: absolute;
      inset: 12px;
      border-radius: 6px;
      background-color: #20232E;
      background-image:
        linear-gradient(rgba(26, 29, 41, .34), rgba(26, 29, 41, .34)),
        url("/assets/rollbit_logo.jpg");
      background-size: auto, 92%;
      background-position: center center, left center;
      background-repeat: no-repeat, no-repeat;
      opacity: .72;
      filter: saturate(1.06) contrast(1.03);
    }

    .sportsSubmissionsBattleImageLabel {
      position: absolute;
      inset: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 6px;
      color: #FFFFFF;
      font-size: calc(44px * 1.7);
      line-height: 1;
      font-weight: 800;
      font-style: italic;
      text-transform: uppercase;
      letter-spacing: -.04em;
      text-shadow: rgba(0, 0, 0, .48) 0 3px 12px;
      user-select: none;
      pointer-events: none;
      z-index: 2;
    }

    .sportsSubmissionsBattleBotOverlay {
      position: absolute;
      left: var(--battle-bot-left, 58%);
      top: var(--battle-bot-top, 50%);
      width: var(--battle-bot-width, 58%);
      height: auto;
      max-height: var(--battle-bot-max-height, 94%);
      object-fit: contain;
      transform: translate(var(--battle-bot-translate-x, 0), var(--battle-bot-translate-y, -50%)) scale(var(--battle-bot-scale, 1)) rotate(var(--battle-bot-rotate, 0deg));
      transform-origin: var(--battle-bot-origin, center center);
      z-index: 5;
      pointer-events: none;
      user-select: none;
      -webkit-user-drag: none;
      filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .42));
    }

    /*
      Individual bot image controls.
      These cycle by question: Q1 bot1, Q2 bot2, Q3 bot3, Q4 bot4, Q5 bot5, Q6 bot1, etc.
      Change these variables to size/position each bot independently.

      --battle-bot-left: horizontal start position. Higher = further right.
      --battle-bot-top: vertical centre position. Higher = lower.
      --battle-bot-width: main bot size. Higher = bigger.
      --battle-bot-max-height: height cap so tall bots do not dominate the square.
      --battle-bot-translate-x: fine horizontal nudge after left positioning.
      --battle-bot-translate-y: fine vertical centering/nudge. -50% keeps it centred on top.
      --battle-bot-scale: extra size multiplier.
      --battle-bot-rotate: optional rotation.
    */
    .sportsSubmissionsBattleBotOverlayBot1 {
      --battle-bot-left: 40%;
      --battle-bot-top: 62%;
      --battle-bot-width: 68%;
      --battle-bot-max-height: 94%;
      --battle-bot-translate-x: 0;
      --battle-bot-translate-y: -50%;
      --battle-bot-scale: 1;
      --battle-bot-rotate: 0deg;
    }

    .sportsSubmissionsBattleBotOverlayBot2 {
      --battle-bot-left: 47%;
      --battle-bot-top: 63%;
      --battle-bot-width: 68%;
      --battle-bot-max-height: 94%;
      --battle-bot-translate-x: 0;
      --battle-bot-translate-y: -50%;
      --battle-bot-scale: 1;
      --battle-bot-rotate: 0deg;
    }

    .sportsSubmissionsBattleBotOverlayBot3 {
      --battle-bot-left: 45%;
      --battle-bot-top: 63%;
      --battle-bot-width: 68%;
      --battle-bot-max-height: 94%;
      --battle-bot-translate-x: 0;
      --battle-bot-translate-y: -50%;
      --battle-bot-scale: 1;
      --battle-bot-rotate: 0deg;
    }

    .sportsSubmissionsBattleBotOverlayBot4 {
      --battle-bot-left: 44%;
      --battle-bot-top: 63%;
      --battle-bot-width: 68%;
      --battle-bot-max-height: 94%;
      --battle-bot-translate-x: 0;
      --battle-bot-translate-y: -50%;
      --battle-bot-scale: 1;
      --battle-bot-rotate: 0deg;
    }

    .sportsSubmissionsBattleBotOverlayBot5 {
      --battle-bot-left: 48%;
      --battle-bot-top: 63%;
      --battle-bot-width: 68%;
      --battle-bot-max-height: 94%;
      --battle-bot-translate-x: 0;
      --battle-bot-translate-y: -50%;
      --battle-bot-scale: 1;
      --battle-bot-rotate: 0deg;
    }

    .sportsSubmissionsBattleMeta {
      position: relative;
      flex: 1 1 0%;
      min-height: 0;
      display: flex;
      flex-direction: column;
      gap: 4px;
      padding: 0 16px 16px;
    }

    .sportsSubmissionsBattleMetaRow {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      min-height: 18px;
      font-family: "Geogrotesque Wide", sans-serif;
      font-weight: 500;
      font-style: normal;
      font-size: 12px;
      line-height: 1.1;
      gap: 5px;
    }

    .sportsSubmissionsBattleMetaLabel {
      margin-right: 0;
      min-width: 0;
      white-space: nowrap;
      color: #FFFFFF;
      font-size: 14px;
      font-weight: 800;
      line-height: 1;
      text-transform: uppercase;
      letter-spacing: .02em;
    }

    .sportsSubmissionsBattleMetaValue {
      margin-left: 0;
      color: rgb(255, 255, 255);
      overflow: hidden;
      white-space: nowrap;
      text-overflow: clip;
      text-align: left;
      font-size: 13px;
    }

    .sportsSubmissionsBattleQuestionValue {
      width: 100%;
      white-space: normal;
      overflow: visible;
      text-overflow: clip;
      text-align: left;
      line-height: 1.25;
    }

    .sportsSubmissionsBattleOptionsValue {
      width: 100%;
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: flex-start;
      flex-wrap: wrap;
      gap: 4px 8px;
      min-width: 0;
      max-width: 100%;
      white-space: normal;
      overflow: visible;
      text-overflow: clip;
      line-height: 1.25;
    }

    .sportsSubmissionsBattleQuestionRow {
      margin-bottom: 8px;
    }

    .sportsSubmissionsBattleOptionLine {
      width: auto;
      max-width: 100%;
      display: grid;
      grid-template-columns: 18.5px minmax(0, 1fr);
      align-items: center;
      column-gap: 2.4px;
      min-width: 0;
    }

    .sportsSubmissionsBattleOptionText {
      min-width: 0;
      color: rgb(255, 255, 255);
      text-align: left;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .sportsSubmissionsBattleOptionSquareButton {
      width: 18.5px;
      height: 18.5px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border: 0;
      background: transparent;
      border-radius: 3px;
      padding: 0;
      cursor: pointer;
      flex: 0 0 18.5px;
      position: relative;
      transition: none;
    }

    .sportsSubmissionsBattleOptionSquareButton:hover,
    .sportsSubmissionsBattleOptionSquareButton:focus-visible {
      filter: none;
      transform: none;
      outline: none;
    }

    .sportsSubmissionsBattleOptionSquareButton.selected,
    .sportsSubmissionsBattleOptionSquareButton.selected:hover,
    .sportsSubmissionsBattleOptionSquareButton.selected:focus-visible {
      filter: none;
      transform: none;
    }

    .sportsSubmissionsBattleOptionSquare {
      display: block;
      width: 13.2px;
      height: 13.2px;
      object-fit: contain;
      flex: 0 0 auto;
      user-select: none;
      -webkit-user-drag: none;
      pointer-events: none;
    }

    .sportsSubmissionsBattleOptionCorrectIcon {
      position: absolute;
      inset: 50% auto auto 50%;
      width: 13.2px;
      height: 13.2px;
      display: block;
      transform: translate(-50%, -50%);
      color: #FFFFFF;
      fill: currentColor;
      pointer-events: none;
    }

    .sportsSubmissionsBattleOptionCorrectIcon .sportsSubmissionsBattleOptionCorrectCircle {
      fill: transparent !important;
    }

    .sportsSubmissionsBattleOptionCorrectIcon .sportsSubmissionsBattleOptionCorrectTick {
      fill: currentColor !important;
    }

    .sportsSubmissionsBattleArrow {
      fill: currentColor;
      width: 26px;
      min-width: 26px;
      height: auto;
      position: absolute;
      bottom: 52px;
      color: #1A1D29;
      pointer-events: none;
    }

    .sportsSubmissionsBattleArrowRight {
      right: -12.5px;
      transform: rotate(90deg);
    }

    .sportsSubmissionsBattleArrowLeft {
      left: -12.5px;
      transform: rotate(-90deg);
    }

    .sportsSubmissionsBattleStatusBtn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      transition: 0.1s;
      appearance: none;
      border: none;
      letter-spacing: 0.5px;
      cursor: default;
      user-select: none;
      height: 40px;
      border-radius: 8px;
      font-family: "Geogrotesque Wide", sans-serif;
      font-weight: 800;
      font-style: normal;
      text-transform: uppercase;
      color: rgb(255, 255, 255);
      background: rgba(203, 215, 255, 0.075);
      margin-top: 16px;
      width: 100%;
      flex-direction: column;
      white-space: normal;
      padding: 0 12px;
      font-size: 12px;
    }

    .sportsSubmissionsBattleStatusBtn.hasSelectedAnswer,
    .sportsSubmissionsBattleStatusBtn.isVoidAnswer {
      font-size: 16px;
    }

    .sportsSubmissionsBattleStatusBtn.hasSelectedAnswer {
      background: var(--selected-answer-colour, rgba(203, 215, 255, 0.075));
      box-shadow: none;
    }

    .sportsSubmissionsBattleStatusInner {
      min-width: 0;
      max-width: 100%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      color: #FFFFFF;
    }

    .sportsSubmissionsBattleStatusText {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      color: #FFFFFF;
    }

    .sportsSubmissionsBattleStatusIconWrap {
      width: 16px;
      height: 16px;
      min-width: 16px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #FFFFFF;
      fill: currentColor;
      flex: 0 0 auto;
    }

    .sportsSubmissionsBattleStatusIconWrap .resultIconSvg {
      width: 16px;
      height: 16px;
      display: block;
      color: #FFFFFF;
      fill: currentColor;
    }


    .sportsSubmissionsBattleStatusSub {
      margin-top: 1.5px;
      position: relative;
      bottom: 1.5px;
      text-transform: uppercase;
      font-size: 10px;
      font-family: "Geogrotesque Wide", sans-serif;
      font-weight: 800;
      font-style: italic;
    }

    .sportsSubmissionsPlayersPanel {
      min-width: 0;
      width: 100%;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .sportsSubmissionsPlayersHeader {
      min-height: 40px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      color: #FFFFFF;
      font-size: 16px;
      font-weight: 800;
      text-transform: none;
      letter-spacing: .01em;
    }

    .sportsSubmissionsShareButton {
      display: inline-flex;
      -webkit-box-align: center;
      align-items: center;
      -webkit-box-pack: center;
      justify-content: center;
      white-space: nowrap;
      transition: 0.1s;
      appearance: none;
      border-width: medium;
      border-style: none;
      border-color: currentcolor;
      border-image: initial;
      letter-spacing: 0.5px;
      cursor: default;
      user-select: none;
      height: 24px;
      padding: 0px 8px;
      border-radius: 4px;
      font-family: "Geogrotesque Wide", sans-serif;
      font-weight: 700;
      font-style: normal;
      font-size: 12px;
      text-transform: uppercase;
      color: rgb(255, 255, 255);
      background: rgba(203, 215, 255, 0.075);
    }

    .sportsSubmissionsTableWrap {
      width: 100%;
      min-width: 0;
      overflow: visible;
      border-radius: 0;
      background: transparent;
    }

    .sportsSubmissionsBattleTable {
      --sportsSubmissionsBoardRadius: 4px;
      width: 100%;
      min-width: 620px;
      display: flex;
      flex-direction: column;
      gap: 0;
      padding: 0;
      margin: 0;
      color: #FFFFFF;
      font-family: "Geogrotesque Wide", sans-serif;
      background: transparent;
      border: none;
      box-shadow: none;
      overflow: visible;
    }

    .sportsSubmissionsBattleHeader,
    .sportsSubmissionsBattleRow {
      display: grid;
      grid-template-columns: minmax(0,6%) minmax(0, 34%) minmax(0, 23%) minmax(0, 30%) minmax(0, 12%);
      align-items: center;
      column-gap: 20px;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      box-sizing: border-box;
    }

    .sportsSubmissionsBattleHeader {
      min-height: calc(var(--sideNavButtonHeight) * 0.7427);
      height: calc(var(--sideNavButtonHeight) * 0.7427);
      padding: 0 14.4px;
      border-radius: var(--sportsSubmissionsBoardRadius);
      background: #cbd7ff08;
    }

    .sportsSubmissionsBattleHeadCell {
      min-width: 0;
      color: #686D7B;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: .02em;
      text-transform: uppercase;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      text-align: left;
      line-height: 1.1;
    }

    .sportsSubmissionsBattleHeadCell:nth-child(1),
    .sportsSubmissionsBattleCell:nth-child(1) {
      text-align: center;
      justify-content: center;
    }

    .sportsSubmissionsBattleHeadCell:nth-child(5),
    .sportsSubmissionsBattleCell:nth-child(5) {
      text-align: center;
      justify-content: center;
    }

    .sportsSubmissionsBattleRows {
      display: flex;
      flex-direction: column;
      gap: 4px;
      width: 100%;
      min-width: 0;
      margin-top: 4px;
      overflow: visible;
    }

    .sportsSubmissionsBattleRow {
      min-height: calc(var(--sideNavButtonHeight) * 1.0811);
      height: auto;
      padding: 4px 14.4px;
      border-radius: var(--sportsSubmissionsBoardRadius);
      background: #cbd7ff08;
      border: none;
      box-shadow: none;
      transition: background .12s ease;
    }

    .sportsSubmissionsBattleRow:hover {
      background: #252734;
    }

    .sportsSubmissionsBattleCell {
      min-width: 0;
      color: #FFFFFF;
      font-size: clamp(12px, .9vw, 16px);
      font-weight: 500;
      line-height: 1.15;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      text-align: left;
      display: flex;
      align-items: center;
      justify-content: flex-start;
    }

    .sportsSubmissionsBattleNumberCell {
      color: #FFFFFF;
      font-variant-numeric: tabular-nums;
      font-weight: 500;
    }

    .sportsSubmissionsBattleCell:nth-child(2),
    .sportsSubmissionsBattleCell:nth-child(3),
    .sportsSubmissionsBattleCell:nth-child(4) {
      font-weight: 500;
    }

    .sportsSubmissionsBattleEmpty {
      grid-template-columns: 1fr;
    }

    .sportsSubmissionsBattleEmpty .sportsSubmissionsBattleCell {
      grid-column: 1 / -1;
      justify-content: flex-start;
      text-align: left;
      color: #808696;
      font-weight: 500;
      white-space: normal;
      overflow: visible;
      text-overflow: clip;
    }

    .sportsSubmissionsBattleHeadCell:nth-child(2),
    .sportsSubmissionsBattleHeadCell:nth-child(3) {
      overflow: visible;
      text-overflow: clip;
    }

    .sportsSubmissionsBattleHeadCell:nth-child(2),
    .sportsSubmissionsBattleHeadCell:nth-child(3),
    .sportsSubmissionsBattleHeadCell:nth-child(4),
    .sportsSubmissionsBattleCell:nth-child(2),
    .sportsSubmissionsBattleCell:nth-child(3),
    .sportsSubmissionsBattleCell:nth-child(4) {
      position: relative;
      left: 8%;
    }

    .sportsSubmissionsBattleHeadCellWithIcon {
      display: inline-flex;
      align-items: center;
      gap: 3px;
      min-width: 0;
      max-width: none;
      overflow: visible;
      text-overflow: clip;
      vertical-align: middle;
      transform: translateX(-7px);
    }

    .sportsSubmissionsBattleHeaderIcon,
    .sportsSubmissionsBattleHeaderRollbitIcon {
      width: 22px;
      height: 22px;
      display: block;
      flex: 0 0 22px;
      object-fit: contain;
      user-select: none;
      -webkit-user-drag: none;
    }

    .sportsSubmissionsBattleAnswerCell {
      min-width: 0;
      overflow: hidden;
    }

    .sportsSubmissionsBattleAnswerWithSquare {
      min-width: 0;
      max-width: 100%;
      display: inline-flex;
      align-items: center;
      justify-content: flex-start;
      gap: 6px;
      overflow: hidden;
    }

    .sportsSubmissionsBattleAnswerSquare {
      width: 13.8px;
      height: 13.8px;
      min-width: 13.8px;
      display: block;
      object-fit: contain;
      flex: 0 0 auto;
    }

    .sportsSubmissionsBattleAnswerSquareFallback {
      border-radius: 3px;
      background: rgba(203, 215, 255, 0.075);
    }

    .sportsSubmissionsBattleAnswerText {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .sportsSubmissionsBattleResultCell {
      overflow: visible;
      position: relative;
      z-index: 1;
    }

    .sportsSubmissionsBattleResultCell .resultBtn {
      margin: 0;
      cursor: default;
      pointer-events: none;
      overflow: visible;
    }

    .sportsSubmissionsBattleEmpty {
      min-height: calc(var(--sideNavButtonHeight) * 1.0811);
      height: auto;
    }

    .sportsSubmissionsBattleEmpty .sportsSubmissionsBattleCell {
      color: #808696;
      font-weight: 500;
      text-align: left !important;
      justify-content: flex-start;
      white-space: normal;
    }

    @media (max-width: 980px) {
      .sportsSubmissionsBattlePanel {
        grid-template-columns: 1fr;
        gap: 18px;
      }

      .sportsSubmissionsBattleCard {
        width: 100%;
        max-width: 240px;
      }
    }

    .questionPageEmptySpacer {
      flex: 0 0 auto;
      min-height: 0;
    }

    #sidebarQuestionsBtn .sideNavArrowBox,
    #sidebarQuestionSubGroup {
      display: none !important;
    }


    .rewindYearTabsWrap {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding-bottom: 8.4px;
      gap: 24px;
      box-sizing: border-box;
    }

    .rewindYearTabs {
      flex: 0 1 auto;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 12px;
      white-space: nowrap;
      overflow: auto hidden;
      scrollbar-width: none;
      max-width: 100%;
    }

    .rewindYearTabs::-webkit-scrollbar {
      display: none;
    }

    .rewindYearButton {
      display: flex;
      align-items: center;
      height: 40px;
      min-height: 40px;
      padding: 0 16px;
      border: 0;
      outline: none;
      border-radius: 8px;
      text-transform: uppercase;
      transition: background .1s ease, filter .1s ease;
      font-size: 14px;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: normal;
      user-select: none;
      cursor: pointer;
      background: rgba(203, 215, 255, 0.03);
      color: rgb(177, 182, 198);
      appearance: none;
    }

    .rewindYearButton:hover {
      background: rgba(203, 215, 255, 0.055);
      color: rgb(255, 255, 255);
      filter: none;
    }

    .rewindYearButton.active,
    .rewindYearButton[aria-selected="true"] {
      background: rgba(203, 215, 255, 0.055);
      color: rgb(255, 255, 193);
      text-shadow: rgb(255, 93, 0) 0px 0px 10px;
      cursor: default;
    }

    .rewindYearTitle {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 0 14px;
      padding: 14.4px 20px 18px;
      color: rgb(255, 255, 193);
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: italic !important;
      font-size: clamp(64px, 8.2vw, 128px);
      line-height: 0.9;
      letter-spacing: -0.08em;
      text-transform: uppercase;
      text-align: center;
      text-shadow:
        0 0 2px rgba(255, 247, 210, .42),
        0 0 6px rgba(255, 179, 70, .72),
        0 0 14px rgba(254, 161, 1, .68),
        0 0 28px rgba(235, 95, 25, .60),
        0 0 48px rgba(195, 65, 18, .43),
        0 0 68px rgba(140, 45, 12, .30);
      user-select: none;
      pointer-events: none;
    }

    .rewindExportCapture {
      width: 100%;
      max-width: 100%;
      min-width: 0;
      display: block;
      margin: 0;
      padding: 0;
      background: transparent;
      box-sizing: border-box;
      overflow: visible;
    }

    .rewindCalendarGrid {
      width: 100%;
      max-width: 100%;
      min-width: 0;
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      grid-template-rows: none;
      gap: 10px;
      padding: 0;
      margin: 0;
      box-sizing: border-box;
    }

    /* Rewind month-box content reduced by 10%: month labels, category titles, names, icons, and spacing. */
    .rewindMonthCard {
      min-width: 0;
      width: 100%;
      aspect-ratio: 1 / 1;
      border: 1px solid transparent;
      border-radius: 4px;
      background: var(--tableEvenRow);
      color: #B2B6C4;
      display: flex;
      flex-direction: column;
      align-items: stretch;
      justify-content: flex-start;
      padding: 6.84px 14px 1.71px;
      box-sizing: border-box;
      position: relative;
      overflow: hidden;
      transition: filter .12s ease, box-shadow .12s ease, border-color .12s ease;
    }
.rewindMonthCard.currentUtcMonth {
      border-color: rgb(255, 255, 193);
      box-shadow:
        rgb(255, 252, 57) 0px 0px 1.5px inset,
        rgba(255, 252, 57, .55) 0px 0px 3px inset,
        rgba(255, 93, 0, .92) 0px 0px 6px,
        rgba(254, 161, 1, .36) 0px 0px 12px;
    }

    .rewindMonthCard.currentUtcMonth .rewindMonthName {
      color: rgb(255, 255, 193);
      text-shadow:
        0 0 1.2px rgba(255, 247, 210, .36),
        0 0 2.8px rgba(255, 179, 70, .74),
        0 0 5.6px rgba(254, 161, 1, .72),
        0 0 10.5px rgba(235, 95, 25, .66),
        0 0 17px rgba(195, 65, 18, .50),
        0 0 26px rgba(140, 45, 12, .34);
    }

    .rewindMonthName {
      min-width: 0;
      color: currentColor;
      font-size: clamp(16.2px, 1.89vw, 27px);
      font-weight: 700;
      line-height: 1;
      letter-spacing: -0.045em;
      text-transform: uppercase;
      text-align: center;
      white-space: nowrap;
      position: relative;
      z-index: 1;
      margin-top: 0;
      align-self: center;
      flex: 0 0 auto;
      transform: translateY(-2px);
    }

    .rewindMonthCard.completedUtcMonth:not(.currentUtcMonth):not(.futureUtcMonth) .rewindMonthName {
      color: #FFFFFF;
    }

    .rewindMonthEntries {
      width: 100%;
      min-width: 0;
      min-height: 0;
      flex: 1 1 auto;
      margin-top: 3px;
      padding-bottom: 0;
      display: flex;
      flex-direction: column;
      gap: 6.15px;
      overflow: auto;
      position: relative;
      z-index: 1;
      color: #B2B6C4;
      font-size: 9.9px;
      line-height: 1.25;
      text-align: left;
      scrollbar-width: thin;
      scrollbar-color: rgba(203, 215, 255, .16) transparent;
    }

    .rewindEntry {
      width: 100%;
      min-width: 0;
      padding: 0;
      border-radius: 0;
      background: transparent;
      color: #B2B6C4;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    .rewindEntryLine {
      margin: 0 0 3.6px;
      color: #FFFFFF;
      font-weight: 500;
    }

    .rewindEntryLine:last-child {
      margin-bottom: 0;
    }

    .rewindEntryLine strong {
      color: #FFFFFF;
      font-weight: 500;
    }

    .rewindTallyBlock {
      width: 100%;
      min-width: 0;
      margin: 0 0 5px;
      padding: 3.55px 5px 3.85px 7px;
      display: flex;
      flex-direction: column;
      gap: 0.8px;
      border-radius: 8px;
      border: 1px solid rgba(255, 255, 255, .052);
      background: rgba(255, 255, 255, .052);
      box-shadow: 0 1px 0 rgba(255, 255, 255, .022) inset;
      overflow: hidden;
      transition: background .12s ease, border-color .12s ease;
    }

    .rewindTallyBlock:hover {
      background: rgba(255, 255, 255, .085);
      border-color: rgba(255, 255, 255, .145);
    }

    .rewindTallyTitle {
      color: #FFFFFF;
      font-size: 9.9px;
      font-weight: 700;
      line-height: 1.1;
      letter-spacing: -0.02em;
      text-transform: none;
      margin-bottom: 0.25px;
    }

    .rewindTallyWinnerLine {
      display: flex;
      align-items: center;
      gap: 3.08px;
      min-width: 0;
      color: #FFFFFF;
      font-size: 10.8px;
      font-weight: 600;
      line-height: 1.08;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    .rewindTallyPlaceIcon {
      width: 14.4px;
      height: 14.4px;
      min-width: 14.4px;
      object-fit: contain;
      display: block;
      flex: 0 0 auto;
      user-select: none;
      -webkit-user-drag: none;
    }

    .rewindTallyWinnerName {
      min-width: 0;
      color: #FFFFFF;
      font-weight: 400;
    }

    .rewindFeatureBlock {
      width: 100%;
      min-width: 0;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 0px;
      margin: 0 0 5px;
      padding: 3.55px 5px 3.85px 7px;
      border-radius: 8px;
      border: 1px solid rgba(255, 255, 255, .052);
      background: rgba(255, 255, 255, .052);
      box-shadow: 0 1px 0 rgba(255, 255, 255, .022) inset;
      overflow: hidden;
      transition: background .12s ease, border-color .12s ease;
    }

    .rewindFeatureBlock:hover {
      background: rgba(255, 255, 255, .085);
      border-color: rgba(255, 255, 255, .145);
    }

    .rewindFeatureBlock.mvp {
      background: rgba(255, 182, 198, .072);
      border-color: rgba(255, 182, 198, .098);
    }

    .rewindFeatureBlock.enjoyers {
      background: rgba(41, 217, 109, .066);
      border-color: rgba(41, 217, 109, .098);
    }

    .rewindFeatureBlock.mvp:hover {
      background: rgba(255, 182, 198, .118);
      border-color: rgba(255, 182, 198, .20);
    }

    .rewindFeatureBlock.enjoyers:hover {
      background: rgba(41, 217, 109, .108);
      border-color: rgba(41, 217, 109, .20);
    }

    .rewindFeatureBlock:last-child {
      margin-bottom: 0;
    }

    .rewindDiscordPill {
      max-width: 100%;
      min-width: 0;
      min-height: 0;
      height: auto;
      display: inline-flex;
      align-items: center;
      justify-content: flex-start;
      gap: 3.85px;
      padding: 0;
      border-radius: 0;
      border: 0;
      background: transparent;
      color: #FFFFFF;
      font-family: "gg sans", "ABC Ginto Normal", "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
      box-shadow: none;
      overflow: hidden;
      user-select: text;
      -webkit-user-select: text;
    }

    .rewindDiscordPill.mvp,
    .rewindDiscordPill.enjoyers,
    .rewindDiscordPill.tally {
      background: transparent;
      border-color: transparent;
    }

    .rewindPillDot {
      display: none;
    }

    .rewindPillText {
      min-width: 0;
      color: #FFFFFF;
      font-family: "gg-sans-Semibold", "gg sans", "ABC Ginto Normal", "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
      font-size: 13.5px;
      font-weight: 600;
      line-height: 1.2;
      letter-spacing: -0.02em;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      padding-bottom: 1px;
      user-select: text;
      -webkit-user-select: text;
    }

    .rewindDiscordPill.mvp .rewindPillText {
      color: #ffb6c6;
    }

    .rewindDiscordPill.enjoyers .rewindPillText {
      color: #29d96d;
    }

    .rewindDiscordPill.tally .rewindPillText {
      color: #FFFFFF;
    }

    .rewindPillIcon {
      width: 13.5px;
      height: 13.5px;
      min-width: 13.5px;
      object-fit: contain;
      display: block;
      flex: 0 0 auto;
      user-select: none;
      -webkit-user-drag: none;
    }

    .rewindFeatureValue {
      color: #FFFFFF;
      font-size: 10.8px;
      font-weight: 400;
      line-height: 1.1;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    .rewindFeatureValue.enjoyersValue {
      color: #FFFFFF;
      font-weight: 400;
    }

    .rewindMonthCard.futureUtcMonth {
      filter: grayscale(.45) brightness(.78);
    }

    .rewindMonthCard.futureUtcMonth::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background:
        linear-gradient(135deg, rgba(255, 255, 255, .035) 0 12%, transparent 12% 24%, rgba(255, 255, 255, .025) 24% 36%, transparent 36% 100%);
      opacity: .72;
    }

    .rewindMonthCard.futureUtcMonth .rewindMonthName,
    .rewindMonthCard.futureUtcMonth .rewindMonthEntries {
      opacity: .58;
    }

    .rewindCsvStatus {
      padding: 8px 9px;
      border-radius: 4px;
      background: rgba(15, 17, 26, 0.26);
      color: #B2B6C4;
      font-size: 11px;
      line-height: 1.25;
      font-weight: 500;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    @media (max-width: 760px) {
      .rewindCalendarGrid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: none;
      }

      .rewindYearTitle {
        font-size: clamp(54px, 15vw, 92px);
      }
    }

    @media (max-width: 520px) {
      .rewindCalendarGrid {
        grid-template-columns: 1fr;
      }
    }

    .emojiIcon {
      display: inline-block;
      width: 1em;
      height: 1em;
      vertical-align: -0.12em;
      object-fit: contain;
      user-select: none;
      -webkit-user-drag: none;
    }

    .emojiIcon.rouletteEmojiIcon {
      vertical-align: -0.14em;
    }

    .emojiIcon.sniperEmojiIcon {
      vertical-align: -0.14em;
    }

    .emojiIcon.speedEmojiIcon {
      vertical-align: -0.14em;
    }

    .emojiIcon.syncEmojiIcon {
      vertical-align: -0.14em;
    }

    .emojiIcon.doubleEmojiIcon {
      vertical-align: -0.14em;
    }

    .emojiIcon.penaltyEmojiIcon {
      vertical-align: -0.14em;
    }

    /* Legacy table styling removed. Question, leaderboard, and prizes now use the grid-based board components below. */

    .wrapCell {
      white-space: normal !important;
      overflow: visible !important;
      text-overflow: clip !important;
      word-break: break-word;
      overflow-wrap: anywhere;
      line-height: 1.22;
    }

    .clip {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .msgCell {
      white-space: normal !important;
      overflow: visible !important;
      text-overflow: clip !important;
      word-break: break-all;
      overflow-wrap: anywhere;
      line-height: 1.15;
      font-variant-numeric: tabular-nums;
    }

    .msgStack {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 7px;
      line-height: 1.12;
    }

    .msgIdSmall {
      font-size: .82em;
      color: var(--muted);
      font-weight: 700;
    }

    .msgUtc {
      font-size: 1em;
      font-weight: 400;
      color: var(--muted);
      white-space: nowrap;
      font-family: inherit;
      letter-spacing: 0;
      text-shadow: none;
    }


    .qTimeCell {
      overflow: visible !important;
      white-space: nowrap;
      text-align: right;
    }

    .qTimeWrap {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      min-width: 0;
    }

    .qTimeInfoWrap {
      position: relative;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 auto;
      overflow: visible;
      cursor: default;
    }

    .qTimeInfoIcon {
      width: 15px;
      height: 15px;
      display: block;
      fill: #FFFFFF;
      color: #FFFFFF;
      cursor: default;
      transition: none;
      user-select: none;
    }

    .qTimeInfoWrap:hover .qTimeInfoIcon,
    .qTimeInfoWrap:focus-within .qTimeInfoIcon {
      fill: #FFFFFF;
      color: #FFFFFF;
      filter: none;
    }

    .qTimeTooltip {
      display: none !important;
    }

    .globalInfoTooltip {
      position: fixed;
      left: 0;
      top: 0;
      width: max-content;
      max-width: min(600px, calc(100vw - 26px));
      padding: 16px 20px 18px;
      border-radius: 10px;
      border: none;
      background: #2A2D3A;
      color: #FFFFFF;
      box-shadow: 0 14px 30px rgba(0, 0, 0, .30);
      pointer-events: none;
      opacity: 0;
      visibility: hidden;
      transform: translate3d(-9999px, -9999px, 0);
      z-index: 2147483647;
      text-align: left;
      white-space: normal;
      line-height: 1.55;
      font-weight: 500;
      font-size: 16px;
      letter-spacing: .01em;
      user-select: text;
      -webkit-user-select: text;
    }

    .globalInfoTooltip.visible {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
    }

    .globalInfoTooltip::before {
      content: "";
      position: absolute;
      left: var(--tip-x, 50%);
      transform: translateX(-50%);
      width: 0;
      height: 0;
      border-left: 18px solid transparent;
      border-right: 18px solid transparent;
    }

    .globalInfoTooltip.below::before {
      bottom: 100%;
      border-bottom: 19px solid #2A2D3A;
    }

    .globalInfoTooltip.above::before {
      top: 100%;
      border-top: 19px solid #2A2D3A;
    }

    .globalInfoTooltip .qTimeTooltipTitle {
      display: none;
    }

    .globalInfoTooltip .qTimeTooltipGrid {
      display: grid;
      grid-template-columns: auto auto;
      column-gap: 13px;
      row-gap: 2px;
      align-items: center;
      font-size: 12px;
      line-height: 1.16;
      user-select: text;
      -webkit-user-select: text;
    }

    .globalInfoTooltip .qTimeTooltipGrid> :nth-child(4),
    .globalInfoTooltip .qTimeTooltipGrid> :nth-child(5) {
      margin-top: 7.7px;
    }

    .globalInfoTooltip .qTimeTooltipGrid.lbClockTooltipGrid {
      grid-template-columns: auto auto;
      row-gap: 0;
    }

    .globalInfoTooltip .qTimeTooltipLabel {
      color: #FFFFFF;
      font-weight: 700;
      white-space: nowrap;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      align-self: stretch;
    }

    .globalInfoTooltip .qTimeTooltipGroupLabel {
      grid-row: span 2;
    }

    .globalInfoTooltip .qTimeTooltipValue {
      color: #FFFFFF;
      font-weight: 500;
      font-variant-numeric: tabular-nums;
      word-break: break-all;
      user-select: text;
      -webkit-user-select: text;
    }

    .resultBtn {
      display: inline-flex;
      -webkit-box-align: center;
      align-items: center;
      -webkit-box-pack: center;
      justify-content: center;
      white-space: nowrap;
      appearance: none;
      border-width: medium;
      border-style: none;
      border-color: currentcolor;
      border-image: initial;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      cursor: pointer;
      user-select: none;
      width: 48px;
      height: 34px;
      padding: 0;
      border-radius: 8px;
      font-family: "Geogrotesque Wide", sans-serif;
      font-weight: 800;
      font-style: normal;
      font-size: 14px;
      line-height: 1;
      color: rgb(20, 23, 34);
      background: rgb(134, 244, 84);
      box-shadow:
        rgba(118, 255, 25, 0.4) 0px 0px 10px,
        rgba(255, 255, 255, 0.2) 0px 1px 0px inset,
        rgba(0, 0, 0, 0.15) 0px -3px 0px inset,
        rgb(59, 198, 14) 0px 0px 15px inset;
      transition: filter 0.1s, transform 0.1s;
      margin: 0 auto;
      overflow: visible;
    }

    .resultIconSvg,
    .resultSniperIconSvg {
      width: 20px;
      height: 20px;
      display: block;
      flex: 0 0 auto;
      fill: currentColor;
      color: currentColor;
      pointer-events: none;
    }

    .resultSniperIconSvg {
      stroke: currentColor;
      stroke-width: 0.768;
      overflow: visible;
    }

    .resultSyncIcon {
      width: 20px;
      height: 20px;
      display: block;
      flex: 0 0 auto;
      object-fit: contain;
      pointer-events: none;
      user-select: none;
      -webkit-user-drag: none;
    }

    .syncResultIconWrap {
      position: relative;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 20px;
      height: 20px;
      overflow: visible;
      flex: 0 0 auto;
      pointer-events: none;
    }

    .syncResultGroupBadge {
      position: absolute;
      top: -5px;
      right: -12px;
      min-width: 13px;
      height: 13px;
      padding: 0 3px;
      border-radius: 5px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 11px;
      font-weight: 800;
      line-height: 1;
      letter-spacing: -0.03em;
      font-variant-numeric: tabular-nums;
      z-index: 2;
      pointer-events: none;
      text-shadow: none;
    }

    .resultBtn:hover {
      filter: brightness(1.04);
    }

    .resultBtn:active {
      filter: brightness(.98);
      transform: translateY(0);
    }

    .resultBtn.correct {
      color: rgb(20, 23, 34);
      background: rgb(134, 244, 84);
      box-shadow:
        rgba(118, 255, 25, 0.4) 0px 0px 10px,
        rgba(255, 255, 255, 0.2) 0px 1px 0px inset,
        rgba(0, 0, 0, 0.15) 0px -3px 0px inset,
        rgb(59, 198, 14) 0px 0px 15px inset;
      text-shadow: none;
    }

    .resultBtn.sniperWinner {
      color: rgb(20, 23, 34);
      background: #ffffc1;
      box-shadow:
        rgba(255, 93, 0, 0.58) 0px 0px 10px,
        rgba(255, 120, 35, 0.40) 0px 0px 18px,
        rgba(255, 255, 255, 0.28) 0px 1px 0px inset,
        rgba(0, 0, 0, 0.15) 0px -3px 0px inset,
        rgba(235, 95, 25, 0.54) 0px 0px 15px inset;
      text-shadow: none;
      -webkit-print-color-adjust: exact;
      print-color-adjust: exact;
    }

    .resultBtn.sniperWinner .resultSniperIconSvg,
    .resultBtn.sniperWinner .resultSniperIconSvg path {
      color: rgb(20, 23, 34) !important;
      fill: rgb(20, 23, 34) !important;
      stroke: rgb(20, 23, 34) !important;
    }

    .resultBtn.closestGuessBtn {
      width: 72px;
      padding: 8px 8px;
      font-size: 12px;
      letter-spacing: .15px;
      color: rgba(234, 242, 255, .95);
    }

    .resultBtn.incorrect {
      color: rgb(20, 23, 34);
      background: #ff4949;
      box-shadow:
        rgba(255, 73, 73, 0.4) 0px 0px 10px,
        rgba(255, 255, 255, 0.2) 0px 1px 0px inset,
        rgba(0, 0, 0, 0.15) 0px -3px 0px inset,
        rgb(203, 39, 57) 0px 0px 15px inset;
    }

    .resultBtn.void {
      color: rgb(20, 23, 34);
      background: #737A86;
      box-shadow:
        rgba(115, 122, 134, 0.34) 0px 0px 10px,
        rgba(255, 255, 255, 0.18) 0px 1px 0px inset,
        rgba(0, 0, 0, 0.18) 0px -3px 0px inset,
        rgba(48, 54, 64, 0.62) 0px 0px 15px inset;
      text-shadow: none;
    }

    .resultBtn.void .resultIconSvg,
    .resultBtn.void .resultIconSvg path {
      color: rgb(20, 23, 34) !important;
      fill: rgb(20, 23, 34) !important;
      stroke: none !important;
    }

    .resultBtn.syncResult {
      color: rgb(20, 23, 34);
      background: linear-gradient(180deg, #75A0FF 0%, #5279F1 58%, #456CEB 100%);
      box-shadow:
        rgba(82, 121, 241, 0.44) 0px 0px 10px,
        rgba(255, 255, 255, 0.34) 0px 1px 0px inset,
        rgba(255, 255, 255, 0.14) 0px 2px 5px inset,
        rgba(0, 0, 0, 0.15) 0px -3px 0px inset,
        rgba(31, 70, 203, 0.58) 0px 0px 15px inset;
      text-shadow: none;
    }

    .cellOk {
      color: var(--good);
      font-weight: 700;
    }

    .cellBad {
      color: var(--bad);
      font-weight: 700;
    }

    .lbCellStack {
      display: flex;
      flex-direction: column;
      gap: 4px;
      align-items: center;
      justify-content: center;
      text-align: center;
      min-height: 48px;
      height: auto;
      width: 100%;
      min-width: 0;
    }

    .lbTime {
      font-size: .79em;
      white-space: nowrap;
      line-height: 1;
      min-height: 1em;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      transform: translateY(-1px);
    }

    .lbScoreNum {
      font-size: 1.12em;
      font-weight: 700;
      letter-spacing: .2px;
      line-height: 1.05;
    }

    .lbRandomPrizePlayerWrap {
      display: inline-flex;
      align-items: center;
      position: relative;
      max-width: 100%;
      width: 100%;
      min-width: 0;
      overflow: visible;
    }

    .lbRandomPrizePlayerName {
      color: var(--good) !important;
      font-weight: 700 !important;
      width: auto !important;
      max-width: 100%;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      flex: 0 1 auto;
    }

    .lbRandomPrizePlayerIcon {
      position: absolute;
      left: -1.2em;
      top: 50%;
      width: 16px;
      height: 12px;
      display: block;
      color: var(--good);
      fill: currentColor;
      flex: 0 0 auto;
      pointer-events: none;
      transform: translateY(-45%);
      z-index: 2;
    }

    .lbRandomPrizePlayerIcon .diceVisible {
      fill: currentColor;
    }

    .lbRandomPrizePlayerIcon .diceCutout {
      fill: var(--appBg);
    }

    .leaderboardBoardCell .lbScoreLine {
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      gap: 0.8px;
      min-width: 0;
      line-height: 1.05;
    }

    .lbRandomPrizeQuestionIcon {
      width: 24.4375px;
      height: 18.328125px;
      display: block;
      color: var(--good);
      fill: currentColor;
      flex: 0 0 auto;
      pointer-events: none;
      transform: translateY(0.5px);
      margin-right: -3px;
    }

    .lbRandomPrizeQuestionIcon .diceVisible {
      fill: currentColor;
    }

    .lbRandomPrizeQuestionIcon .diceCutout {
      fill: var(--appBg);
    }

    .leaderboardBoardCell .lbCellStack.lbRandomPrizeQuestion .lbClockValue,
    .leaderboardBoardCell .lbCellStack.lbRandomPrizeQuestion .lbScoreNum {
      color: var(--good) !important;
    }

    .rankCell {
      padding-left: 8px;
      padding-right: 8px;
    }

    .rankStack {
      display: flex;
      flex-direction: column;
      padding-top: 0;
      align-items: flex-start;
      justify-content: center;
      gap: 0px;
      min-height: 100%;
      width: 100%;
    }

    .rankOrdinal {
      display: inline-flex;
      align-items: flex-start;
      justify-content: center;
      gap: 1px;
      font-weight: 700;
      letter-spacing: .15px;
      line-height: 1;
      text-shadow: 0 1px 0 rgba(0, 0, 0, .22);
      white-space: nowrap;
    }

    .rankOrdinalNum {
      font-size: 1.2em;
      line-height: 1;
    }

    .rankOrdinalSuffix {
      font-size: .8em;
      line-height: 1;
      vertical-align: super;
      position: relative;
      top: -.15em;
      text-transform: lowercase;
    }

    .rankOrdinal.rank1 {
      color: var(--gold);
    }

    .rankOrdinal.rank2 {
      color: var(--silver);
    }

    .rankOrdinal.rank3 {
      color: #e0b28f;
    }

    .rankOrdinal.rank4,
    .rankOrdinal.rank5,
    .rankOrdinal.rank6,
    .rankOrdinal.rank7,
    .rankOrdinal.rank8,
    .rankOrdinal.rank9,
    .rankOrdinal.rank10 {
      color: rgba(234, 242, 255, .96);
    }

    .winnerTeamCell {
      width: 100%;
      height: 100%;
      margin: 0;
      max-width: none;

      padding: 10px 8px;
      /* slightly bigger for presence */

      border-radius: 12px;

      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 6px;

      border: 1px solid rgba(255, 255, 255, .20);
      background: rgba(255, 255, 255, .08);
    }

    .winnerTeamCell.firstPlace {
      border-color: rgba(255, 215, 100, .62);
      background: rgba(255, 215, 100, .3);
    }

    .winnerTeamCell.secondPlace {
      border-color: rgba(215, 221, 232, .58);
      background: rgba(215, 221, 232, .26);
    }

    .winnerTeamCell.thirdPlace {
      border-color: rgba(205, 139, 90, .62);
      background: rgba(205, 139, 90, .26);
    }

    .winnerTopLine {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      font-weight: 700;
      font-size: 15px;
      letter-spacing: .25px;
      line-height: 1.05;
      max-width: 100%;
      text-shadow: 0 1px 0 rgba(0, 0, 0, .25);
      flex-wrap: nowrap;
    }

    .winnerTeamCell.firstPlace .winnerTopLine {
      color: var(--gold);
    }

    .winnerTeamCell.secondPlace .winnerTopLine {
      color: var(--silver);
    }

    .winnerTeamCell.thirdPlace .winnerTopLine {
      color: #e0b28f;
    }

    .winnerTopLine span {
      max-width: 140px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .podiumMedal {
      font-size: 18px;
      line-height: 1;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 auto;
      transform: translateY(-1px);
    }

    .lbTotalScore {
      color: rgba(234, 242, 255, .96);
      font-weight: 700;
      text-shadow: 0 1px 0 rgba(0, 0, 0, .25);
      letter-spacing: .2px;
      font-size: 1.16em;
    }

    .winnerRow .lbTotalScore {
      color: var(--gold);
    }

    .secondRow .lbTotalScore {
      color: var(--silver);
    }

    .thirdRow .lbTotalScore {
      color: #e0b28f;
    }

    .lbTotalScore.negative,
    .winnerRow .lbTotalScore.negative,
    .secondRow .lbTotalScore.negative,
    .thirdRow .lbTotalScore.negative {
      color: var(--bad);
    }

    .qScoreNum {
      color: #FFFFFF;
      font-weight: 700;
      font-size: 1.12em;
      letter-spacing: .2px;
      line-height: 1.05;
    }

    .qScoreNum.leading {
      color: var(--good);
      text-shadow: 0 1px 0 rgba(0, 0, 0, .25);
    }

    .qRouletteCell {
      text-align: center;
      padding: 6px 4px !important;
      position: relative;
      overflow: visible;
    }

    .qRouletteValue {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 42px;
      height: 42px;
      min-width: 42px;
      min-height: 42px;
      border-radius: 50%;
      font-size: 16px;
      font-weight: 700;
      letter-spacing: .2px;
      line-height: 1;
      vertical-align: middle;
      color: rgba(255, 255, 255, .98);
      text-shadow: 0 1px 1px rgba(0, 0, 0, .35);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 2px 6px rgba(0, 0, 0, .18);
    }

    .qRouletteCell.rouletteRed .qRouletteValue {
      background: var(--bad);
    }

    .qRouletteCell.rouletteBlack .qRouletteValue {
      background: #000000;
    }

    .qRouletteCell.rouletteGreen .qRouletteValue {
      background: var(--good);
      color: #000000;
    }

    .tableHeaderRouletteIcon {
      width: 2.1em;
      height: 2.1em;
      vertical-align: middle;
    }

    .toggle {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      user-select: none;
      min-height: 40px;
    }

    .toggleLabel {
      font-weight: 700;
      font-size: 11px;
      letter-spacing: .15px;
      color: rgb(255, 255, 255);
      white-space: nowrap;
    }

    .switch {
      position: relative;
      width: 44px;
      height: 26px;
      border-radius: 999px;
      background: rgba(255, 255, 255, .10);
      border: 1px solid rgba(255, 255, 255, .18);
      cursor: pointer;
      flex: 0 0 auto;
    }

    .switch input {
      position: absolute;
      inset: 0;
      opacity: 0;
      cursor: pointer;
      margin: 0;
    }

    .knob {
      position: absolute;
      top: 3px;
      left: 3px;
      width: 20px;
      height: 20px;
      border-radius: 999px;
      background: rgba(234, 242, 255, .92);
      transition: transform .14s ease, background .14s ease;
    }

    .switch input:checked+.knob {
      transform: translateX(18px);
      background: rgba(255, 255, 200, .98);
    }

    .switchOn {
      border-color: rgba(255, 255, 200, .28);
      background: rgba(255, 255, 200, .10);
    }

    .teamStack {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 6px;
      min-height: 62px;
      line-height: 1.12;
      width: 100%;
    }

    .teamTopRow {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 7px;
      width: 100%;
      min-width: 0;
    }

    .teamNameLine {
      font-size: 15px;
      font-weight: 700;
      letter-spacing: .1px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      max-width: 100%;
      min-width: 0;
    }

    .teamPlayersBlock {
      width: 100%;
      min-height: 0;
      display: block;
    }

    .teamPlayersText {
      width: 100%;
      font-size: 12px;
      color: rgb(255, 255, 255);
      font-weight: 500;
      text-align: center;
      white-space: normal;
      overflow: visible;
      text-overflow: clip;
      line-height: 1.3;
      word-break: break-word;
      overflow-wrap: anywhere;
    }

    .teamPlayersText.placeholder {
      visibility: hidden;
      pointer-events: none;
      user-select: none;
      line-height: 1;
    }

    .teamPosBubble {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      white-space: nowrap;
      appearance: none;
      min-width: 34px;
      height: 24px;
      padding: 0 10px;
      border-radius: 8px;
      border: none;
      text-transform: uppercase;
      background: rgba(255, 255, 255, .08);
      color: #FFFFFF;
      font-size: 11.5px;
      font-weight: 800;
      font-style: normal;
      letter-spacing: .35px;
      line-height: 1;
      flex: 0 0 auto;
      text-shadow: none;
      user-select: text;
      -webkit-user-select: text;
      cursor: text;
      transition: .1s;
    }

    .teamPosBubble *,
    .teamPosBubbleMain,
    .teamPosBubbleScore,
    .teamPosBubbleTime {
      user-select: text;
      -webkit-user-select: text;
      cursor: text;
    }

    .teamPosBubble.leader {
      color: rgb(20, 23, 34);
      background: rgb(255, 232, 26);
      box-shadow:
        rgba(255, 176, 25, 0.4) 0px 0px 10px,
        rgba(255, 255, 255, 0.2) 0px 1px 0px inset,
        rgba(0, 0, 0, 0.15) 0px -3px 0px inset,
        rgb(255, 135, 25) 0px 0px 12px inset;
    }

    .teamPosBubble.second {
      color: rgba(24, 28, 36, .96);
      background: rgba(215, 221, 232, .96);
      box-shadow:
        rgba(215, 221, 232, .26) 0px 0px 8px,
        rgba(255, 255, 255, 0.2) 0px 1px 0px inset,
        rgba(0, 0, 0, 0.15) 0px -3px 0px inset,
        rgba(255, 255, 255, .16) 0px 0px 10px inset;
    }

    .teamPosBubble.third {
      color: rgba(24, 28, 36, .96);
      background: rgba(205, 139, 90, .94);
      box-shadow:
        rgba(205, 139, 90, .24) 0px 0px 8px,
        rgba(255, 255, 255, 0.16) 0px 1px 0px inset,
        rgba(0, 0, 0, 0.15) 0px -3px 0px inset,
        rgba(120, 58, 24, .20) 0px 0px 10px inset;
    }

    .lbLegend {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      align-items: center;
      justify-content: flex-start;
      margin-bottom: 0;
    }

    .lbLegend.compact {
      gap: 5px;
      align-items: center;
    }

    .lbLegendTitle {
      font-weight: 700;
      font-size: 11px;
      letter-spacing: .25px;
      color: rgb(255, 255, 255);
      margin-right: 4px;
      white-space: nowrap;
    }

    .lbLegendPill {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 5px 9px;
      border-radius: 999px;
      border: 1px solid rgba(255, 255, 255, .14);
      background: rgba(255, 255, 255, .06);
      color: rgb(255, 255, 255);
      font-weight: 700;
      font-size: 11px;
      letter-spacing: .15px;
      user-select: none;
      white-space: nowrap;
    }

    .lbLegend.compact .lbLegendPill {
      padding: 4px 8px;
      font-size: 14px;
      gap: 5px;
      border-color: rgba(255, 221, 132, .26);
      background: rgba(255, 221, 132, .14);
      color: rgba(255, 248, 226, .99);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
    }

    .glitchLegendMeta .lbLegend.compact .lbLegendPill .emojiIcon,
    .glitchLegendMeta .lbLegend.compact .lbLegendPill .rouletteEmojiIcon {
      width: .9em;
      height: .9em;
    }

    .lbQHead {
      cursor: pointer;
      user-select: none;
      position: sticky;
    }

    .lbQHead:hover {
      filter: brightness(1.06);
      box-shadow: inset 0 -2px 0 rgba(255, 215, 100, .22);
    }

    .lbQHead.activeCut {
      box-shadow: inset 0 -2px 0 rgba(255, 215, 100, .62), inset 0 0 0 1px rgba(255, 215, 100, .12);
    }

    .lbQHead.redactedHead {
      color: rgb(255, 255, 255);
      filter: saturate(.9);
    }

    .lbHeadEmoji {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin-left: 1.3px;
      font-weight: 700;
      letter-spacing: 0;
      text-transform: none;
      color: rgba(234, 242, 255, .97);
      opacity: 1;
      filter: none;
      line-height: 1;
      transform: translateY(2px) scale(1.15);
      transform-origin: center center;
    }

    .lbHeadEmoji .emojiIcon {
      width: 1em;
      height: 1em;
    }

    .lbRedactBlock {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 2px;
      width: 100%;
      min-width: 0;
      max-width: 100%;
      height: 56px;
      min-height: 48px;
      max-height: 56px;
      padding: 4px 6px;
      border-radius: 14px;
      border: 1px solid rgba(255, 215, 100, .18);
      background:
        linear-gradient(135deg, rgba(255, 215, 100, .10), rgba(255, 255, 255, .03)),
        repeating-linear-gradient(-35deg,
          rgba(255, 255, 255, .04) 0 10px,
          rgba(255, 255, 255, .01) 10px 20px);
      box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .10);
      overflow: hidden;
      box-sizing: border-box;
      line-height: 1;
    }

    .lbRedactBlock::before {
      content: "???";
      position: absolute;
      left: 6px;
      bottom: 4px;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 1px;
      color: rgba(255, 215, 100, .18);
      pointer-events: none;
      line-height: 1;
    }

    .lbRedactBlock::after {
      content: "???";
      position: absolute;
      top: 4px;
      right: 6px;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 1px;
      color: rgba(255, 215, 100, .18);
      pointer-events: none;
      line-height: 1;
    }

    .lbRedactMystery {
      font-size: 18px;
      font-weight: 700;
      line-height: 1;
      letter-spacing: 1px;
      color: rgba(255, 215, 100, .92);
      text-shadow: 0 1px 0 rgba(0, 0, 0, .28);
    }

    .lbRedactLabel {
      font-size: 9px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .9px;
      color: rgb(255, 255, 255);
      line-height: 1;
    }

    .lbExportBtn {
      height: 40px;
      padding: 9px 12px;
      border-radius: 14px;
      border: 1px solid rgba(255, 73, 73, .35);
      background: rgba(255, 73, 73, .14);
      color: rgb(255, 255, 255);
      font-weight: 700;
      letter-spacing: .2px;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      transition: filter .12s ease, background .12s ease, border-color .12s ease;
      user-select: none;
      white-space: nowrap;
    }

    .lbExportBtn:hover {
      filter: brightness(1.06);
      border-color: rgba(255, 73, 73, .55);
      background: rgba(255, 73, 73, .18);
    }

    .lbExportBtn:disabled,
    .qExportBtn:disabled {
      opacity: .55;
      cursor: not-allowed;
    }

    .qExportBtn {
      height: 40px;
      padding: 9px 12px;
      border-radius: 14px;
      border: 1px solid rgba(255, 215, 100, .35);
      background: rgba(255, 215, 100, .13);
      color: rgb(255, 255, 255);
      font-weight: 700;
      letter-spacing: .2px;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      transition: filter .12s ease, background .12s ease, border-color .12s ease;
      user-select: none;
      white-space: nowrap;
    }

    .qExportBtn:hover {
      filter: brightness(1.06);
      border-color: rgba(255, 215, 100, .55);
      background: rgba(255, 215, 100, .18);
    }


    .eventSetupExportActions {
      display: flex;
      align-items: stretch;
      justify-content: flex-start;
      gap: 10px;
      margin-top: 2px;
      width: calc((100% - 12px) / 3);
      min-width: 0;
    }

    .eventSetupExportActions .questionExportPlaceholderBox {
      width: 100%;
      min-width: 0;
      min-height: calc((var(--questionPageButtonHeight) * 3) - 32px);
      display: flex;
    }

    .eventSetupExportCsvBtn {
      width: 100%;
      min-width: 0;
      min-height: 100%;
      text-transform: none;
    }

    .eventSetupDailyStandingsExportBox {
      width: calc((100% - 12px) / 3);
      min-width: 0;
      min-height: calc((var(--questionPageButtonHeight) * 3) - 32px);
      display: flex;
    }

    .eventSetupDailyStandingsExportBox .questionExportCsvButton {
      width: 100%;
      min-width: 0;
      min-height: 100%;
    }

    .questionExportPlaceholderBox.sportsSubmissionsAnswerExportBox {
      width: calc((100% - 12px) / 3);
      min-width: 0;
      max-width: calc((100% - 12px) / 3);
      min-height: calc((var(--questionPageButtonHeight) * 3) - 32px);
      display: flex;
      flex: 0 0 calc((100% - 12px) / 3);
    }

    .questionExportPlaceholderBox.sportsSubmissionsAnswerExportBox .questionExportCsvButton {
      width: 100%;
      min-width: 0;
      min-height: 100%;
    }

    .questionExportPlaceholderBox.sportsSubmissionsAnswerExportBox .loadedImportReadyContent {
      align-items: center;
      width: 100%;
      min-width: 0;
    }

    .questionExportPlaceholderBox.sportsSubmissionsAnswerExportBox .headerImportTextStack {
      min-width: 0;
      overflow: visible;
    }

    .questionExportPlaceholderBox.sportsSubmissionsAnswerExportBox .questionExportCsvHint {
      white-space: normal;
      overflow-wrap: anywhere;
    }

    @media (max-width: 900px) {
      .eventSetupDailyStandingsExportBox,
      .sportsSubmissionsAnswerExportBox,
      .questionExportPlaceholderBox.sportsSubmissionsAnswerExportBox {
        width: 100%;
        max-width: 100%;
        flex-basis: 100%;
      }
    }


    .eventSetupTimestampPanel {
      width: 100%;
      max-width: none;
      border-radius: 0;
      background: transparent;
      border: none;
      padding: 0 0 10px;
      display: flex;
      flex-direction: column;
      gap: 0;
      margin-top: 2px;
      overflow: visible;
    }

    .eventSetupTimestampTable {
      width: 100%;
      border-collapse: separate;
      border-spacing: 0 4px;
      table-layout: fixed;
      background: transparent;
    }

    .eventSetupTimestampTable th:nth-child(1),
    .eventSetupTimestampTable td:nth-child(1) {
      width: 26.66%;
    }

    .eventSetupTimestampTable th:nth-child(2),
    .eventSetupTimestampTable th:nth-child(3),
    .eventSetupTimestampTable td:nth-child(2),
    .eventSetupTimestampTable td:nth-child(3) {
      width: 36.67%;
    }

    .eventSetupTimestampTable th,
    .eventSetupTimestampTable td {
      height: calc(var(--sideNavButtonHeight) * 1.3514);
      padding: 7px 24px;
      border: none;
      background: #cbd7ff08;
      color: #FFFFFF;
      font-size: 14px;
      line-height: 1.15;
      font-weight: 500;
      vertical-align: middle;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .eventSetupTimestampTable thead th {
      height: calc(var(--sideNavButtonHeight) * 0.8738);
      min-height: calc(var(--sideNavButtonHeight) * 0.8738);
      padding: 0 24px;
      color: #686D7B;
      font-size: clamp(12px, .85vw, 16px);
      font-weight: 600;
      letter-spacing: .02em;
      line-height: 1.1;
      text-transform: uppercase;
    }

    .eventSetupTimestampTable th:first-child,
    .eventSetupTimestampTable td:first-child {
      border-top-left-radius: 4px;
      border-bottom-left-radius: 4px;
    }

    .eventSetupTimestampTable th:last-child,
    .eventSetupTimestampTable td:last-child {
      border-top-right-radius: 4px;
      border-bottom-right-radius: 4px;
    }

    .eventSetupTimestampTable thead th:first-child,
    .eventSetupTimestampTable tbody th {
      text-align: left;
    }

    .eventSetupTimestampTable thead th:nth-child(2),
    .eventSetupTimestampTable thead th:nth-child(3),
    .eventSetupTimestampTable tbody td:nth-child(2),
    .eventSetupTimestampTable tbody td:nth-child(3) {
      text-align: right;
    }

    .eventSetupTimestampTable tbody th {
      color: #FFFFFF;
      font-weight: 600;
    }

    .eventSetupTimestampTable tbody tr:hover th,
    .eventSetupTimestampTable tbody tr:hover td {
      background: #252734;
    }

    .eventSetupTimestampInput,
    .eventSetupTimestampOutput {
      width: 100%;
      min-width: 0;
      height: 34px;
      border: 1px solid rgba(255, 255, 255, 0.09);
      outline: none;
      border-radius: 7px;
      background: rgba(15, 17, 26, 0.35);
      color: #FFFFFF;
      padding: 0 10px;
      font-size: 13px;
      font-weight: 600;
      letter-spacing: .1px;
      text-align: right;
    }

    .eventSetupTimestampInput:focus,
    .eventSetupTimestampOutput:focus {
      border-color: rgba(255, 255, 193, .55);
      box-shadow: rgb(255, 252, 57) 0px 0px 1px inset, rgba(255, 93, 0, .7) 0px 0px 4px;
    }

    .eventSetupTimestampInput::-webkit-calendar-picker-indicator {
      filter: invert(1);
      opacity: .72;
      cursor: pointer;
    }

    .eventSetupTimestampOutput {
      position: absolute;
      left: -9999px;
      width: 1px;
      height: 1px;
      opacity: 0;
      pointer-events: none;
    }

    .eventSetupTimestampCopyRow {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      min-width: 0;
      margin-top: 6px;
      padding-bottom: 8px;
      overflow: visible;
    }

    .eventSetupCopyTimestampBtn {
      display: inline-flex;
      -webkit-box-align: center;
      align-items: center;
      -webkit-box-pack: center;
      justify-content: center;
      white-space: nowrap;
      transition: background .1s ease, filter .1s ease, min-width .1s ease;
      appearance: none;
      border-width: medium;
      border-style: none;
      border-color: currentcolor;
      border-image: initial;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      cursor: pointer;
      user-select: none;
      height: 30px;
      padding: 0px;
      border-radius: 6px;
      font-family: "Geogrotesque Wide", sans-serif;
      font-weight: 700;
      font-style: normal;
      font-size: 13px;
      color: rgb(20, 23, 34);
      background: rgb(255, 232, 26);
      box-shadow: rgba(255, 176, 25, 0.4) 0px 0px 10px, rgba(255, 255, 255, 0.2) 0px 1px 0px inset, rgba(0, 0, 0, 0.15) 0px -3px 0px inset, rgb(255, 135, 25) 0px 0px 9px inset;
      min-width: 135px;
      flex: 0 0 auto;
    }

    .eventSetupTimestampCopyText {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 135px;
      min-width: 135px;
      max-width: 135px;
      height: 100%;
      line-height: 1;
      pointer-events: none;
    }

    .eventSetupCopyTimestampBtn.copiedState {
      min-width: 143px;
    }

    .eventSetupCopyTimestampBtn:hover {
      filter: brightness(1.04);
    }

    .eventSetupCopyTimestampBtn:active {
      transform: none;
    }

    .eventSetupCopyTimestampBtn:disabled,
    .eventSetupCopyTimestampBtn:disabled:hover {
      cursor: not-allowed;
      filter: grayscale(.25) brightness(.78);
      opacity: .62;
      transform: none;
    }

    @media (max-width: 720px) {
      .eventSetupTimestampTable {
        min-width: 680px;
      }

      .eventSetupTimestampPanel {
        overflow-x: auto;
      }

      .eventSetupTimestampCopyRow {
        justify-content: stretch;
      }

      .eventSetupCopyTimestampBtn {
        width: 100%;
      }
    }

    @media (max-width: 900px) {
      .eventSetupExportActions {
        width: 100%;
      }
    }

    .viewHidden {
      display: none !important;
    }

    .exporting * {
      animation: none !important;
      transition: none !important;
      caret-color: transparent !important;
    }

    .exporting table {
      box-shadow: none !important;
    }

    .exporting .exportCapture {
      overflow: visible !important;
      display: inline-block !important;
      padding: 25px !important;
      background: var(--appBg) !important;
      border-radius: 18px !important;
    }

    .exporting .noPngExport {
      display: none !important;
      visibility: hidden !important;
    }

    .exportCapture {
      overflow: visible !important;
    }

    .modalBackdrop {
      position: fixed;
      inset: 0;
      background: radial-gradient(circle at top, rgba(41, 48, 69, .30), rgba(0, 0, 0, .78));
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px;
      z-index: 50000;
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
    }

    .modalCard {
      width: min(1060px, 96vw);
      max-height: min(86vh, 920px);
      display: flex;
      flex-direction: column;
      background:
        linear-gradient(180deg, rgba(36, 39, 53, .985), rgba(23, 25, 34, .985));
      border: 1px solid rgba(255, 255, 255, .16);
      border-radius: 24px;
      box-shadow: 0 30px 90px rgba(0, 0, 0, .62);
      overflow: hidden;
    }

    #settingsModal .modalCard {
      height: min(86vh, 920px);
    }

    .modalHead {
      padding: 18px 22px;
      border-bottom: 1px solid rgba(255, 255, 255, .10);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      background: linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .03));
      flex: 0 0 auto;
    }

    .modalTitle {
      font-weight: 700;
      letter-spacing: .2px;
      display: inline-flex;
      gap: 12px;
      align-items: center;
      font-size: 18px;
      min-width: 0;
      flex: 1 1 auto;
    }

    .modalHeadActions {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      flex: 0 0 auto;
    }

    .modalBody {
      padding: 18px 22px 22px;
      display: block;
      background: linear-gradient(180deg, rgba(20, 22, 30, .96), rgba(16, 18, 26, .94));
      overflow: hidden;
      flex: 1 1 auto;
      min-height: 0;
    }

    .settingsPage {
      display: none;
      height: 100%;
    }

    .settingsPage.active {
      display: grid;
      align-content: start;
      gap: 14px;
      min-height: 100%;
    }

    .settingsPageHead {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      margin-bottom: 2px;
    }

    .settingsPageTitleWrap {
      display: grid;
      gap: 4px;
      min-width: 0;
      flex: 1 1 auto;
    }

    .settingsPageResetBtn {
      flex: 0 0 auto;
      align-self: flex-start;
      border-color: rgba(255, 73, 73, .40);
      background: rgba(255, 73, 73, .16);
      color: rgba(255, 238, 241, .98);
    }

    .settingsPageResetBtn:hover {
      border-color: rgba(255, 73, 73, .62);
      background: rgba(255, 73, 73, .24);
      color: rgba(255, 245, 247, .99);
    }

    .settingsPageResetBtn:active {
      border-color: rgba(255, 73, 73, .72);
      background: rgba(255, 73, 73, .30);
    }

    .settingsHeaderResetBtn {
      display: none;
    }

    .settingsHeaderResetBtn.show {
      display: inline-flex;
      font-size: 1rem;
    }

    .settingsPageKicker {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .8px;
      text-transform: uppercase;
      color: rgba(255, 226, 139, .88);
    }

    .settingsPageTitle {
      font-size: 20px;
      font-weight: 700;
      letter-spacing: .2px;
      color: rgba(255, 247, 219, .98);
      line-height: 1.1;
    }

    .settingsPageSubtext {
      font-size: 12px;
      color: rgba(234, 242, 255, .82);
      line-height: 1.38;
      max-width: 72ch;
    }

    .settingsHomeGrid {
      display: grid;
      grid-template-columns: repeat(2, minmax(150px, 190px));
      gap: 12px;
      align-items: stretch;
      justify-content: start;
    }

    .settingsNavCard {
      min-height: 118px;
      border-radius: 20px;
      border: 1px solid rgba(255, 255, 255, .13);
      background:
        radial-gradient(circle at top left, rgba(255, 226, 139, .22), transparent 58%),
        linear-gradient(180deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, .045));
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .05),
        0 16px 34px rgba(0, 0, 0, .18);
      padding: 14px 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      cursor: pointer;
      transition: transform .12s ease, border-color .12s ease, background .12s ease, filter .12s ease, box-shadow .12s ease;
    }

    .settingsNavCard:hover {
      transform: translateY(-2px) scale(1.01);
      border-color: rgba(255, 226, 139, .38);
      background:
        radial-gradient(circle at top left, rgba(255, 226, 139, .28), transparent 58%),
        linear-gradient(180deg, rgba(255, 241, 186, .16), rgba(255, 255, 255, .06));
      filter: brightness(1.03);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .06),
        0 18px 38px rgba(0, 0, 0, .22);
    }

    .settingsNavInner {
      display: grid;
      justify-items: center;
      gap: 8px;
    }

    .settingsNavEmoji {
      font-size: 28px;
      line-height: 1;
      filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .22));
    }

    .settingsNavTitle {
      font-size: 15px;
      font-weight: 700;
      color: rgba(255, 247, 219, .98);
      letter-spacing: .2px;
      line-height: 1.16;
    }

    .settingsBackBtn {
      min-width: 118px;
      height: 40px;
      padding: 0 14px;
      border-radius: 14px;
      border: 1px solid rgba(255, 255, 255, .16);
      background: rgba(255, 255, 255, .08);
      color: rgba(234, 242, 255, .95);
      font-weight: 700;
      letter-spacing: .2px;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      transition: background .12s ease, border-color .12s ease, filter .12s ease;
      white-space: nowrap;
    }

    .settingsBackBtn:hover {
      background: rgba(255, 255, 255, .12);
      border-color: rgba(255, 255, 255, .26);
      filter: brightness(1.03);
    }

    .settingsCompactGrid {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 12px;
    }

    .fieldRow {
      display: grid;
      grid-template-columns: 1fr;
      gap: 10px;
      padding: 14px;
      border-radius: 18px;
      border: 1px solid rgba(255, 255, 255, .11);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .045));
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
    }

    .fieldLabel {
      font-weight: 700;
      letter-spacing: .18px;
      font-size: 13px;
      color: rgb(255, 255, 255);
    }

    .fieldHelp {
      font-size: 11px;
      color: rgba(234, 242, 255, .82);
      line-height: 1.36;
      max-width: 78ch;
    }

    .fieldControls {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
      align-items: center;
    }

    .settingsControlCluster {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
      gap: 10px;
      width: 100%;
      align-items: end;
    }

    .numInput {
      height: 38px;
      width: 120px;
      border-radius: 14px;
      border: 1px solid rgba(255, 255, 255, .16);
      background: rgba(255, 255, 255, .10);
      color: rgba(234, 242, 255, .95);
      padding: 0 12px;
      font-weight: 700;
      outline: none;
    }

    .numInput:focus {
      border-color: rgba(255, 255, 200, .30);
      box-shadow: 0 0 0 1px rgba(255, 255, 200, .14) inset, 0 0 12px rgba(255, 255, 200, .10);
    }

    .pillMini {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      height: 26px;
      padding: 0 10px;
      border-radius: 999px;
      border: 1px solid rgba(255, 255, 255, .14);
      background: rgba(255, 255, 255, .08);
      color: rgb(255, 255, 255);
      font-weight: 700;
      font-size: 11px;
      letter-spacing: .15px;
      user-select: none;
      white-space: nowrap;
    }

    .modalFoot {
      padding: 16px 22px 18px;
      border-top: 1px solid rgba(255, 255, 255, .10);
      display: flex;
      gap: 10px;
      justify-content: flex-end;
      background: linear-gradient(180deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .03));
      flex: 0 0 auto;
    }

    .modalCloseX {
      width: 38px;
      height: 38px;
      border-radius: 14px;
      border: 1px solid rgba(255, 255, 255, .14);
      background: rgba(255, 255, 255, .08);
      color: rgb(255, 255, 255);
      cursor: pointer;
      font-weight: 700;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }

    .modalCloseX:hover {
      background: rgba(255, 255, 255, .12);
      border-color: rgba(255, 255, 255, .22);
    }


    .prizeModeRow {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
      width: 100%;
    }

    .segBtn {
      min-height: 44px;
      padding: 10px 12px;
      border-radius: 14px;
      border: 1px solid rgba(255, 255, 255, .16);
      background: rgba(255, 255, 255, .08);
      color: rgb(255, 255, 255);
      font-weight: 700;
      cursor: pointer;
      transition: background .12s ease, border-color .12s ease, filter .12s ease;
    }

    .segBtn:hover {
      background: rgba(255, 255, 255, .12);
      border-color: rgba(255, 255, 255, .26);
      filter: brightness(1.03);
    }

    .segBtn.active {
      background: rgba(255, 215, 100, .18);
      border-color: rgba(255, 215, 100, .45);
      color: rgba(255, 247, 219, .98);
      box-shadow: inset 0 0 0 1px rgba(255, 247, 220, .08);
    }

    .allocGrid {
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      gap: 4px;
      width: 100%;
    }

    .allocCard {
      display: grid;
      gap: 6px;
      min-width: 0;
    }

    .allocCardLabel {
      font-size: 11px;
      font-weight: 700;
      color: rgb(255, 255, 255);
      letter-spacing: .15px;
      text-align: center;
    }

    .allocCard .numInput {
      width: 100%;
      text-align: center;
    }

    @media (max-width: 860px) {
      .modalCard {
        width: min(96vw, 820px);
        max-height: 92vh;
      }

      .settingsHomeGrid {
        grid-template-columns: 1fr;
      }

      .allocGrid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    @media (max-width: 560px) {
      .modalBackdrop {
        padding: 12px;
      }

      .modalHead,
      .modalBody,
      .modalFoot {
        padding-left: 14px;
        padding-right: 14px;
      }

      .settingsPageHead {
        align-items: flex-start;
        flex-direction: column;
      }

      .allocGrid,
      .settingsControlCluster {
        grid-template-columns: 1fr;
      }

      .modalFoot {
        justify-content: stretch;
      }

      .modalFoot .btn {
        flex: 1 1 0;
      }
    }

    .sumPillWarn {
      border-color: rgba(255, 73, 73, .40);
      background: rgba(255, 73, 73, .14);
      color: rgba(255, 219, 223, .96);
    }

    .teamPrizeLine {
      width: 100%;
      display: flex;
      justify-content: center;
      margin-top: 0;
      text-align: center;
    }

    .teamPrizePill {
      position: relative;
      width: 72px;
      height: 48px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border: none;
      background: transparent;
      box-shadow: none;
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
      overflow: visible;
      isolation: isolate;
    }

    .teamPrizeEmoji {
      position: absolute;
      inset: 50% auto auto 50%;
      transform: translate(-49%, -45%);
      font-size: 51px;
      line-height: 1;
      opacity: .4;
      filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .18));
      flex: 0 0 auto;
      pointer-events: none;
      user-select: none;
      z-index: 1;
    }

    .teamPrizeAmount {
      position: relative;
      z-index: 2;
      font-size: 15px;
      font-weight: 700;
      line-height: 1;
      letter-spacing: .2px;
      color: #00ff0d;
      text-shadow: 0 1px 0 rgba(0, 0, 0, .90);
      white-space: nowrap;
    }


    .fastPrizeCell {
      border-radius: 0;
      padding: 0;
      border: 0;
      background: transparent;
      box-shadow: none;
    }

    .fastPrizeLine {
      font-size: 10px;
      font-weight: 700;
      color: rgba(255, 232, 167, .98);
      line-height: 1.15;
      word-break: break-word;
      overflow-wrap: anywhere;
    }


    .noPngExport {
      -webkit-print-color-adjust: exact;
      print-color-adjust: exact;
    }

    /* Legacy prize table styling removed; prizes now render through .prizeBoardShell/.prizeBoardRow. */

    @media (max-width: 900px) {}


    /* Use the bold italic Geogrotesque Wide variant only for table banners and table headers. */


    /* New prizes board design, based on the dark card leaderboard style. */
    .prizeBoardShell {
      --prizeBoardRadius: 4px;
      --prizeTeamNameSlot: 6.9ch;
      --prizeBubbleSlot: 82px;
      --prizeBoardOuterGap: var(--pageSidePad);
      width: 100%;
      max-width: 100%;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 0;
      padding: 0 18px;
      margin: 0;
      background: transparent;
      border: none;
      border-radius: 0;
      box-shadow: none;
      overflow: hidden;
    }

    .prizeBoardHeader,
    .prizeBoardRow {
      display: grid;
      align-items: center;
      column-gap: 10px;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      box-sizing: border-box;
    }

    .prizeBoardTopBox {
      width: 100%;
      max-width: 100%;
      min-width: 0;
      height: 210px;
      min-height: calc(var(--sideNavButtonHeight) * 1.3514);
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding: 32px 32px;
      margin: var(--prizeBoardOuterGap) 0 28px;
      border-radius: 8px;
      background: #cbd7ff08;
      border: none;
      box-shadow: none;
      box-sizing: border-box;
      color: rgb(255, 255, 255);
      text-transform: uppercase;
      overflow: hidden;
    }

    .prizeBoardHeader.withBonus,
    .prizeBoardRow.withBonus {
      grid-template-columns: minmax(0, 18%) minmax(0, 30%) minmax(0, 12%) minmax(0, 15%) minmax(0, 14%) minmax(0, 13%);
    }

    /* Analytics board uses the same shell, top box, header, row, and player styling as the prizes table. */
    .prizeBoardHeader.analyticsGrid,
    .prizeBoardRow.analyticsGrid {
      grid-template-columns: minmax(0, 27%) minmax(0, 9.5%) minmax(0, 9.5%) minmax(0, 10%) minmax(0, 10.5%) minmax(0, 11.5%) minmax(0, 11.5%) minmax(0, 10.5%);
    }

    .prizeBoardHeader.analyticsGrid .prizeBoardHeadCell:nth-child(1),
    .prizeBoardRow.analyticsGrid .prizeBoardCell:nth-child(1) {
      text-align: left;
      justify-content: flex-start;
    }

    .prizeBoardHeader.analyticsGrid .prizeBoardHeadCell:nth-child(n+2),
    .prizeBoardRow.analyticsGrid .prizeBoardCell:nth-child(n+2) {
      text-align: right;
      justify-content: flex-end;
    }

    .analyticsMetricCell {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      font-variant-numeric: tabular-nums;
      text-align: right;
      font-weight: 500;
    }

    .analyticsCorrectCell,
    .analyticsPointsCell,
    .analyticsCarryCell,
    .analyticsAverageCell,
    .analyticsFastestCell,
    .analyticsRatingCell {
      color: rgba(234, 242, 255, .96);
    }

    .analyticsBestCell {
      color: var(--good) !important;
      font-weight: 700;
    }

    .analyticsWorstCell {
      color: var(--bad) !important;
      font-weight: 700;
    }


    .analyticsSortRow {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      padding: 0;
      margin: -8px 0 20px;
      box-sizing: border-box;
    }

    .analyticsSearchPlaceholder {
      display: flex;
      -webkit-box-align: center;
      align-items: center;
      height: 50px;
      min-height: 50px;
      width: 100%;
      padding: 0px 5px 0px 15px;
      border-radius: 6px;
      border: 1px solid transparent;
      background: rgba(15, 17, 26, 0.55);
      transition: background 0.1s;
      flex: 1 1 0%;
      min-width: 170px;
      color: rgb(94, 98, 111);
      font-family: "Geogrotesque Wide", sans-serif;
      font-weight: 500;
      font-size: 14px;
      line-height: 1;
      letter-spacing: .25px;
      user-select: none;
      box-sizing: border-box;
      cursor: text;
    }

    .analyticsSearchPlaceholder:focus-within {
      border: 1px solid rgb(255, 255, 193);
      box-shadow: rgb(255, 252, 57) 0px 0px 1px inset, rgb(255, 93, 0) 0px 0px 4px;
    }

    .analyticsSearchPlaceholderSvg {
      width: 18px;
      height: 18px;
      display: block;
      margin-right: 12px;
      color: rgb(94, 98, 111);
      fill: currentColor;
      flex: 0 0 auto;
      pointer-events: none;
      transform: translateY(0.5px);
    }

    .analyticsSearchInput {
      width: 100%;
      min-width: 0;
      height: 100%;
      padding: 0;
      margin: 0;
      border: none;
      outline: none;
      background: transparent;
      color: #FFFFFF;
      font-family: "Geogrotesque Wide", sans-serif;
      font-weight: 500;
      font-size: 15px;
      line-height: 50px;
      letter-spacing: .25px;
      caret-color: #FFFFFF;
      appearance: none;
      -webkit-appearance: none;
      box-shadow: none;
    }

    .analyticsSearchInput::placeholder {
      color: rgb(94, 98, 111);
      opacity: 1;
    }

    .analyticsSearchInput::-webkit-search-decoration,
    .analyticsSearchInput::-webkit-search-cancel-button,
    .analyticsSearchInput::-webkit-search-results-button,
    .analyticsSearchInput::-webkit-search-results-decoration {
      display: none;
      -webkit-appearance: none;
    }

    .analyticsSearchClearBtn {
      width: 24px;
      height: 24px;
      min-width: 24px;
      flex: 0 0 24px;
      border: none;
      outline: none;
      border-radius: 0;
      background: transparent;
      color: #868da6;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 0;
      margin: 0 7px 0 8px;
      cursor: pointer;
      transition: color .12s ease;
    }

    .analyticsSearchPlaceholder.hasValue .analyticsSearchClearBtn {
      display: inline-flex;
    }

    .analyticsSearchClearBtn:hover,
    .analyticsSearchClearBtn:active {
      color: #B1B6C6;
      background: transparent;
      filter: none;
      transform: none;
    }

    .analyticsSearchClearIcon {
      width: 18px;
      height: 18px;
      display: block;
      fill: currentColor;
      pointer-events: none;
      flex: 0 0 auto;
    }


    .css-57x4g4 {
      display: flex;
      flex-direction: column;
      -webkit-box-align: center;
      align-items: center;
      gap: 12px;
      -webkit-box-pack: center;
      justify-content: center;
      padding: 48px 0px;
      color: rgb(103, 109, 124);
      background: transparent;
      border-radius: var(--prizeBoardRadius);
      width: 100%;
      min-height: 220px;
      box-sizing: border-box;
    }

    .css-1dcqys1 {
      width: 26px;
      height: 26px;
      display: block;
      fill: currentColor;
      color: currentColor;
      flex: 0 0 auto;
    }

    .css-1ippc9u {
      color: rgb(103, 109, 124);
      font-size: 14px;
      font-weight: 500;
      line-height: 1;
      letter-spacing: 0;
      text-align: center;
    }

    .analyticsSortButton {
      height: 48px;
      min-height: 48px;
      border: none;
      outline: none;
      border-radius: 8px;
      background: #252734;
      color: #B2B6C4;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 3px;
      padding: 0px 12px 0px 16px;
      cursor: pointer;
      user-select: none;
      font-family: "Geogrotesque Wide", sans-serif;
      font-weight: 500;
      font-size: 14px;
      line-height: 1;
      letter-spacing: 0.5px;
      transition: background .12s ease;
      box-shadow: none;
    }

    .analyticsSortButton>span {
      display: inline-flex;
      align-items: center;
      line-height: 1;
      transform: translateY(-1px);
    }

    .analyticsSortButton:hover,
    .analyticsSortButton:active {
      background: #cbd7ff08;
      color: #B2B6C4;
      filter: none;
      transform: none;
    }

    .analyticsSortButton:focus,
    .analyticsSortButton:focus-visible {
      outline: none;
      box-shadow: none;
    }

    .analyticsSortLabel {
      color: #B2B6C4;
      white-space: nowrap;
    }

    .analyticsSortValue {
      color: #ffb018;
      white-space: nowrap;
    }

    .analyticsSortArrowSvg {
      width: 6.24px;
      height: 4.9px;
      display: block;
      fill: none;
      color: #B1B6C6;
      flex: 0 0 auto;
      pointer-events: none;
      margin-left: 3px;
      transform: translateY(0px);
      transition: none;
    }

    .analyticsSortArrowSvg path {
      fill: currentColor !important;
    }

    .analyticsSortRow {
      position: relative;
      /*
        Keep the analytics search/sort controls inside the same scroll/layer plane
        as the board content. The sidebars sit at z-index: 20, so this must stay
        below that; otherwise the controls bleed over the sidebar-covered padding
        when horizontal scrolling is active on narrower page widths.
      */
      z-index: 10;
      overflow: visible;
    }

    .analyticsSortWrap {
      position: relative;
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      overflow: visible;
      z-index: 10;
    }

    .analyticsSortWrap.open .analyticsSortButton {
      background: #cbd7ff08;
    }

    .analyticsSortWrap.open .analyticsSortArrowSvg {
      transform: translateY(0px) !important;
    }

    .analyticsSortMenu {
      position: absolute;
      top: calc(100% + 12px);
      left: 50%;
      right: auto;
      transform: translateX(-50%);
      width: 200px;
      padding: 10px;
      border: none;
      border-radius: 6px;
      background: #1F2330;
      box-shadow:
        rgba(0, 0, 0, 0.25) 0px 5px 8px -4px,
        rgba(0, 0, 0, 0.18) 0px 0px 20px 0px,
        rgba(0, 0, 0, 0.35) 0px 40px 34px -16px;
      display: none;
      flex-direction: column;
      gap: 0;
      /* Above the board rows, but still below fixed sidebars (z-index: 20). */
      z-index: 19;
      overflow: visible;
    }

    .analyticsSortWrap.open .analyticsSortMenu {
      display: flex;
    }

    .analyticsSortMenuBtn {
      width: 180px;
      height: 36.8px;
      min-height: 36.8px;
      border: none;
      outline: none;
      border-radius: 6px;
      background: transparent;
      color: #FFFFFF;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding: 10px;
      cursor: pointer;
      font-family: "Geogrotesque Wide", sans-serif;
      font-weight: 500;
      font-size: 14px;
      line-height: 1;
      letter-spacing: .25px;
      text-align: left;
      white-space: nowrap;
      transition: color .12s ease, background .12s ease;
    }

    .analyticsSortMenuBtn:hover,
    .analyticsSortMenuBtn:active {
      background: #191C26;
      color: #FFFFFF;
      filter: none;
      transform: none;
    }

    .analyticsSortMenuBtn.active {
      color: #ffb018;
    }

    .analyticsSortMenuBtn.active:hover,
    .analyticsSortMenuBtn.active:active {
      background: #191C26;
      color: #ffb018;
    }

    .sportsSubmissionsPlayersHeader .analyticsSortWrap {
      z-index: 10;
      flex: 0 0 auto;
    }

    .sportsSubmissionsPlayersHeader .analyticsSortButton {
      height: 48px;
      min-height: 48px;
      max-height: 48px;
      white-space: nowrap;
    }

    .sportsSubmissionsPlayersHeader .analyticsSortMenu {
      z-index: 19;
    }



    .prizeBoardHeader {
      min-height: calc(var(--sideNavButtonHeight) * 0.8738);
      height: calc(var(--sideNavButtonHeight) * 0.8738);
      padding: 0 24px;
      border-radius: var(--prizeBoardRadius);
      background: #cbd7ff08;
    }

    .prizeBoardHeadCell {
      color: #686D7B;
      font-size: clamp(12px, .85vw, 16px);
      font-weight: 600;
      letter-spacing: .02em;
      text-transform: uppercase;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      text-align: left;
      line-height: 1.1;
    }

    .prizeBoardHeader.withBonus .prizeBoardHeadCell:nth-child(n+3) {
      text-align: right;
    }

    .prizeBoardHeader.withBonus .prizeBoardHeadCell:nth-child(1),
    .prizeBoardHeader.withBonus .prizeBoardHeadCell:nth-child(2) {
      text-align: left;
    }


    .prizeBoardHeader.noBonus .prizeBoardHeadCell:nth-child(2),
    .prizeBoardHeader.withBonus .prizeBoardHeadCell:nth-child(2),
    .prizeTeamCell {
      padding-left: 10px;
    }

    .prizeBoardRows {
      display: flex;
      flex-direction: column;
      gap: 4px;
      width: 100%;
      min-width: 0;
      margin-top: 4px;
    }

    .prizeBoardRow {
      min-height: calc(var(--sideNavButtonHeight) * 1.3514);
      height: auto;
      padding: 7px 24px;
      border-radius: var(--prizeBoardRadius);
      background: #cbd7ff08;
      border: none;
      box-shadow: none;
      transition: background .12s ease;
    }

    .prizeBoardRow:hover {
      background: #252734;
    }


    .prizeBoardRow.prizeClickableRow {
      cursor: pointer;
      user-select: text;
      -webkit-user-select: text;
    }

    .prizeBoardRow.prizeClickableRow:focus-visible {
      outline: 2px solid rgba(255, 226, 139, .54);
      outline-offset: 2px;
      background: #252734;
    }

    #prizeRowActionModal .modalCard {
      width: min(560px, 94vw);
      height: auto;
      max-height: min(86vh, 620px);
    }

    #prizeRowActionModal .modalBody {
      overflow: auto;
    }

    .prizeActionBody {
      display: grid;
      gap: 18px;
      align-content: start;
    }

    .prizeActionSummary {
      display: grid;
      gap: 7px;
      padding: 16px;
      border-radius: 18px;
      border: 1px solid rgba(255, 255, 255, .11);
      background:
        radial-gradient(circle at top left, rgba(255, 226, 139, .16), transparent 58%),
        linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .045));
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
    }

    .prizeActionKicker {
      color: rgba(255, 226, 139, .88);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .8px;
      text-transform: uppercase;
    }

    .prizeActionPlayer {
      color: #FFFFFF;
      font-size: 22px;
      font-weight: 700;
      line-height: 1.1;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    .prizeActionMeta {
      color: rgba(234, 242, 255, .82);
      font-size: 12px;
      font-weight: 500;
      line-height: 1.35;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    .prizeActionButtonGrid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    .prizeActionBtn {
      min-height: 104px;
      border-radius: 20px;
      border: 1px solid rgba(255, 255, 255, .13);
      background:
        radial-gradient(circle at top left, rgba(255, 226, 139, .22), transparent 58%),
        linear-gradient(180deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, .045));
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .05),
        0 16px 34px rgba(0, 0, 0, .18);
      color: rgba(255, 247, 219, .98);
      cursor: pointer;
      font-size: 19px;
      font-weight: 700;
      letter-spacing: .6px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      transition: transform .12s ease, border-color .12s ease, background .12s ease, filter .12s ease, box-shadow .12s ease;
    }

    .prizeActionBtn:hover {
      transform: translateY(-2px) scale(1.01);
      border-color: rgba(255, 226, 139, .38);
      background:
        radial-gradient(circle at top left, rgba(255, 226, 139, .28), transparent 58%),
        linear-gradient(180deg, rgba(255, 241, 186, .16), rgba(255, 255, 255, .06));
      filter: brightness(1.03);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .06),
        0 18px 38px rgba(0, 0, 0, .22);
    }

    .prizeActionBtn:active {
      transform: translateY(0) scale(1);
    }

    @media (max-width: 620px) {
      .prizeActionButtonGrid {
        grid-template-columns: 1fr;
      }

      .prizeActionBtn {
        min-height: 78px;
      }
    }

    .prizeBoardCell {
      min-width: 0;
      color: #FFFFFF;
      font-size: 14px;
      font-weight: 500;
      line-height: 1.15;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      text-align: left;
    }

    .prizePlayerCell {
      font-weight: 600;
      white-space: normal;
      overflow: visible;
      text-overflow: clip;
      overflow-wrap: anywhere;
      word-break: break-word;
      line-height: 1.18;
    }

    .prizeTeamCell {
      overflow: visible;
      text-overflow: clip;
    }

    .prizeTeamCell .teamStack {
      min-height: 0;
      max-width: 100%;
      width: 100%;
      overflow: visible;
      align-items: flex-start;
      justify-content: center;
    }

    .prizeTeamCell .teamTopRow {
      min-height: 0;
      display: grid;
      grid-template-columns: minmax(0, var(--prizeTeamNameSlot, 6.9ch)) var(--prizeBubbleSlot, 82px);
      align-items: center;
      justify-content: flex-start;
      column-gap: 3px;
      width: max-content;
      max-width: 100%;
      overflow: visible;
    }

    .prizeTeamCell .teamPlayersBlock {
      display: none;
    }

    .prizeTeamCell .teamNameLine {
      min-width: 0;
      max-width: var(--prizeTeamNameSlot, 6.9ch);
      color: #FFFFFF;
      font-size: clamp(14px, 1vw, 20px);
      font-weight: 500;
      letter-spacing: .01em;
      line-height: 1.15;
      white-space: normal;
      overflow: visible;
      text-overflow: clip;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    .prizeTeamCell .teamPosBubble,
    .prizeTeamCell .rankBubble {
      width: var(--prizeBubbleSlot, 82px);
      min-width: var(--prizeBubbleSlot, 82px);
      height: 20px;
      padding: 0 8px;
      font-size: 10.5px;
      line-height: 20px;
      flex: 0 0 var(--prizeBubbleSlot, 82px);
      justify-self: start;
    }

    .prizeTeamCell .teamPosBubble.hasBubbleTime {
      height: 32px;
      line-height: 1;
      padding-top: 3px;
      padding-bottom: 3px;
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 2px;
    }

    .prizeTeamCell .teamPosBubbleTime {
      display: block;
      font-size: 7.5px;
      font-weight: 500;
      line-height: 1;
      letter-spacing: .05px;
      color: inherit;
      opacity: 1;
      white-space: nowrap;
      text-transform: none;
    }

    .prizeTeamCell .teamPosBubbleScore {
      font-size: 10.5px;
      font-weight: 400;
      margin-left: 3px;
    }

    .prizeTeamCell .teamPosBubbleMain {
      display: inline-flex;
      font-size: 10.5px;
      align-items: center;
      justify-content: center;
      white-space: nowrap;
      line-height: inherit;
    }

    .prizeTeamCell .rankBubbleImg,
    .prizeTeamCell img {
      flex: 0 0 auto;
      max-width: 22px;
      max-height: 22px;
    }

    .prizeMoneyCell,
    .prizeTallyCell {
      font-variant-numeric: tabular-nums;
      text-align: right;
    }

    .prizeMoneyBold {
      font-weight: 500;
    }

    .prizeTotalCell,
    .prizeTallyCell {
      color: var(--good);
      font-weight: 500;
    }

    .prizeBoardTotalRow .prizeMoneyCell,
    .prizeBoardTotalRow .prizeTotalCell,
    .prizeBoardTotalRow .prizeTallyCell,
    .analyticsBoardAverageRow .analyticsMetricCell,
    .analyticsBoardAverageRow .analyticsCorrectCell,
    .analyticsBoardAverageRow .analyticsPointsCell,
    .analyticsBoardAverageRow .analyticsCarryCell,
    .analyticsBoardAverageRow .analyticsAverageCell,
    .analyticsBoardAverageRow .analyticsFastestCell,
    .analyticsBoardAverageRow .analyticsRatingCell {
      color: #686D7B !important;
      -webkit-text-fill-color: #686D7B !important;
    }

    .prizeBoardTotalRow .prizeMoneyCell,
    .prizeBoardTotalRow .prizeTotalCell,
    .prizeBoardTotalRow .prizeTallyCell {
      font-weight: 600;
    }

    .prizeBoardTotalRow {
      min-height: calc(var(--sideNavButtonHeight) * 1.3514);
      height: calc(var(--sideNavButtonHeight) * 1.3514);
      background: #cbd7ff08;
    }

    .prizeBoardTotalRow:hover {
      background: #cbd7ff08;
    }

    .analyticsBoardAverageRow .analyticsMetricCell,
    .analyticsBoardAverageRow .analyticsCorrectCell,
    .analyticsBoardAverageRow .analyticsPointsCell,
    .analyticsBoardAverageRow .analyticsCarryCell,
    .analyticsBoardAverageRow .analyticsAverageCell,
    .analyticsBoardAverageRow .analyticsFastestCell,
    .analyticsBoardAverageRow .analyticsRatingCell {
      color: #686D7B !important;
      -webkit-text-fill-color: #686D7B !important;
      font-weight: 600;
    }

    .analyticsBoardAverageRow:hover {
      background: #cbd7ff08;
    }

    .prizeTotalLabelCell {
      color: #686D7B;
      font-size: clamp(12px, .85vw, 16px);
      font-weight: 700;
      letter-spacing: .02em;
      text-transform: uppercase;
      line-height: 1.1;
    }

    .prizeBoardEmpty {
      min-height: calc(var(--sideNavButtonHeight) * 1.3514);
      padding: 0 24px;
      border-radius: var(--prizeBoardRadius);
      background: #cbd7ff08;
      color: #808696;
      display: flex;
      align-items: center;
      font-size: clamp(14px, 1vw, 20px);
      font-weight: 500;
    }

    @media (max-width: 1100px) {

      .prizeBoardHeader,
      .prizeBoardRow {
        column-gap: 8px;
        padding-left: 20px;
        padding-right: 20px;
      }

      .prizeBoardHeadCell,
      .prizeBoardCell,
      .prizeTeamCell .teamNameLine,
      .prizeTotalLabelCell {
        font-size: 12px;
      }
    }

    @media (max-width: 760px) {
      .prizeBoardShell {
        overflow-x: auto;
        padding-bottom: 2px;
      }

      .prizeBoardHeader,
      .prizeBoardRow {
        width: 680px;
      }

      .prizeBoardHeader.withBonus,
      .prizeBoardRow.withBonus {
        width: 780px;
      }
    }

    /* Question pages now use the same dark board/card styling as the prizes page. */
    .questionBoardShell {
      --questionBoardRadius: 4px;
      --questionBoardOuterGap: var(--pageSidePad);
      --prizeTeamNameSlot: 6.9ch;
      --prizeBubbleSlot: 38px;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 0;
      padding: 0 18px;
      margin: 0;
      background: transparent;
      border: none;
      border-radius: 0;
      box-shadow: none;
      overflow: hidden;
    }


    /*
      Keep the Rollbitrivia question boards aligned with the rest of the site tables.
      The trivia page already has the standard 18px page gutter from .questionPageShell,
      so the extra 18px left/right padding on .questionBoardShell was making the
      question header/rows/top box 36px narrower than the content area.
    */
    .questionPageShell[aria-label="Trivia"] .questionBoardShell {
      padding-left: 0;
      padding-right: 0;
    }

    .questionBoardTopBox {
      width: 100%;
      max-width: 100%;
      min-width: 0;
      height: 210px;
      min-height: calc(var(--sideNavButtonHeight) * 1.3514);
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding: 32px 32px;
      margin: var(--questionBoardOuterGap) 0 28px;
      border-radius: 8px;
      background: #cbd7ff08;
      border: none;
      box-shadow: none;
      box-sizing: border-box;
      color: rgb(255, 255, 255);
      text-transform: uppercase;
      overflow: hidden;
    }

    .questionBoardHeader,
    .questionBoardRow {
      display: grid;
      align-items: center;
      column-gap: 10px;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      box-sizing: border-box;
    }

    .questionBoardHeader.noRoulette,
    .questionBoardRow.noRoulette {
      grid-template-columns: minmax(0, 21%) minmax(0, 17%) minmax(0, 37%) minmax(0, 9%) minmax(0, 9%) minmax(0, 6%);
    }

    .questionBoardHeader.withRoulette,
    .questionBoardRow.withRoulette {
      grid-template-columns: minmax(0, 21%) minmax(0, 17%) minmax(0, 26%) minmax(0, 9%) minmax(0, 8%) minmax(0, 8%) minmax(0, 6%);
    }

    .questionBoardHeader {
      min-height: calc(var(--sideNavButtonHeight) * 0.8738);
      height: calc(var(--sideNavButtonHeight) * 0.8738);
      padding: 0 24px;
      border-radius: var(--questionBoardRadius);
      background: #cbd7ff08;
    }

    .questionBoardHeadCell {
      color: #686D7B;
      font-size: clamp(12px, .85vw, 16px);
      font-weight: 600;
      letter-spacing: .02em;
      text-transform: uppercase;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      text-align: left;
      line-height: 1.1;
    }

    .questionBoardHeader.noRoulette .questionBoardHeadCell:nth-child(n+4),
    .questionBoardHeader.withRoulette .questionBoardHeadCell:nth-child(n+4) {
      text-align: right;
    }

    .questionBoardHeader .questionBoardHeadCell.thTime {
      text-align: right;
    }

    .questionBoardHeader .questionBoardHeadCell.thRoulette {
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
    }

    .questionBoardHeader .questionBoardHeadCell.thRoulette img {
      display: block;
      transform: translateX(8px);
    }

    .questionBoardRows {
      display: flex;
      flex-direction: column;
      gap: 4px;
      width: 100%;
      min-width: 0;
      margin-top: 4px;
      overflow: visible;
    }

    .questionBoardRow {
      min-height: calc(var(--sideNavButtonHeight) * 1.62);
      height: calc(var(--sideNavButtonHeight) * 1.62);
      padding: 0 24px;
      border-radius: var(--questionBoardRadius);
      background: #cbd7ff08;
      border: none;
      box-shadow: none;
      transition: background .12s ease;
      position: relative;
      overflow: visible;
    }

    .questionBoardRow:hover {
      background: #252734;
    }

    .questionBoardCell {
      min-width: 0;
      color: #FFFFFF;
      font-size: clamp(14px, 1vw, 20px);
      font-weight: 500;
      line-height: 1.15;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      text-align: left;
      padding: 6px 0;
    }

    .questionBoardRow.noRoulette .questionBoardCell:nth-child(n+4),
    .questionBoardRow.withRoulette .questionBoardCell:nth-child(n+4) {
      text-align: right;
    }

    .questionBoardCell.wrapCell,
    .questionBoardCell.msgCell {
      white-space: normal !important;
      overflow: visible !important;
      text-overflow: clip !important;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    .questionBoardCell.questionTeamCell {
      overflow: hidden;
      text-overflow: clip;
      position: relative;
      z-index: 3;
    }

    .questionBoardCell.questionTeamCell .teamStack {
      min-height: 0;
      max-width: 100%;
      width: 100%;
      overflow: hidden;
      align-items: flex-start;
      justify-content: flex-start;
      gap: 3px;
    }

    .questionBoardCell.questionTeamCell .teamTopRow {
      min-height: 0;
      display: grid;
      grid-template-columns: minmax(0, var(--prizeTeamNameSlot, 6.9ch)) var(--prizeBubbleSlot, 38px);
      align-items: center;
      justify-content: flex-start;
      column-gap: 3px;
      width: max-content;
      max-width: 100%;
      overflow: visible;
    }

    .questionBoardCell.questionTeamCell .teamPlayersBlock {
      display: block;
      width: 100%;
      max-width: 100%;
      min-height: 0;
      max-height: 2.3em;
      overflow: hidden;
    }

    .questionBoardCell.questionTeamCell .teamPlayersText {
      display: block;
      width: 100%;
      max-width: 100%;
      color: #B2B6C4;
      font-size: clamp(10px, .72vw, 12px);
      font-weight: 500;
      line-height: 1.15;
      letter-spacing: .01em;
      white-space: normal;
      overflow: hidden;
      text-overflow: clip;
      text-align: left;
      word-break: normal;
      overflow-wrap: anywhere;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      /* Standard property for VS Code linting, with WebKit fallback for Chromium/Safari. */
      line-clamp: 2;
      -webkit-line-clamp: 2;
    }

    .questionBoardCell.questionPlayersCell {
      color: #FFFFFF;
      white-space: normal;
      overflow: visible;
      text-overflow: clip;
      padding-top: 2px;
      padding-bottom: 2px;
      position: relative;
      z-index: 5;
    }

    .questionPlayersList {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: center;
      gap: 1px;
      width: 100%;
      max-width: 100%;
      min-height: 0;
      overflow: visible;
    }

    .questionPlayerName {
      display: inline-flex;
      align-items: center;
      width: 100%;
      max-width: 100%;
      color: #FFFFFF;
      font-size: clamp(10px, .72vw, 12px);
      font-weight: 500;
      line-height: 1.08;
      letter-spacing: .01em;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      text-align: left;
    }

    .questionPlayerName.isSubmittingPlayer {
      color: #ffffc1;
      font-weight: 700;
      text-decoration: none;
      width: 100%;
      max-width: 100%;
      overflow: visible;
      position: relative;
      isolation: isolate;
      filter: none;
      line-height: 1.28;
      padding: 3px 7px 3px 0;
      margin: -3px -7px -3px 0;
      z-index: 6;
      gap: 0;
    }

    .questionSubmitterSymbol,
    .questionSubmitterText {
      position: relative;
      display: inline-block;
      min-width: 0;
      overflow: visible;
      white-space: nowrap;
      color: currentColor;
      z-index: 1;
      isolation: isolate;
      background: transparent !important;
      text-shadow:
        0 0 0.8px rgba(255, 247, 210, .12),
        0 0 1.8px rgba(245, 118, 42, .56),
        0 0 3.8px rgba(220, 86, 28, .36),
        0 0 6.2px rgba(170, 62, 18, .16);
    }

    .questionSubmitterSymbol {
      position: absolute;
      left: -1.28em;
      top: 50%;
      flex: 0 0 auto;
      font-size: .96em;
      line-height: 1;
      transform: translateY(-50%);
      pointer-events: none;
    }

    .questionSubmitterText {
      max-width: 100%;
    }

    .questionSubmitterSymbol::before,
    .questionSubmitterSymbol::after,
    .questionSubmitterText::before,
    .questionSubmitterText::after {
      content: attr(data-text);
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      white-space: nowrap;
      pointer-events: none;
      user-select: none;
      color: transparent;
      background: transparent !important;
      z-index: -1;
      overflow: visible;
    }

    .questionSubmitterSymbol::before,
    .questionSubmitterText::before {
      opacity: .70;
      transform: scale(1.000, 1.003);
      text-shadow:
        0 0 1.8px rgba(245, 118, 42, .56),
        0 0 3.8px rgba(220, 86, 28, .36),
        0 0 6.2px rgba(170, 62, 18, .16);
      filter: blur(1.05px);
    }

    .questionSubmitterSymbol::after,
    .questionSubmitterText::after {
      opacity: .56;
      transform: scale(1.006, 1.012);
      text-shadow:
        0 0 2.6px rgba(220, 86, 28, .28),
        0 0 5.2px rgba(170, 62, 18, .18),
        0 0 7.8px rgba(120, 42, 14, .09);
      filter: blur(2.35px);
    }

    .questionBoardCell.questionTeamCell .teamNameLine {
      min-width: 0;
      max-width: var(--prizeTeamNameSlot, 6.9ch);
      color: #FFFFFF;
      font-size: clamp(14px, 1vw, 20px);
      font-weight: 600;
      letter-spacing: .01em;
      line-height: 1.15;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .questionBoardCell .teamPosBubble,
    .questionBoardCell .rankBubble {
      width: 82px;
      min-width: 82px;
      height: 20px;
      padding: 0 8px;
      font-size: 10.5px;
      line-height: 20px;
      flex: 0 0 82px;
      justify-self: start;
    }

    .questionBoardCell .teamPosBubble.hasBubbleTime {
      height: 32px;
      line-height: 1;
      padding-top: 3px;
      padding-bottom: 3px;
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 2px;
    }

    .questionBoardCell .teamPosBubbleMain {
      display: inline-flex;
      font-size: 10.5px;
      align-items: center;
      justify-content: center;
      white-space: nowrap;
      line-height: 1;
    }

    .questionBoardCell .teamPosBubbleScore {
      font-size: 10.5px;
      font-weight: 400;
      margin-left: 3px;
    }

    .questionBoardCell .teamPosBubbleTime {
      display: block;
      font-size: 7.5px;
      font-weight: 500;
      line-height: 1;
      letter-spacing: .05px;
      color: inherit;
      opacity: 1;
      white-space: nowrap;
      text-transform: none;
    }

    .questionBoardCell.qTimeCell {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      text-align: right;
    }

    .questionBoardCell.qTimeCell .qTimeWrap,
    .questionBoardCell .msgStack {
      justify-content: flex-end;
    }

    .questionBoardCell .qScoreNum {
      color: #FFFFFF;
      font-weight: 500;
      font-variant-numeric: tabular-nums;
    }

    .questionBoardCell .qScoreNum.leading {
      color: var(--good);
    }

    /* Keep the Result header and the result buttons on the same right-aligned axis. */
    .questionBoardHeader.noRoulette .questionBoardHeadCell.thResult,
    .questionBoardHeader.withRoulette .questionBoardHeadCell.thResult {
      text-align: right;
    }

    .questionBoardCell.tdResult {
      display: flex;
      justify-content: flex-end;
      align-items: center;
      text-align: right;
      overflow: visible;
    }

    .questionBoardCell.tdResult .resultBtn {
      margin: 0 0 0 auto;
      flex: 0 0 auto;
    }

    .questionBoardEmpty {
      min-height: calc(var(--sideNavButtonHeight) * 1.3514);
      padding: 0 24px;
      border-radius: var(--questionBoardRadius);
      background: #cbd7ff08;
      color: #808696;
      display: flex;
      align-items: center;
      font-size: clamp(14px, 1vw, 20px);
      font-weight: 500;
    }

    @media (max-width: 1100px) {

      .questionBoardHeader,
      .questionBoardRow {
        column-gap: 8px;
        padding-left: 20px;
        padding-right: 20px;
      }

      .questionBoardHeadCell,
      .questionBoardCell,
      .questionBoardCell .teamNameLine {
        font-size: 12px;
      }
    }

    @media (max-width: 760px) {
      .questionBoardShell {
        overflow-x: auto;
        padding-bottom: 2px;
      }

      .questionBoardHeader.noRoulette,
      .questionBoardRow.noRoulette {
        width: 760px;
      }

      .questionBoardHeader.withRoulette,
      .questionBoardRow.withRoulette {
        width: 880px;
      }
    }


    /* Leaderboard pages now use the same dark board/card styling as the prizes page. */
    .leaderboardBoardShell {
      --leaderboardBoardRadius: 4px;
      --leaderboardBoardOuterGap: var(--pageSidePad);
      --leaderboardTeamWidth: 25.04fr;
      --leaderboardPlayersWidth: 16fr;
      --leaderboardQuestionWidth: 6.2fr;
      --leaderboardPrizeWidth: 9fr;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 0;
      padding: 0 18px;
      margin: 0;
      background: transparent;
      border: none;
      border-radius: 0;
      box-shadow: none;
      overflow: visible;
    }

    .leaderboardBoardTopBox {
      width: 100%;
      max-width: 100%;
      min-width: 0;
      height: 210px;
      min-height: 210px;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 218px;
      padding: 32px 32px;
      margin: var(--leaderboardBoardOuterGap) 0 28px;
      position: relative;
      overflow: hidden;
      background-color: rgb(31, 35, 48);
      background-image: url("/assets/banner_races.jpg");
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      border-radius: 8px;
      border: none;
      box-shadow: none;
      box-sizing: border-box;
      color: rgb(255, 255, 255);
      text-transform: uppercase;
    }

    .leaderboardBoardTopBox::before {
      content: none;
      display: none;
    }

    .leaderboardBoardTopBox,
    .leaderboardBoardTopBox * {
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: italic !important;
    }

    .leaderboardRaceTitle {
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: center;
      gap: 0;
      white-space: nowrap;
      text-transform: uppercase;
      font-variant-numeric: tabular-nums;
    }

    .leaderboardRaceBrand,
    .leaderboardRacePrize {
      display: block;
      text-transform: uppercase;
      line-height: 38px;
      font-variant-numeric: tabular-nums;
      font-size: 32px;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: italic !important;
      letter-spacing: 0;
    }

    .leaderboardRaceBrand {
      color: rgb(255, 255, 255);
      text-shadow: none;
    }

    .leaderboardRacePrize {
      color: rgb(165, 255, 129);
      text-shadow: rgba(59, 198, 14, 0.5) 0px 0px 10px;
    }

    .leaderboardPrizePoolBadge {
      display: inline-flex;
      -webkit-box-align: center;
      align-items: center;
      -webkit-box-pack: center;
      justify-content: center;
      white-space: nowrap;
      transition: 0.1s;
      appearance: none;
      border-width: medium;
      border-style: none;
      border-color: currentcolor;
      border-image: initial;
      letter-spacing: 0.5px;
      cursor: text;
      user-select: text;
      -webkit-user-select: text;
      height: 48px;
      padding: 0px 24px;
      border-radius: 8px;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: normal !important;
      font-size: 14px;
      line-height: 1;
      text-transform: uppercase;
      color: rgb(255, 255, 255);
      background: rgba(203, 215, 255, 0.03);
      margin-top: 24px;
      pointer-events: auto;
    }


    .leaderboardPrizePoolBadge,
    .questionBoardTopBox .leaderboardPrizePoolBadge,
    .prizeBoardTopBox .leaderboardPrizePoolBadge {
      width: 160px;
      min-width: 160px;
      max-width: 160px;
      padding-left: 12px;
      padding-right: 12px;
      gap: 7px;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .leaderboardPrizePoolActionRow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-top: 24px;
      height: 48px;
    }

    .leaderboardPrizePoolActionRow .leaderboardPrizePoolBadge {
      margin-top: 0;
      flex: 0 0 160px;
    }


    .sportsStandingsDayBadge {
      cursor: default;
      user-select: none;
      -webkit-user-select: none;
    }

    .sportsStandingsDayGlyph {
      width: 20px;
      height: 20px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 20px;
      color: #FFFFFF;
    }

    .sportsStandingsDayGlyph svg {
      width: 20px;
      height: 20px;
      display: block;
      fill: currentColor;
      color: currentColor;
    }

    .sportsStandingsDayText {
      display: inline-block;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      font-size: 20px;
    }

    .leaderboardRandomWinnersBtn {
      width: 48px;
      min-width: 48px;
      max-width: 48px;
      height: 48px;
      min-height: 48px;
      max-height: 48px;
      padding: 0;
      border-radius: 8px;
      border: none;
      outline: none;
      background: rgba(203, 215, 255, 0.03);
      color: #FFFFFF;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      user-select: none;
      transition: background .12s ease, filter .12s ease;
      flex: 0 0 48px;
      line-height: 1;
    }

    .leaderboardRandomWinnersBtn:hover {
      background: rgba(203, 215, 255, 0.055);
      color: #FFFFFF;
      filter: brightness(1.03);
    }

    .leaderboardRandomWinnersBtn:active {
      background: rgba(203, 215, 255, 0.055);
      color: #FFFFFF;
      transform: translateY(0);
    }

    .leaderboardRandomWinnersBtn:focus,
    .leaderboardRandomWinnersBtn:focus-visible {
      outline: none;
      box-shadow: none;
    }

    .leaderboardRandomWinnersBtn:disabled {
      opacity: .55;
      cursor: not-allowed;
      transform: none;
      filter: none;
      background: rgba(203, 215, 255, 0.03);
      color: #FFFFFF;
    }

    .leaderboardRandomWinnersBtn:disabled:hover {
      background: rgba(203, 215, 255, 0.03);
      color: #FFFFFF;
      transform: none;
      filter: none;
    }

    .leaderboardRandomWinnersBtn .headerRandomDiceIcon {
      width: 32.2px;
      height: 24.15px;
    }


    .questionBoardTopBox .leaderboardPrizePoolBadge,
    .prizeBoardTopBox .leaderboardPrizePoolBadge {
      cursor: text;
      user-select: text;
      -webkit-user-select: text;
    }

    .topBoxBadgeSpacer {
      display: block;
      width: 160px;
      min-width: 160px;
      max-width: 160px;
      height: 48px;
      min-height: 48px;
      margin-top: 24px;
      padding: 0;
      background: transparent;
      border: 0;
      pointer-events: none;
      visibility: hidden;
    }

    .questionBoardTopBox,
    .questionBoardTopBox *,
    .prizeBoardTopBox,
    .prizeBoardTopBox * {
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: italic !important;
    }

    .questionBoardTopBox .leaderboardRaceTitle,
    .prizeBoardTopBox .leaderboardRaceTitle {
      margin: 0;
      padding: 0;
    }

    .questionBoardTopBox .leaderboardPrizePoolBadge,
    .prizeBoardTopBox .leaderboardPrizePoolBadge,
    .questionBoardTopBox .leaderboardPrizePoolBadge *,
    .prizeBoardTopBox .leaderboardPrizePoolBadge * {
      font-style: normal !important;
    }

    .topBoxGlitchIcon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 auto;
      font-size: 17px;
      line-height: 1;
    }

    .leaderboardPrizePoolBadge .emojiIcon,
    .topBoxGlitchIcon .emojiIcon {
      width: 20px;
      height: 20px;
      object-fit: contain;
      vertical-align: -0.18em;
    }


    .analyticsHowItWorksBtn {
      display: inline-flex;
      -webkit-box-align: center;
      align-items: center;
      -webkit-box-pack: center;
      justify-content: center;
      white-space: nowrap;
      transition: 0.1s;
      appearance: none;
      border-width: medium;
      border-style: none;
      border-color: currentcolor;
      border-image: initial;
      letter-spacing: 0.5px;
      cursor: pointer;
      user-select: none;
      -webkit-user-select: none;
      height: 48px;
      width: 160px;
      min-width: 160px;
      max-width: 160px;
      padding: 0px 12px;
      border-radius: 8px;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: normal !important;
      font-size: 14px;
      line-height: 1;
      text-transform: uppercase;
      color: rgb(255, 255, 255);
      background: rgba(203, 215, 255, 0.03);
      margin-top: 24px;
      pointer-events: auto;
      gap: 7px;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .leaderboardPrizePoolBadge .analyticsHowItWorksBtn {
      width: 100%;
      min-width: 100%;
      max-width: 100%;
      height: 100%;
      min-height: 100%;
      max-height: 100%;
      margin-top: 0;
      padding: 0;
      border-radius: inherit;
      background: transparent;
      box-shadow: none;
      transform: none;
    }

    .leaderboardPrizePoolBadge .analyticsHowItWorksBtn:hover,
    .leaderboardPrizePoolBadge .analyticsHowItWorksBtn:active {
      background: transparent;
    }

    .leaderboardPrizePoolBadge:has(.analyticsHowItWorksBtn) {
      cursor: pointer;
      user-select: none;
      -webkit-user-select: none;
    }

    .leaderboardPrizePoolBadge:has(.analyticsHowItWorksBtn):hover {
      background: rgba(203, 215, 255, 0.07);
      filter: brightness(1.03);
    }

    .analyticsHowItWorksBtn:hover,
    .analyticsHowItWorksBtn:active {
      background: rgba(203, 215, 255, 0.07);
      color: rgb(255, 255, 255);
      filter: brightness(1.03);
    }

    .analyticsHowItWorksBtn:focus,
    .analyticsHowItWorksBtn:focus-visible {
      outline: none;
      box-shadow: rgb(255, 93, 0) 0px 0px 4px;
    }

    .analyticsHowItWorksModalCard {
      display: inline-block;
      position: relative;
      z-index: 1;
      width: 100%;
      max-width: 600px;
      max-height: calc(100vh - 40px);
      vertical-align: middle;
      border-radius: 10px;
      animation: 0.15s ease-out 0s 1 normal both running animation-1h5r8ub;
      background: rgb(26, 29, 41);
      box-shadow: rgba(0, 0, 0, 0.3) 0px 10px 20px, rgba(255, 255, 255, 0.04) 0px 1px 0px inset, rgba(0, 0, 0, 0.25) 0px -4px 0px inset;
      overflow: hidden auto;
      overscroll-behavior: contain;
    }

    .analyticsHowItWorksCloseWrap {
      position: absolute;
      top: 12px;
      right: 12px;
      width: 32px;
      height: 32px;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0;
      z-index: 3;
    }

    .analyticsHowItWorksCloseBtn {
      width: 32px;
      height: 32px;
      border: none;
      outline: none;
      border-radius: 8px;
      background: transparent;
      color: #878DA4;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0;
      cursor: pointer;
      transition: color .12s ease, background .12s ease;
    }

    .analyticsHowItWorksCloseBtn:hover,
    .analyticsHowItWorksCloseBtn:active {
      background: rgba(255, 255, 255, 0.04);
      color: #FFFFFF;
      filter: none;
      transform: none;
    }

    .analyticsHowItWorksCloseIcon {
      width: 20px;
      height: 20px;
      display: block;
      fill: currentColor;
      pointer-events: none;
      flex: 0 0 auto;
    }

    .analyticsHowItWorksBody {
      width: 100%;
      padding: 12px 32px 32px;
    }

    .analyticsHowItWorksTitle {
      display: flex;
      -webkit-box-align: center;
      align-items: center;
      margin: 6px 0 18px;
      color: rgb(255, 255, 255);
      text-transform: uppercase;
      word-break: break-word;
      gap: 12px;
      -webkit-box-pack: center;
      justify-content: center;
      font-size: 22px;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: normal !important;
      line-height: 1.2;
    }

    .analyticsHowItWorksBody p,
    .analyticsHowItWorksBody li {
      margin: 0px 0px 16px;
      line-height: 1.6;
      font-size: 14px;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 500 !important;
      font-style: normal !important;
      color: #B2B6C4;
    }

    .analyticsHowItWorksBody strong {
      color: rgb(255, 255, 255);
      font-weight: 700 !important;
    }

    .analyticsHowItWorksBody ul {
      margin: 0 0 8px;
      padding-left: 20px;
    }

    .analyticsHowItWorksBody ul.analyticsHowItWorksStatList {
      margin: 0 0 10px;
      padding-left: 20px;
    }

    .analyticsHowItWorksBody ul.analyticsHowItWorksStatList li {
      margin: 0 0 7px;
      line-height: 1.45;
    }

    .analyticsRatingTableWrap {
      width: 100%;
      margin: 10px 0 16px;
      border-radius: 8px;
      overflow: hidden;
      background: rgba(203, 215, 255, 0.035);
      border: 1px solid rgba(255, 255, 255, 0.08);
    }

    .analyticsRatingTable {
      width: 100%;
      border-collapse: collapse;
      table-layout: fixed;
    }

    .analyticsRatingTable th,
    .analyticsRatingTable td {
      padding: 10px 12px;
      text-align: left;
      vertical-align: top;
      border-bottom: 1px solid rgba(255, 255, 255, 0.075);
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-style: normal !important;
      font-size: 12px;
      line-height: 1.45;
    }

    .analyticsRatingTable th {
      color: #FFFFFF;
      font-weight: 800 !important;
      text-transform: uppercase;
      letter-spacing: 0.35px;
      background: rgba(15, 17, 26, 0.34);
    }

    .analyticsRatingTable td {
      color: #B2B6C4;
      font-weight: 500 !important;
    }

    .analyticsRatingTable tr:last-child td {
      border-bottom: none;
    }

    .analyticsRatingTable td:first-child {
      color: #FFFFFF;
      font-weight: 700 !important;
      width: 34%;
    }

    .analyticsHowItWorksBody .analyticsRatingNote {
      margin-bottom: 10px;
    }

    .analyticsHowItWorksSectionTitle {
      margin: 22px 0 12px;
      color: rgb(255, 255, 255);
      text-transform: uppercase;
      font-size: 14px;
      line-height: 1.2;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: normal !important;
      letter-spacing: 0.4px;
    }

    .topBoxBadgeText {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .leaderboardUtcDatePanel {
      display: flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 auto;
      margin-left: 0;
      padding: 0;
      text-align: center;
    }

    .leaderboardUtcDateInner {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 0;
      margin: 0;
    }

    .leaderboardUtcDayTitle {
      margin-bottom: 16px;
      text-transform: uppercase;
      color: rgb(255, 255, 255);
      font-size: 14px;
      line-height: 1;
      letter-spacing: 0;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: normal !important;
    }

    .leaderboardUtcDateGrid {
      display: flex;
      -webkit-box-align: center;
      align-items: center;
      gap: 16px;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: normal !important;
      transform: translateY(1.5px);
    }

    .leaderboardUtcDateBox {
      width: 73.16px;
      min-width: 73.16px;
      max-width: 73.16px;
      height: 80.8px;
      min-height: 80.8px;
      max-height: 80.8px;
      padding: 0;
      border-radius: 8px;
      font-variant-numeric: tabular-nums;
      background: rgb(26, 29, 41);
      color: rgb(255, 255, 255);
      font-size: 32px;
      line-height: 1;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: normal !important;
      text-align: center;
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      flex: 0 0 73.16px;
    }

    .leaderboardUtcDateBox div {
      margin-top: 8px;
      color: rgb(177, 182, 198);
      font-size: 12px;
      line-height: 1;
      text-transform: uppercase;
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: normal !important;
    }

    .leaderboardHowWorksBtn,
    .leaderboardRaceCountdown,
    .leaderboardRaceResetTitle,
    .leaderboardRaceTimeGrid,
    .leaderboardRaceTimeBox {
      display: none !important;
    }

    @media (max-width: 860px) {
      .leaderboardBoardTopBox {
        min-height: 170px;
        padding: 22px 24px;
        background-size: cover;
        background-position: center;
      }

      .leaderboardRaceTitle {
        white-space: normal;
        font-size: clamp(28px, 8vw, 42px);
      }

      .leaderboardBoardTopBox {
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 24px;
      }

      .leaderboardUtcDatePanel {
        margin-left: 0;
        align-self: flex-start;
      }

      .leaderboardUtcDateGrid {
        gap: 10px;
      }

      .leaderboardUtcDateBox {
        width: 73.16px;
        min-width: 73.16px;
        max-width: 73.16px;
        height: 80.8px;
        min-height: 80.8px;
        max-height: 80.8px;
        padding: 0;
        font-size: 26px;
        flex: 0 0 73.16px;
      }
    }

    .leaderboardBoardInner {
      width: 100%;
      max-width: 100%;
      min-width: 0;
      overflow: visible;
    }

    .leaderboardBoardHeader,
    .leaderboardBoardRow {
      display: grid;
      grid-template-columns: minmax(0, var(--leaderboardTeamWidth)) minmax(0, var(--leaderboardPlayersWidth)) repeat(var(--leaderboardQuestionCount, 10), minmax(0, var(--leaderboardQuestionWidth))) minmax(0, var(--leaderboardPrizeWidth));
      align-items: center;
      column-gap: 1px;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      box-sizing: border-box;
    }

    .leaderboardBoardHeader {
      min-height: calc(var(--sideNavButtonHeight) * 0.8738);
      height: calc(var(--sideNavButtonHeight) * 0.8738);
      padding: 0 24px;
      border-radius: var(--leaderboardBoardRadius);
      background: #cbd7ff08;
    }

    .leaderboardBoardHeadCell {
      color: #686D7B;
      font-size: clamp(12px, .85vw, 16px);
      font-weight: 600;
      letter-spacing: .02em;
      text-transform: uppercase;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      text-align: left;
      line-height: 1.1;
      user-select: none;
    }

    .leaderboardBoardHeadCell.lbQHead {
      cursor: pointer;
      transition: color .12s ease, filter .12s ease;
    }

    .leaderboardBoardHeadCell.lbQHead:hover {
      color: #FFFFFF;
      filter: brightness(1.04);
    }

    .leaderboardBoardHeadCell:nth-child(n+3) {
      text-align: right;
    }

    .leaderboardBoardHeadCell.lbQHead {
      text-align: right;
      overflow: visible;
      text-overflow: clip;
    }

    .leaderboardBoardHeadCell:nth-child(2) {
      text-align: left;
    }

    .leaderboardBoardHeadCell:nth-child(1) {
      text-align: left;
      padding-left: 0;
    }

    .leaderboardBoardRows {
      display: flex;
      flex-direction: column;
      gap: 4px;
      width: 100%;
      min-width: 0;
      margin-top: 4px;
      overflow: visible;
    }

    .leaderboardBoardRow {
      min-height: calc(var(--sideNavButtonHeight) * 1.62);
      height: calc(var(--sideNavButtonHeight) * 1.62);
      padding: 0 24px;
      border-radius: var(--leaderboardBoardRadius);
      background: #cbd7ff08;
      border: none;
      box-shadow: none;
      transition: background .12s ease;
      position: relative;
      overflow: visible;
    }

    .leaderboardBoardRow:hover {
      background: #252734;
    }

    .leaderboardBoardRow.winnerRow {
      background:
        linear-gradient(90deg, rgba(255, 224, 122, .42), rgba(255, 224, 122, .18) 58%, rgba(255, 224, 122, .09)),
        radial-gradient(circle at 20% 50%, rgba(255, 232, 120, .22), transparent 48%),
        #cbd7ff08;
      box-shadow: inset 0 0 0 1px rgba(255, 224, 122, .28);
    }

    .leaderboardBoardRow.secondRow {
      background:
        linear-gradient(90deg, rgba(215, 221, 232, .36), rgba(215, 221, 232, .16) 58%, rgba(215, 221, 232, .08)),
        radial-gradient(circle at 20% 50%, rgba(230, 236, 246, .18), transparent 48%),
        #cbd7ff08;
      box-shadow: inset 0 0 0 1px rgba(215, 221, 232, .24);
    }

    .leaderboardBoardRow.thirdRow {
      background:
        linear-gradient(90deg, rgba(205, 139, 90, .38), rgba(205, 139, 90, .165) 58%, rgba(205, 139, 90, .08)),
        radial-gradient(circle at 20% 50%, rgba(232, 160, 105, .19), transparent 48%),
        #cbd7ff08;
      box-shadow: inset 0 0 0 1px rgba(205, 139, 90, .24);
    }

    .leaderboardBoardRow.winnerRow:hover {
      background:
        linear-gradient(90deg, rgba(255, 224, 122, .42), rgba(255, 224, 122, .18) 58%, rgba(255, 224, 122, .09)),
        radial-gradient(circle at 20% 50%, rgba(255, 232, 120, .22), transparent 48%),
        #252734;
      box-shadow: inset 0 0 0 1px rgba(255, 224, 122, .28);
    }

    .leaderboardBoardRow.secondRow:hover {
      background:
        linear-gradient(90deg, rgba(215, 221, 232, .36), rgba(215, 221, 232, .16) 58%, rgba(215, 221, 232, .08)),
        radial-gradient(circle at 20% 50%, rgba(230, 236, 246, .18), transparent 48%),
        #252734;
      box-shadow: inset 0 0 0 1px rgba(215, 221, 232, .24);
    }

    .leaderboardBoardRow.thirdRow:hover {
      background:
        linear-gradient(90deg, rgba(205, 139, 90, .38), rgba(205, 139, 90, .165) 58%, rgba(205, 139, 90, .08)),
        radial-gradient(circle at 20% 50%, rgba(232, 160, 105, .19), transparent 48%),
        #252734;
      box-shadow: inset 0 0 0 1px rgba(205, 139, 90, .24);
    }

    .leaderboardBoardCell {
      min-width: 0;
      color: #FFFFFF;
      font-size: clamp(14px, 1vw, 20px);
      font-weight: 500;
      line-height: 1.15;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      text-align: left;
      padding: 6px 0;
    }

    .leaderboardBoardRankCell {
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      color: #FFFFFF;
      font-size: clamp(14px, 1vw, 20px);
      font-weight: 500;
      line-height: 1.15;
      padding-top: 0;
      padding-bottom: 0;
    }

    .leaderboardRankNumber {
      display: inline-flex;
      align-items: center;
      justify-content: flex-start;
      color: #FFFFFF;
      font-size: inherit;
      font-weight: inherit;
      line-height: 1;
      text-align: left;
      text-shadow: none;
    }

    .leaderboardBoardCell:nth-child(n+3) {
      text-align: right;
    }

    .leaderboardBoardCell.lbQuestionCell {
      text-align: right;
    }

    .leaderboardBoardCell.lbQuestionCell .lbCellStack {
      align-items: flex-end;
      text-align: right;
      gap: 1px;
    }

    .leaderboardBoardCell.lbQuestionCell .lbClockInfoWrap,
    .leaderboardBoardCell.lbQuestionCell .lbClockValue,
    .leaderboardBoardCell.lbQuestionCell .lbScoreNum {
      justify-content: flex-end;
      text-align: right;
    }

    .leaderboardBoardCell:nth-child(1) {
      text-align: left;
    }

    .leaderboardBoardTeamCell {
      overflow: hidden;
      text-overflow: clip;
      position: relative;
      z-index: 3;
      text-align: left !important;
    }

    .leaderboardBoardTeamCell .teamStack {
      min-height: 0;
      max-width: 100%;
      width: 100%;
      overflow: hidden;
      align-items: flex-start;
      justify-content: flex-start;
      gap: 3px;
    }

    .leaderboardBoardTeamCell .teamTopRow {
      min-height: 0;
      display: grid;
      grid-template-columns: minmax(0, var(--prizeTeamNameSlot, 6.9ch)) var(--prizeBubbleSlot, 38px);
      align-items: center;
      justify-content: flex-start;
      column-gap: 3px;
      width: max-content;
      max-width: 100%;
      overflow: visible;
    }

    .leaderboardBoardTeamCell .teamPlayersBlock {
      display: none;
    }

    .leaderboardBoardTeamCell .teamNameLine {
      min-width: 0;
      max-width: var(--prizeTeamNameSlot, 6.9ch);
      color: #FFFFFF;
      font-size: clamp(14px, 1vw, 20px);
      font-weight: 600;
      letter-spacing: .01em;
      line-height: 1.15;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .leaderboardBoardPlayersCell {
      color: #FFFFFF;
      white-space: normal;
      overflow: visible;
      text-overflow: clip;
      padding-top: 2px;
      padding-bottom: 2px;
      position: relative;
      z-index: 5;
      text-align: left !important;
    }

    .leaderboardBoardRankCell .rankStack,
    .leaderboardBoardCell .lbCellStack {
      align-items: flex-end;
      justify-content: center;
      min-height: calc(var(--sideNavButtonHeight) * 1.05);
    }

    .leaderboardBoardRankCell .rankStack {
      align-items: flex-start;
      text-align: left;
    }


    .leaderboardBoardRankCell .rankOrdinal {
      font-size: clamp(14px, 1vw, 20px);
      font-weight: 500;
      letter-spacing: .01em;
      line-height: 1.15;
      text-shadow: none;
    }

    .leaderboardBoardRankCell .rankOrdinalNum,
    .leaderboardBoardRankCell .rankOrdinalSuffix {
      font-size: 1em;
      font-weight: 500;
      line-height: 1.15;
    }

    .leaderboardBoardRankCell .rankOrdinalSuffix {
      top: 0;
    }

    .leaderboardBoardTeamCell .teamStack,
    .leaderboardBoardTeamCell .teamTopRow {
      justify-content: flex-start;
    }

    .leaderboardBoardTeamCell .teamPosBubble,
    .leaderboardBoardTeamCell .rankBubble {
      width: 82px;
      min-width: 82px;
      height: 20px;
      padding: 0 8px;
      font-size: 10.5px;
      line-height: 20px;
      flex: 0 0 82px;
      justify-self: start;
      overflow: visible;
    }

    .leaderboardBoardTeamCell .teamPosBubble.hasBubbleTime {
      height: 32px;
      min-height: 32px;
      line-height: 1;
      padding-top: 3px;
      padding-bottom: 3px;
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 2px;
    }

    .leaderboardBoardTeamCell .teamPosBubbleMain {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      white-space: nowrap;
      font-size: 10.5px;
      line-height: 1;
    }

    .leaderboardBoardTeamCell .teamPosBubbleScore {
      font-size: 10.5px;
      font-weight: 400;
      margin-left: 3px;
    }

    .leaderboardBoardTeamCell .teamPosBubbleTime {
      display: block;
      font-size: 7.5px;
      font-weight: 500;
      line-height: 1;
      letter-spacing: .05px;
      color: inherit;
      opacity: 1;
      white-space: nowrap;
      text-transform: none;
    }

    .leaderboardBoardCell .lbTime {
      font-size: 7.5px;
      font-weight: 500;
      line-height: 1;
      letter-spacing: .05px;
    }

    .leaderboardBoardCell .lbClockInfoWrap {
      min-height: 1em;
      line-height: 1;
      cursor: default;
      overflow: visible;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 0;
      white-space: nowrap;
    }

    .leaderboardBoardCell .lbClockIcon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #FFFFFF;
      font-size: .76em;
      line-height: 1;
      transform: translateY(-1px);
      user-select: none;
      -webkit-user-select: none;
      flex: 0 0 auto;
    }

    .leaderboardBoardCell .lbClockValue {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #FFFFFF;
      font-size: 7.5px;
      font-weight: 500;
      line-height: 1;
      letter-spacing: .05px;
      font-variant-numeric: tabular-nums;
      white-space: nowrap;
      transform: translateY(0);
    }

    .leaderboardBoardCell .lbClockInfoWrap:hover .lbClockIcon,
    .leaderboardBoardCell .lbClockInfoWrap:focus-within .lbClockIcon {
      color: #FFFFFF;
    }


    .leaderboardBoardCell .lbScoreNum,
    .leaderboardBoardCell .lbTotalScore {
      font-size: 1em;
      line-height: 1.1;
      font-weight: 500;
    }

    .leaderboardBoardCell .lbTotalScore {
      color: var(--good);
    }

    .leaderboardBoardCell .lbTotalScore.muted {
      color: #FFFFFF;
    }

    .leaderboardBoardCell .lbScoreNum.lbQuestionScorePositive {
      color: #FFFFFF;
    }

    .leaderboardBoardCell .lbScoreNum.lbQuestionScoreNonPositive {
      color: #FFFFFF;
    }

    .leaderboardBoardCell .lbRedactBlock {
      margin-left: auto;
    }

    .leaderboardBoardEmpty {
      min-height: calc(var(--sideNavButtonHeight) * 1.3514);
      padding: 0 24px;
      border-radius: var(--leaderboardBoardRadius);
      background: #cbd7ff08;
      color: #808696;
      display: flex;
      align-items: center;
      font-size: clamp(14px, 1vw, 20px);
      font-weight: 500;
    }

    @media (max-width: 1100px) {

      .leaderboardBoardHeader,
      .leaderboardBoardRow {
        column-gap: 8px;
        padding-left: 20px;
        padding-right: 20px;
      }

      .leaderboardBoardHeadCell,
      .leaderboardBoardCell,
      .leaderboardBoardTeamCell .teamNameLine {
        font-size: 12px;
      }
    }


    /* Let the new rectangular leaderboard-position bubble shadows render outside their boxes. */
    .teamPosBubble {
      position: relative;
      z-index: 8;
      overflow: visible;
      margin-top: 5px;
      margin-bottom: 5px;
    }

    .teamTopRow,
    .teamStack,
    .questionBoardCell.questionTeamCell,
    .questionBoardCell.questionTeamCell .teamStack,
    .questionBoardCell.questionTeamCell .teamTopRow,
    .prizeTeamCell,
    .prizeTeamCell .teamStack,
    .prizeTeamCell .teamTopRow,
    .leaderboardBoardTeamCell,
    .leaderboardBoardTeamCell .teamStack,
    .leaderboardBoardTeamCell .teamTopRow {
      overflow: visible !important;
    }

    .questionBoardRows,
    .questionBoardRow,
    .prizeBoardRows,
    .prizeBoardRow,
    .leaderboardBoardRows,
    .leaderboardBoardRow {
      overflow: visible !important;
    }

    .questionBoardShell,
    .prizeBoardShell,
    .leaderboardBoardShell,
    .leaderboardBoardInner {
      overflow: visible !important;
    }



    /*
      Fixed board/table typography.
      Windows was rendering the viewport-based clamp() row text larger than macOS,
      while the rank bubbles and small score-time text were already fixed in px.
      These overrides lock the normal row/header text to the same intended sizes
      across macOS, Windows, and PNG exports without touching the fixed bubble/time text.
    */
    :root {
      --fixedBoardHeaderFontSize: 12px;
      --fixedBoardRowFontSize: 14px;
      --fixedBoardSecondaryFontSize: 10.5px;
    }

    .leaderboardBoardHeadCell,
    .questionBoardHeadCell,
    .prizeBoardHeadCell,
    .prizeTotalLabelCell {
      font-size: var(--fixedBoardHeaderFontSize) !important;
    }

    .leaderboardBoardCell,
    .leaderboardBoardRankCell,
    .leaderboardBoardRankCell .rankOrdinal,
    .leaderboardBoardTeamCell .teamNameLine,
    .questionBoardCell,
    .prizeBoardCell,
    .prizeTeamCell .teamNameLine,
    .prizeBoardEmpty,
    .leaderboardBoardEmpty,
    .sportsStandingsPlaceholderRow,
    .sportsSubmissionsBattleEmpty .sportsSubmissionsBattleCell {
      font-size: var(--fixedBoardRowFontSize) !important;
    }

    html.platformWindows .questionBoardCell.questionTeamCell .teamNameLine {
      font-size: var(--fixedBoardRowFontSize) !important;
    }

    .questionBoardCell.questionTeamCell .teamPlayersText,
    .questionPlayerName {
      font-size: var(--fixedBoardSecondaryFontSize) !important;
    }

    .leaderboardBoardCell .lbScoreNum,
    .leaderboardBoardCell .lbTotalScore,
    .qScoreNum,
    .lbScoreNum,
    .lbTotalScore {
      font-size: 1em;
    }

    /* Fixed sidebar/message typography and active left-sidebar text glow */
    .sideNavText,
    .sideNavSubBtnText {
      font-size: 14px !important;
    }

    .rightSidebarMessageText,
    .rightSidebarMessageUser,
    .rightSidebarMessageBody {
      font-size: 13px !important;
      line-height: 22px !important;
    }

    .rightSidebarTopMessageText {
      font-size: 12px !important;
    }

    .sideNavBtn.active .sideNavText,
    .sideNavSubBtn.active .sideNavSubBtnText {
      text-shadow: rgb(255, 93, 0) 0px 0px 8px !important;
      filter: none !important;
    }

    .sideNavBtn.active .sideNavText::before,
    .sideNavBtn.active .sideNavText::after,
    .sideNavSubBtn.active .sideNavSubBtnText::before,
    .sideNavSubBtn.active .sideNavSubBtnText::after {
      opacity: 0 !important;
      filter: none !important;
    }


    /* Header dropdown menu colour overrides */
    .headerExportMenuBtn,
    .headerImportMenuBtn {
      background: #252935 !important;
      color: #FFFFFF !important;
      opacity: 1 !important;
      filter: none !important;
    }

    .headerExportMenuBtn:hover,
    .headerExportMenuBtn:active,
    .headerExportMenuBtn:focus,
    .headerExportMenuBtn:focus-visible,
    .headerImportMenuBtn:hover,
    .headerImportMenuBtn:active,
    .headerImportMenuBtn:focus,
    .headerImportMenuBtn:focus-visible {
      background: #2A2D3A !important;
      color: #FFFFFF !important;
      filter: none !important;
    }

    .headerExportMenuBtn:disabled,
    .headerImportMenuBtn:disabled {
      background: #252935 !important;
      color: #FFFFFF !important;
      opacity: 1 !important;
      filter: none !important;
    }

    .headerExportMenuBtn:disabled:hover,
    .headerExportMenuBtn:disabled:active,
    .headerImportMenuBtn:disabled:hover,
    .headerImportMenuBtn:disabled:active {
      background: #2A2D3A !important;
      color: #FFFFFF !important;
      opacity: 1 !important;
      filter: none !important;
    }

    .headerImportMenuBtn.loadedImport,
    .headerImportMenuBtn.loadedImport:hover,
    .headerImportMenuBtn.loadedImport:active,
    .headerImportMenuBtn.loadedImport:focus,
    .headerImportMenuBtn.loadedImport:focus-visible {
      background: #161821 !important;
      color: #FFFFFF !important;
      opacity: 1 !important;
      filter: none !important;
    }

    .headerImportMenuBtn.removedFeedback,
    .headerImportMenuBtn.removedFeedback:hover,
    .headerImportMenuBtn.removedFeedback:active,
    .headerImportMenuBtn.removedFeedback:focus,
    .headerImportMenuBtn.removedFeedback:focus-visible {
      background: #252935 !important;
      color: #FFFFFF !important;
      opacity: 1 !important;
      filter: none !important;
    }

    .headerImportMenuBtn.removedFeedback:hover,
    .headerImportMenuBtn.removedFeedback:active,
    .headerImportMenuBtn.removedFeedback:focus,
    .headerImportMenuBtn.removedFeedback:focus-visible {
      background: #2A2D3A !important;
    }

    .headerExportMenuBtn *,
    .headerImportMenuBtn * {
      color: #FFFFFF !important;
    }

    .headerExportMenuIcon,
    .headerImportMenuIcon,
    .loadedImportRemoveContent,
    .loadedImportRemoveContent *,
    .headerExportMenuBtn svg,
    .headerImportMenuBtn svg {
      color: #B2B6C5 !important;
      fill: #B2B6C5 !important;
      stroke: #B2B6C5 !important;
    }

    .headerExportMenuBtn svg *,
    .headerImportMenuBtn svg * {
      fill: #B2B6C5 !important;
      stroke: #B2B6C5 !important;
    }




    /* Fixed import dropdown sizing and loaded CSV radio-dot indicator */


    .headerImportMenuBtn {
      width: 328px !important;
      min-width: 328px !important;
      max-width: 328px !important;
      height: 69.59px !important;
      min-height: 69.59px !important;
      max-height: 69.59px !important;
      padding: 12px 12px !important;
      border-radius: 10px !important;
    }

    .headerImportMenuBtn.loadedImport {
      padding-right: 9px !important;
    }

    .headerImportMenuBtn.loadedImport,
    .headerImportMenuBtn.loadedImport .loadedImportReadyContent {
      overflow: visible !important;
    }

    .headerImportLoadedRadio {
      position: relative;
      width: 30px;
      height: 30px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 30px;
      color: inherit !important;
      overflow: visible !important;
      isolation: isolate;
    }

    .headerImportLoadedRadio .css-1cwz9v1 {
      position: absolute;
      opacity: 0;
      pointer-events: none;
      width: 1px;
      height: 1px;
      margin: 0;
    }

    .headerImportLoadedRadio .css-13ahkye {
      position: relative;
      display: inline-block;
      width: 30px;
      height: 30px;
      min-width: 30px;
      cursor: default;
      pointer-events: none;
      overflow: visible !important;
    }

    .headerImportLoadedRadio .css-13ahkye::before {
      content: "";
      position: absolute;
      top: 6px;
      left: 6px;
      height: 18px;
      width: 18px;
      border: 1px solid rgb(48, 53, 69) !important;
      border-radius: 99px;
      background: rgb(16, 18, 27) !important;
      box-shadow: none;
      box-sizing: border-box;
      overflow: visible !important;
    }

    .headerImportLoadedRadio .css-dm6haw {
      display: none;
      position: absolute;
      top: 12px;
      left: 12px;
      width: 6px;
      height: 6px;
      border-radius: 99px;
      background: rgb(16, 18, 27) !important;
      box-shadow: none;
      z-index: 1;
    }

    .headerImportLoadedRadio .css-1cwz9v1:checked+.css-13ahkye::before {
      background: rgb(255, 229, 0) !important;
      box-shadow: rgb(255, 176, 25) 0px 0px 9px 0px, rgb(255, 176, 25) 0px 0px 4px inset !important;
      border: 1px solid rgb(255, 229, 0) !important;
    }

    .headerImportLoadedRadio .css-1cwz9v1:checked+.css-13ahkye .css-dm6haw {
      display: inline-block;
    }


    /* Keep opened main-sidebar arrow boxes from changing just because the main row is hovered. */
    .sideNavBtn.arrowToggled:hover .sideNavArrowBox {
      background: #2D303E;
      color: #B2B6C4;
    }

    .sideNavBtn.arrowToggled.active:hover .sideNavArrowBox {
      background: #323644;
      color: #B2B6C4;
    }

    .sideNavBtn.arrowToggled:hover .sideNavArrowBox:hover,
    .sideNavBtn.arrowToggled.active:hover .sideNavArrowBox:hover {
      background: #363B49;
      color: #B2B6C4;
    }

    /* Two-line import rows: CSV label + loaded filename, vertically centred. */
    .loadedImportReadyContent {
      align-items: center !important;
    }

    .headerImportTextStack {
      min-width: 0;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: flex-start;
      gap: 4px;
      line-height: 1;
      overflow: hidden;
    }

    .headerImportMainLabel,
    .headerImportFileName {
      display: block;
      max-width: 220px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      line-height: 1;
    }

    .headerImportMainLabel {
      font-weight: 700;
    }

    .headerImportFileName {
      color: #FFFFFF !important;
      font-weight: 500;
      font-size: 11px;
      opacity: .78;
      letter-spacing: 0;
    }




    /* Analytics How It Works popup overlay */
    #analyticsHowItWorksModal.modalBackdrop {
      display: flex;
      -webkit-box-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      align-items: center;
      min-height: 100%;
      padding: 50px;
      background: #10121b99;
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
      pointer-events: auto;
      z-index: 50000;
      overscroll-behavior: contain;
      touch-action: none;
    }

    #analyticsHowItWorksModal .analyticsHowItWorksModalCard {
      touch-action: pan-y;
    }

    #analyticsHowItWorksModal .analyticsHowItWorksModalCard {
      pointer-events: auto;
      position: relative;
      z-index: 1;
    }

    .analyticsHowItWorksCloseBtn {
      border-radius: 0;
      background: transparent !important;
      transition: color .12s ease;
    }

    .analyticsHowItWorksCloseBtn:hover,
    .analyticsHowItWorksCloseBtn:active,
    .analyticsHowItWorksCloseBtn:focus,
    .analyticsHowItWorksCloseBtn:focus-visible {
      background: transparent !important;
      box-shadow: none !important;
      outline: none !important;
      color: #FFFFFF;
      filter: none;
      transform: none;
    }

    .leaderboardPrizePoolBadge:has(.analyticsHowItWorksBtn) {
      padding: 0;
      cursor: pointer;
    }

    .leaderboardPrizePoolBadge:has(.analyticsHowItWorksBtn):hover {
      background: rgba(203, 215, 255, 0.07);
      filter: brightness(1.03);
    }

    .leaderboardPrizePoolBadge .analyticsHowItWorksBtn {
      width: 100%;
      min-width: 100%;
      max-width: 100%;
      height: 100%;
      min-height: 100%;
      max-height: 100%;
      padding: 0;
      margin: 0;
      border-radius: inherit;
      background: transparent !important;
      box-shadow: none !important;
      outline: none !important;
      filter: none;
    }

    .leaderboardPrizePoolBadge .analyticsHowItWorksBtn:hover,
    .leaderboardPrizePoolBadge .analyticsHowItWorksBtn:active,
    .leaderboardPrizePoolBadge .analyticsHowItWorksBtn:focus,
    .leaderboardPrizePoolBadge .analyticsHowItWorksBtn:focus-visible {
      background: transparent !important;
      box-shadow: none !important;
      outline: none !important;
      filter: none;
      color: #FFFFFF;
    }
  

    /* Collapsed left sidebar Rollbit-style icon mode */
    body.sidebarCollapsed .leftSidePanel {
      width: 40px;
      overflow-x: hidden;
    }

    body.sidebarCollapsed .leftSidePanelInner {
      padding: 0;
      gap: 0;
      align-items: stretch;
    }

    body.sidebarCollapsed .sideNavGroup {
      width: 40px;
      gap: 0;
    }

    body.sidebarCollapsed .sideNavFooter {
      order: -1;
      width: 40px;
      height: 40px;
      margin: 0;
      padding: 0;
      justify-content: center;
      align-items: center;
      flex: 0 0 40px;
    }

    body.sidebarCollapsed .sidebarToggleBtn {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 40px;
      min-width: 40px;
      max-width: 40px;
      height: 40px;
      min-height: 40px;
      max-height: 40px;
      flex: 0 0 40px;
      padding: 0;
      margin: 0;
      border: 0;
      border-radius: 0;
      background: transparent;
      color: #b1b6c6;
      cursor: pointer;
      user-select: none;
      box-shadow: none;
      filter: none;
      transform: none;
    }

    body.sidebarCollapsed .sidebarToggleBtn:not(:disabled):hover,
    body.sidebarCollapsed .sidebarToggleBtn:active {
      background: rgba(203, 215, 255, 0.03);
      color: #b1b6c6;
      box-shadow: none;
      filter: none;
      transform: none;
    }

    body.sidebarCollapsed .sidebarToggleIcon {
      width: 23px;
      min-width: 23px;
      height: auto;
      flex: 0 0 23px;
      fill: currentColor;
      color: currentColor;
      transform: rotate(180deg);
    }

    body.sidebarCollapsed .sideNavBtn {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 40px;
      min-width: 40px;
      max-width: 40px;
      height: 40px;
      min-height: 40px;
      max-height: 40px;
      padding: 0;
      margin: 0;
      border-radius: 0;
      background: transparent;
      color: #b1b6c6;
      gap: 0;
      box-shadow: none;
      filter: none;
      transform: none;
    }

    body.sidebarCollapsed .sideNavBtn:hover,
    body.sidebarCollapsed .sideNavBtn:active,
    body.sidebarCollapsed .sideNavBtn.active:hover,
    body.sidebarCollapsed .sideNavBtn.arrowToggled:hover,
    body.sidebarCollapsed .sideNavBtn.arrowToggled:active {
      background: rgba(203, 215, 255, 0.03);
      color: #b1b6c6;
      box-shadow: none;
      filter: none;
      transform: none;
    }

    body.sidebarCollapsed .sideNavBtn.active,
    body.sidebarCollapsed .sideNavBtn.arrowToggled,
    body.sidebarCollapsed .sideNavBtn.arrowToggled.active {
      background: transparent;
      color: #b1b6c6;
      box-shadow: none;
      filter: none;
      transform: none;
    }

    body.sidebarCollapsed .sideNavLabelWrap {
      width: 40px;
      min-width: 40px;
      max-width: 40px;
      height: 40px;
      flex: 0 0 40px;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 0;
    }

    body.sidebarCollapsed .sideNavText,
    body.sidebarCollapsed .sideNavArrowBox,
    body.sidebarCollapsed .sideNavSubGroup {
      display: none !important;
    }

    body.sidebarCollapsed .sideNavGlyph,
    body.sidebarCollapsed .sideNavBtn.arrowToggled .sideNavGlyph {
      width: 20px;
      min-width: 20px;
      height: 20px;
      flex: 0 0 20px;
      margin: 0;
      padding: 0;
      transform: none;
      color: #b1b6c6;
      fill: currentColor;
      font-size: 16px;
    }

    body.sidebarCollapsed .sideNavBtn:hover .sideNavGlyph {
      color: #FFFFFF;
    }

    body.sidebarCollapsed .sideNavBtn.active .sideNavGlyph,
    body.sidebarCollapsed .sideNavBtn.active:hover .sideNavGlyph {
      color: #ffffc1;
    }

    body.sidebarCollapsed .sideNavGlyph::before,
    body.sidebarCollapsed .sideNavBtn:hover .sideNavGlyph::before {
      opacity: 0;
      transform: translate(-50%, -50%) scale(.76);
      filter: blur(6.5px);
    }

    body.sidebarCollapsed .sideNavBtn.active .sideNavGlyph::before,
    body.sidebarCollapsed .sideNavBtn.active:hover .sideNavGlyph::before {
      opacity: 1;
      transform: translate(-50%, -50%) scale(.86);
      filter: blur(7.5px);
    }

    body.sidebarCollapsed .sideNavGlyph svg {
      display: block;
      width: 100%;
      height: 100%;
      fill: currentColor;
      color: currentColor;
    }

    body.sidebarCollapsed .sideNavGlyph.questionGlyph svg,
    body.sidebarCollapsed .sideNavGlyph.questionNumberGlyph svg {
      width: 99%;
      height: 99%;
    }

    body.sidebarCollapsed .sideNavGlyph.leaderboardGlyph svg,
    body.sidebarCollapsed .sideNavGlyph.resultsGlyph svg,
    body.sidebarCollapsed .sideNavGlyph.analyticsGlyph svg,
    body.sidebarCollapsed .sideNavGlyph.exportGlyph svg {
      width: 86%;
      height: 86%;
    }

    body.sidebarCollapsed .sideNavGlyph.prizesGlyph {
      padding-top: 1px;
      padding-bottom: 1px;
    }

    body.sidebarCollapsed .sideNavGlyph.prizesGlyph svg {
      width: 82%;
      height: 82%;
    }


    /* Final sidebar fixes: selected hover fill, unclipped Results glyph, no toggle rotation animation */
    .sidebarToggleIcon {
      transition: none !important;
    }

    .sideNavBtn.active:hover {
      background: rgba(203, 215, 255, 0.03);
      color: #B2B6C4;
      transform: none;
    }

    body.sidebarCollapsed .sideNavBtn.active:hover,
    body.sidebarCollapsed .sideNavBtn.arrowToggled.active:hover {
      background: rgba(203, 215, 255, 0.03) !important;
      color: #b1b6c6;
      box-shadow: none;
      filter: none;
      transform: none;
    }

    body.sidebarCollapsed .sideNavBtn.active:hover .sideNavGlyph,
    body.sidebarCollapsed .sideNavBtn.arrowToggled.active:hover .sideNavGlyph {
      color: #ffffc1;
    }

    .sideNavGlyph.resultsGlyph,
    body.sidebarCollapsed .sideNavGlyph.resultsGlyph {
      overflow: visible;
    }

    .sideNavGlyph.resultsGlyph svg,
    body.sidebarCollapsed .sideNavGlyph.resultsGlyph svg {
      overflow: visible;
      width: 88%;
      height: 88%;
      transform: translateZ(0);
    }

    .sideNavGlyph.standingsGlyph,
    body.sidebarCollapsed .sideNavGlyph.standingsGlyph,
    .sideNavGlyph.worldCupGlyph,
    body.sidebarCollapsed .sideNavGlyph.worldCupGlyph {
      overflow: visible;
    }

    .sideNavGlyph.standingsGlyph svg,
    body.sidebarCollapsed .sideNavGlyph.standingsGlyph svg {
      overflow: visible;
      width: 110.4%;
      height: 110.4%;
      transform: translateZ(0);
    }

    .sideNavGlyph.worldCupGlyph svg,
    body.sidebarCollapsed .sideNavGlyph.worldCupGlyph svg {
      overflow: visible;
      width: 110%;
      height: 110%;
      transform: translateZ(0);
    }

    .sideNavGlyph.worldCupGlyph svg path,
    .sideNavGlyph.worldCupGlyph svg rect {
      fill: revert-layer;
    }
    .sideNavGlyph.worldCupGlyph svg rect,
    body.sidebarCollapsed .sideNavGlyph.worldCupGlyph svg rect {
      display: none !important;
    }


    /* Fixed trivia import CSV filename layout:
       - no ellipsis clipping for imported names
       - filename can use the full remaining space beside the trash icon
       - trash icon sits closer to the text stack */
    .questionImportDropButton.loaded {
      gap: 6px;
      align-items: center;
    }

    .questionImportDropButton.loaded .loadedImportReadyContent {
      flex: 1 1 auto;
      width: auto;
      min-width: 0;
      max-width: none;
      gap: 10px;
      overflow: visible !important;
    }

    .questionImportDropButton.loaded .headerImportTextStack {
      flex: 1 1 auto;
      min-width: 0;
      max-width: none;
      overflow: visible !important;
    }

    .questionImportDropButton.loaded .loadedImportReadyContent span {
      overflow: visible !important;
      text-overflow: clip !important;
    }

    .questionImportDropButton.loaded .questionImportDropFileName {
      display: block;
      width: 100%;
      max-width: none;
      overflow: visible !important;
      text-overflow: clip !important;
      white-space: normal !important;
      overflow-wrap: anywhere;
      word-break: break-word;
      line-height: 1.12;
    }

    .questionImportDropButton.loaded .loadedImportRemoveContent {
      width: 24px;
      min-width: 24px;
      height: 30px;
      margin-left: 2px;
      padding: 0;
      flex: 0 0 24px;
    }

    .questionImportDropButton.loaded .loadedImportRemoveContent .headerImportMenuIcon {
      width: 23px;
      min-width: 23px;
      padding: 2px;
    }


    /* Event setup final overrides: narrower answer columns and exact trashcan hover colours. */
    .eventSetupTable.optionCount2 col.eventSetupQuestionCol { width: 74.5% !important; }
    .eventSetupTable.optionCount2 col.eventSetupOptionCol { width: 12.75% !important; }
    .eventSetupTable.optionCount3 col.eventSetupQuestionCol { width: 61.75% !important; }
    .eventSetupTable.optionCount3 col.eventSetupOptionCol { width: 12.75% !important; }
    .eventSetupTable.optionCount4 col.eventSetupQuestionCol { width: 52.4% !important; }
    .eventSetupTable.optionCount4 col.eventSetupOptionCol { width: 11.9% !important; }
    .eventSetupTable.optionCount5 col.eventSetupQuestionCol { width: 44.75% !important; }
    .eventSetupTable.optionCount5 col.eventSetupOptionCol { width: 11.05% !important; }

    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn,
    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn .headerImportMenuIcon,
    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn .headerImportMenuIcon *,
    .eventSetupDeleteRowBtn,
    .eventSetupDeleteRowBtn .headerImportMenuIcon,
    .eventSetupDeleteRowBtn .headerImportMenuIcon *,
    .eventSetupDeleteOptionBtn,
    .eventSetupDeleteOptionBtn .headerImportMenuIcon,
    .eventSetupDeleteOptionBtn .headerImportMenuIcon * {
      color: #B2B6C4 !important;
      fill: currentColor !important;
      stroke: none !important;
    }

    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn:hover,
    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn:hover .headerImportMenuIcon,
    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn:hover .headerImportMenuIcon *,
    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn:active,
    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn:active .headerImportMenuIcon,
    .eventSetupRowDeleteStack .eventSetupDeleteRowBtn:active .headerImportMenuIcon *,
    .eventSetupDeleteRowBtn:hover,
    .eventSetupDeleteRowBtn:hover .headerImportMenuIcon,
    .eventSetupDeleteRowBtn:hover .headerImportMenuIcon *,
    .eventSetupDeleteRowBtn:active,
    .eventSetupDeleteRowBtn:active .headerImportMenuIcon,
    .eventSetupDeleteRowBtn:active .headerImportMenuIcon *,
    .eventSetupDeleteOptionBtn:hover,
    .eventSetupDeleteOptionBtn:hover .headerImportMenuIcon,
    .eventSetupDeleteOptionBtn:hover .headerImportMenuIcon *,
    .eventSetupDeleteOptionBtn:active,
    .eventSetupDeleteOptionBtn:active .headerImportMenuIcon,
    .eventSetupDeleteOptionBtn:active .headerImportMenuIcon * {
      color: #FFFFFF !important;
      fill: currentColor !important;
      stroke: none !important;
    }



    /*
      Final fixed-width scroll refinements:
      1) Keep the same visual gutter on the left edge of the right sidebar even
         when the central content is horizontally hidden underneath it. This
         attached gutter matches the visible gap from the left sidebar edge to
         the start of the page content: --pageSidePad plus the 18px board shell inset.
      2) Stop the leaderboard UTC day/month/year boxes from reflowing/moving on
         narrow browser widths. The fixed board is allowed to be clipped and
         horizontally scrolled instead.
    */
    .rightSidePanel {
      box-shadow: none;
      overflow: visible;
      z-index: 22;
    }

    .leftSidePanel {
      z-index: 22;
    }

    /*
      The extra gutter that visually belongs to the right sidebar is drawn as a
      page-level overlay instead of as part of the fixed sidebar itself. That
      lets the bottom blue area sit above only this gutter while staying below
      the actual left and right sidebars, so the footer remains one continuous
      blue block when scrolling.
    */
    body::before,
    body::after {
      content: "";
      position: fixed;
      top: calc(var(--headerHeight) + 1px);
      bottom: 0;
      background: var(--appBg);
      pointer-events: none;
      z-index: 19;
    }

    body::before {
      left: var(--leftSidePanelWidth);
      width: var(--leftSidebarAttachedPad);
    }

    body::after {
      right: var(--rightSidePanelWidth);
      width: var(--rightSidebarAttachedPad);
    }

    body.sidebarCollapsed::before {
      left: var(--leftSidePanelCollapsedWidth);
    }

    body.rightSidebarClosed::after {
      display: none;
    }

    .globalBottomArea {
      position: relative;
      z-index: 20;
    }

    .rightSidePanelInner {
      overflow: hidden;
    }

    @media (max-width: 860px) {
      .leaderboardBoardTopBox {
        height: 210px !important;
        min-height: 210px !important;
        padding: 32px 32px !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 218px !important;
        background-size: cover !important;
        background-position: center !important;
      }

      .leaderboardRaceTitle {
        white-space: nowrap !important;
      }

      .leaderboardUtcDatePanel {
        margin-left: 0 !important;
        align-self: auto !important;
        flex: 0 0 auto !important;
      }

      .leaderboardUtcDateGrid {
        gap: 16px !important;
      }

      .leaderboardUtcDateBox {
        width: 73.16px !important;
        min-width: 73.16px !important;
        max-width: 73.16px !important;
        height: 80.8px !important;
        min-height: 80.8px !important;
        max-height: 80.8px !important;
        padding: 0 !important;
        font-size: 32px !important;
        flex: 0 0 73.16px !important;
      }
    }


    .sportsStandingsMount {
      width: 100%;
      max-width: var(--tableAreaFixedWidth);
      margin: 0 auto;
      padding: 0 0 24px;
    }

    .sportsStandingsCapture {
      --sportsStandingsRadius: 4px;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 0;
      overflow: hidden;
      padding: 0 18px;
      box-sizing: border-box;
    }

    .sportsStandingsHeaderRow,
    .sportsStandingsScoreBox {
      display: grid;
      grid-template-columns: minmax(0, 84px) 5px minmax(0, 1fr) 3px minmax(0, 82px);
      align-items: center;
      column-gap: 0;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      box-sizing: border-box;
      padding: 0 24px;
    }

    .sportsStandingsHeaderRow > :nth-child(1),
    .sportsStandingsScoreBox > :nth-child(1) {
      grid-column: 1;
    }

    .sportsStandingsHeaderRow > :nth-child(2),
    .sportsStandingsScoreBox > :nth-child(2) {
      grid-column: 3;
    }

    .sportsStandingsHeaderRow > :nth-child(3),
    .sportsStandingsScoreBox > :nth-child(3) {
      grid-column: 5;
    }

    .sportsStandingsHeaderRow {
      min-height: calc(var(--sideNavButtonHeight) * 0.8738);
      height: calc(var(--sideNavButtonHeight) * 0.8738);
      border-radius: var(--sportsStandingsRadius);
      background: #cbd7ff08;
      border: none;
      box-shadow: none;
    }

    .sportsStandingsHeadCell {
      color: #686D7B;
      font-size: clamp(12px, .85vw, 16px);
      font-weight: 600;
      letter-spacing: .02em;
      text-transform: uppercase;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      text-align: left;
      line-height: 1.1;
    }

    .sportsStandingsHeadCell:last-child {
      text-align: right;
    }

    .sportsStandingsScoreList {
      display: flex;
      flex-direction: column;
      gap: 4px;
      width: 100%;
      min-width: 0;
      margin-top: 4px;
      overflow: visible;
    }

    .sportsStandingsScoreBox,
    .sportsStandingsEmptyCard {
      width: 100%;
      border-radius: var(--sportsStandingsRadius);
      background: #cbd7ff08;
      border: none;
      box-shadow: none;
    }

    .sportsStandingsScoreBox {
      min-height: calc(var(--sideNavButtonHeight) * 1.3514);
      height: auto;
      padding-top: 7px;
      padding-bottom: 7px;
      overflow: visible;
      transition: background .12s ease;
    }

    .sportsStandingsPlaceholderRow {
      min-height: calc(var(--sideNavButtonHeight) * 1.3514);
      height: auto;
      padding: 0 24px;
      border-radius: var(--sportsStandingsRadius);
      background: #cbd7ff08;
      color: #808696;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      text-align: left;
      font-size: clamp(14px, 1vw, 20px);
      font-weight: 500;
      line-height: 1.15;
    }

    .sportsStandingsScoreBox:hover {
      background: #252734;
    }

    .sportsStandingsScoreBox.isEmptyScore {
      background: rgba(203, 215, 255, 0.025);
      opacity: 0.58;
    }

    .sportsStandingsScoreBox.isEmptyScore:hover {
      background: rgba(203, 215, 255, 0.04);
    }

    .sportsStandingsScoreBox.isEmptyScore .sportsStandingsScoreNumber,
    .sportsStandingsScoreBox.isEmptyScore .sportsStandingsNamesList,
    .sportsStandingsScoreBox.isEmptyScore .sportsStandingsPlayerCount {
      color: rgba(255, 255, 255, 0.56);
      text-shadow: none;
    }

    .sportsStandingsScoreNumber,
    .sportsStandingsNamesList,
    .sportsStandingsPlayerCount {
      min-width: 0;
      color: #FFFFFF;
      font-size: clamp(14px, 1vw, 20px);
      font-weight: 500;
      line-height: 1.15;
      padding: 8px 0;
    }

    .sportsStandingsScoreNumber {
      font-variant-numeric: tabular-nums;
      font-weight: 700;
      font-size: 50px !important;
      letter-spacing: -0.03em;
      font-family: "Geogrotesque Wide Banner", "Geogrotesque Wide", sans-serif !important;
    }

    .sportsStandingsScoreBox.isTopScore .sportsStandingsScoreNumber {
      color: rgb(165, 255, 129);
      text-shadow: rgba(59, 198, 14, 0.5) 0px 0px 10px;
    }

    .sportsStandingsNamesList {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 4px 10px;
      width: 100%;
      min-width: 0;
      overflow: hidden;
    }

    .sportsStandingsName {
      max-width: 100%;
      color: #FFFFFF;
      font-size: clamp(13px, .95vw, 18px);
      font-weight: 500;
      line-height: 1.15;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .sportsStandingsPlayerCount {
      text-align: right;
      font-variant-numeric: tabular-nums;
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      gap: 1px;
      color: #FFFFFF;
    }

    .sportsStandingsPlayerCountIcon {
      width: 20px;
      height: 20px;
      display: block;
      flex: 0 0 20px;
      color: currentColor;
      fill: currentColor;
      margin-left: 2px;
      pointer-events: none;
    }

    .sportsStandingsPlayerCountIcon path,
    .sportsStandingsPlayerCountIcon g {
      fill: currentColor !important;
    }

    .sportsStandingsEmptyCard {
      min-height: calc(var(--sideNavButtonHeight) * 1.62);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 22px 24px;
      text-align: center;
      background: #cbd7ff08;
    }

    .sportsStandingsEmptyTitle {
      color: #FFFFFF;
      font-weight: 700;
      font-size: 18px;
      line-height: 1.1;
    }

    .sportsStandingsEmptyText {
      max-width: 560px;
      color: var(--muted);
      font-weight: 500;
      font-size: 13px;
      line-height: 1.45;
    }

    @media (max-width: 760px) {
      .sportsStandingsHeaderRow,
      .sportsStandingsScoreBox {
        grid-template-columns: minmax(0, 62px) 4px minmax(0, 1fr) 2px minmax(0, 54px);
        column-gap: 0;
        padding-left: 14px;
        padding-right: 14px;
      }

      .sportsStandingsHeadCell,
      .sportsStandingsScoreNumber,
      .sportsStandingsNamesList,
      .sportsStandingsPlayerCount,
      .sportsStandingsName {
        font-size: 12px;
      }

      .sportsStandingsScoreNumber {
        font-size: 50px !important;
      }
    }


    /* Fixed sizing overrides for Sports Picks submissions and standings.
       These stop the sports tables from shrinking/reflowing when the viewport narrows,
       matching the fixed board behaviour used by the Rollbitrivia tables. */
    .sportsSubmissionsTableWrap {
      width: 100%;
      min-width: 620px;
      overflow: visible;
    }

    .sportsSubmissionsBattleTable {
      min-width: 620px !important;
      flex: 0 0 auto;
    }

    .sportsSubmissionsBattleHeadCell {
      font-size: 12px !important;
    }

    .sportsSubmissionsBattleCell {
      font-size: 14px !important;
    }

    .sportsSubmissionsBattleAnswerText,
    .sportsSubmissionsBattleHeadCellWithIcon {
      font-size: inherit !important;
    }

    .sportsStandingsMount {
      width: 100%;
      max-width: var(--tableAreaFixedWidth);
      min-width: var(--tableAreaFixedWidth);
      margin: 0 auto;
      padding: 0 0 24px;
      flex: 0 0 auto;
    }

    .sportsStandingsCapture {
      width: 100%;
      max-width: 100%;
      min-width: var(--tableAreaFixedWidth);
      flex: 0 0 auto;
      overflow: visible;
    }

    .sportsStandingsHeaderRow,
    .sportsStandingsScoreBox {
      grid-template-columns: minmax(0, 65px) 15px minmax(0, 1fr) 0px minmax(0, 52px) !important;
      padding-left: 24px !important;
      padding-right: 24px !important;
      width: 100%;
      max-width: 100%;
      min-width: 0;
    }

    .sportsStandingsHeadCell {
      font-size: 12px !important;
    }

    .sportsStandingsNamesList,
    .sportsStandingsPlayerCount {
      font-size: 16px !important;
    }

    .sportsStandingsName {
      font-size: 15px !important;
    }

    .sportsStandingsScoreNumber {
      font-size: 50px !important;
    }

    @media (max-width: 760px) {
      .sportsStandingsMount,
      .sportsStandingsCapture {
        min-width: var(--tableAreaFixedWidth) !important;
      }

      .sportsStandingsHeaderRow,
      .sportsStandingsScoreBox {
        grid-template-columns: minmax(0, 84px) 5px minmax(0, 1fr) 3px minmax(0, 82px) !important;
        padding-left: 24px !important;
        padding-right: 24px !important;
      }

      .sportsStandingsHeadCell { font-size: 12px !important; }
      .sportsStandingsNamesList,
      .sportsStandingsPlayerCount { font-size: 16px !important; }
      .sportsStandingsName { font-size: 15px !important; }
      .sportsStandingsScoreNumber { font-size: 50px !important; }
    }

    /* Final standings alignment fix.
       The sports results page already sits inside .questionPageShell, which provides
       the same 18px left/right board inset used by the analytics/prize board shell.
       The previous standings rules added another 18px inset and forced the standings
       wrapper to the full fixed table width inside that inset, which pushed the table
       too far right and let the right edge sit underneath the right sidebar gutter.
       Keep the fixed page/container behaviour, but make the standings table use the
       shell's available board width exactly like the analytics rows do. */
    .sportsStandingsMount {
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      margin: 0 !important;
      padding: 0 0 24px !important;
      flex: 0 0 auto !important;
      box-sizing: border-box !important;
    }

    .sportsStandingsCapture {
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      padding-left: 0 !important;
      padding-right: 0 !important;
      margin: 0 !important;
      flex: 0 0 auto !important;
      box-sizing: border-box !important;
      overflow: visible !important;
    }

    .sportsStandingsHeaderRow,
    .sportsStandingsScoreBox {
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      box-sizing: border-box !important;
    }



    /* Sports Picks standings top banner copied from the Rollbitrivia leaderboard top box. */
    .sportsStandingsTopBox {
      width: 100%;
      max-width: 100%;
      min-width: 0;
      height: 210px;
      min-height: 210px;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 218px;
      padding: 32px 32px;
      margin: var(--pageSidePad) 0 28px;
      position: relative;
      overflow: hidden;
      background-color: rgb(31, 35, 48);
      background-image: url("/assets/wc_banner.png");
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      border-radius: 8px;
      border: none;
      box-shadow: none;
      box-sizing: border-box;
      color: rgb(255, 255, 255);
      text-transform: uppercase;
      flex: 0 0 auto;
    }

    .worldCupPanel[data-world-cup-panel="group"] .sportsStandingsTopBox,
    .sportsStandingsTopBox.worldCupGroupStageTopBox {
      background-image: url("/assets/group_stage.png");
    }


    .sportsStandingsTopBox,
    .sportsStandingsTopBox * {
      font-family: "Geogrotesque Wide", sans-serif !important;
      font-weight: 800 !important;
      font-style: italic !important;
    }

    .sportsStandingsTopBox .leaderboardRaceTitle {
      margin: 0;
      padding: 0;
    }

    .sportsStandingsTopBox .leaderboardPrizePoolBadge,
    .sportsStandingsTopBox .leaderboardPrizePoolBadge * {
      font-style: normal !important;
    }

    @media (max-width: 760px) {
      .sportsStandingsMount,
      .sportsStandingsCapture {
        min-width: 0 !important;
      }
    }



    /* Fixed-size text and tall-screen empty-state footer fixes. */
    .eventSetupTimestampTable th,
    .eventSetupTimestampTable td,
    #eventSetupCurrentLocalTime,
    #eventSetupCurrentUtcTime {
      font-size: 14px !important;
      line-height: 1.15 !important;
      text-size-adjust: 100%;
      -webkit-text-size-adjust: 100%;
    }

    .eventSetupTimestampTable thead th {
      font-size: 12px !important;
      line-height: 1.1 !important;
    }

    .eventSetupTimestampInput,
    .eventSetupTimestampOutput {
      font-size: 13px !important;
      line-height: 1 !important;
      text-size-adjust: 100%;
      -webkit-text-size-adjust: 100%;
    }

    .questionBoardEmpty {
      font-size: 14px !important;
      line-height: 1.15 !important;
      text-size-adjust: 100%;
      -webkit-text-size-adjust: 100%;
    }

    /*
      On taller Windows displays, short empty/missing CSV states used to let the
      footer start too high. This keeps the page content tall enough that the
      bottom blue area sits at the bottom of the visible screen instead of
      floating in the middle of the content area.
    */
    .contentArea {
      min-height: calc(100vh - var(--headerHeight) - var(--bottomPageAreaHeight) - var(--bottomPageAreaGap));
    }

    .container {
      min-height: inherit;
    }
