
  

  
  @property --page {
  syntax: "<color>";
  inherits: true;
  initial-value: #21151D;
}
@property --strip {
  syntax: "<color>";
  inherits: true;
  initial-value: #2F1E2A;
}
@property --accent {
  syntax: "<color>";
  inherits: true;
  initial-value: #B57DA4;
}
@property --booked {
  syntax: "<color>";
  inherits: true;
  initial-value: #271923;
}
@property --heroBg {
  syntax: "<color>";
  inherits: true;
  initial-value: #F5F0E8;
}
@property --raised {
  syntax: "<color>";
  inherits: true;
  initial-value: #2B1C27;
}
@property --bandRed {
  syntax: "<color>";
  inherits: true;
  initial-value: #E5534B;
}
@property --siteUrl {
  syntax: "*";
  inherits: true;
  initial-value: https://gms.ttrpgoblin.com;
}
@property --backdrop {
  syntax: "<color>";
  inherits: true;
  initial-value: #180F15;
}
@property --controls {
  syntax: "<color>";
  inherits: true;
  initial-value: #412A3A;
}
@property --gamesUrl {
  syntax: "*";
  inherits: true;
  initial-value: https://games.ttrpgoblin.com;
}
@property --hairline {
  syntax: "<color>";
  inherits: true;
  initial-value: #432D3D;
}
@property --heroChip {
  syntax: "<color>";
  inherits: true;
  initial-value: #E7E0D3;
}
@property --shopLine {
  syntax: "<color>";
  inherits: true;
  initial-value: #69485F;
}
@property --bandGreen {
  syntax: "<color>";
  inherits: true;
  initial-value: #4CC38A;
}
@property --heroTitle {
  syntax: "<color>";
  inherits: true;
  initial-value: #1F1D1A;
}
@property --textMuted {
  syntax: "<color>";
  inherits: true;
  initial-value: #AA92A3;
}
@property --bandOrange {
  syntax: "<color>";
  inherits: true;
  initial-value: #F0A13B;
}
@property --heroDetail {
  syntax: "<color>";
  inherits: true;
  initial-value: #4A463F;
}
@property --bookableDot {
  syntax: "<color>";
  inherits: true;
  initial-value: #3F9D7A;
}
@property --textPrimary {
  syntax: "<color>";
  inherits: true;
  initial-value: #F4E6F0;
}
@property --heroSecondary {
  syntax: "<color>";
  inherits: true;
  initial-value: #6D675D;
}
@property --primaryAction {
  syntax: "<color>";
  inherits: true;
  initial-value: #059669;
}
@property --textSecondary {
  syntax: "<color>";
  inherits: true;
  initial-value: #CEB6C7;
}
@property --bookableBorder {
  syntax: "<color>";
  inherits: true;
  initial-value: #366355;
}
@property --badgeBookableBg {
  syntax: "<color>";
  inherits: true;
  initial-value: #DCEFE6;
}
@property --badgeBookableText {
  syntax: "<color>";
  inherits: true;
  initial-value: #1F5A45;
}

  
  
  
  
    


@layer base {
  
  body, :host {
    /* Color */
    
    /* Fonts */
    --font-sans: 'Inter',sans-serif;
--font-Bebas Neue: 'Bebas Neue',sans-serif;

    /* Font size */
    
    /* Font weight */
    
    /* Shadows */
    
    /* Border radius */
    
    /* Spacing */
    
    /* Z-index */
    
  }
  @keyframes animation-spin {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }
  @keyframes animation-fade-in {
    from {
      opacity:0;
    }
    to {
      opacity:1;
    }
  }
  @keyframes animation-fade-out {
    from {
      opacity:1;
    }
    to {
      opacity:0;
    }
  }
}


    .eueqtR {
      color:var(--textPrimary);
      display:flex;
      padding:16px;
      font-size:15px;
      box-sizing:border-box;
      min-height:100vh;
      align-items:center;
      font-family:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
      font-weight:400;
      flex-direction:column;
      background-color:var(--backdrop);
    }

    @media (max-width: 480px) {

    .eueqtR {
      padding:0px;
    }
    }

    .eDjoRr {
      gap:6px;
      color:var(--textPrimary);
      border:none;
      cursor:pointer;
      display:inline-flex;
      padding:6px 14px;
      font-size:13px;
      align-items:center;
      font-family:inherit;
      font-weight:500;
      line-height:1.2;
      border-radius:9999px;
      flex-direction:row;
      background-color:var(--controls);
    }

    .eDjoRr:hover {
      opacity:0.9;
    }

    .eDjoRr:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .bWHenO {
      gap:24px;
      color:inherit;
      display:flex;
      padding:24px;
      font-size:inherit;
      box-sizing:border-box;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
    }

    @media (max-width: 480px) {

    .bWHenO {
      padding:16px;
    }
    }

    .eNldgS {
      color:var(--textPrimary);
      border:1px solid var(--hairline);
      cursor:pointer;
      display:inline-flex;
      padding:8px 18px;
      font-size:14px;
      box-sizing:border-box;
      min-height:44px;
      align-items:center;
      font-family:inherit;
      font-weight:500;
      border-radius:9999px;
      flex-direction:row;
      justify-content:center;
      background-color:var(--controls);
    }

    .eNldgS:hover {
      opacity:0.9;
    }

    .eNldgS:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .dkdJnu {
      color:var(--textSecondary);
      margin:0px;
      display:block;
      font-size:15px;
      font-family:inherit;
      font-weight:400;
      line-height:1.4;
      flex-direction:row;
    }

    .eKlXqr {
      gap:8px;
      color:inherit;
      border:1px solid var(--hairline);
      display:flex;
      padding:16px;
      font-size:inherit;
      box-sizing:border-box;
      font-family:inherit;
      font-weight:inherit;
      border-radius:14px;
      flex-direction:column;
      background-color:var(--raised);
    }

    .bRVkmY {
      color:inherit;
      width:100%;
      height:100%;
      display:block;
      font-size:inherit;
      object-fit:cover;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
    }

    .bEUOck {
      color:inherit;
      width:100%;
      display:flex;
      overflow:hidden;
      font-size:inherit;
      max-width:720px;
      box-sizing:border-box;
      font-family:inherit;
      font-weight:inherit;
      border-radius:24px;
      flex-direction:column;
      background-color:var(--page);
    }

    @media (max-width: 480px) {

    .bEUOck {
      border-radius:0px;
    }
    }

    .csMouT {
      color:var(--textSecondary);
      margin:0px;
      display:block;
      font-size:15px;
      max-width:52ch;
      font-family:inherit;
      font-weight:400;
      line-height:1.4;
      flex-direction:row;
    }

    .bDLOqR {
      color:var(--textPrimary);
      margin:0px;
      display:block;
      font-size:28px;
      word-break:break-word;
      font-family:inherit;
      font-weight:600;
      line-height:1.2;
      flex-direction:row;
    }

    @media (max-width: 480px) {

    .bDLOqR {
      font-size:24px;
    }
    }

    .eSBXrb {
      color:inherit;
      width:100%;
      display:flex;
      padding:10px 16px;
      font-size:inherit;
      box-sizing:border-box;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
      background-color:var(--strip);
    }

    .crcpRM {
      gap:16px;
      color:inherit;
      display:flex;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
    }

    .eYlaBT {
      gap:12px;
      color:inherit;
      border:1px solid var(--hairline);
      margin:24px;
      display:flex;
      padding:24px;
      font-size:inherit;
      box-sizing:border-box;
      align-items:flex-start;
      font-family:inherit;
      font-weight:inherit;
      border-radius:14px;
      flex-direction:column;
      background-color:var(--raised);
    }

    .bgUayH {
      color:inherit;
      display:inline;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .PMNDf {
      color:var(--textSecondary);
      margin:0px;
      display:block;
      font-size:14px;
      font-family:inherit;
      font-weight:400;
      line-height:1.4;
      flex-direction:row;
    }

    .bWodHT {
      color:var(--textSecondary);
      display:inline-flex;
      font-size:14px;
      box-sizing:border-box;
      min-height:44px;
      align-items:center;
      font-family:inherit;
      font-weight:500;
      flex-direction:row;
      text-decoration:underline;
    }

    .bWodHT:hover {
      color:var(--textPrimary);
    }

    .bWodHT:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .eOmypl {
      color:var(--textMuted);
      margin:0px;
      display:block;
      font-size:13px;
      font-family:inherit;
      font-weight:400;
      line-height:1.4;
      flex-direction:row;
    }

    .fpVkqj {
      gap:4px;
      color:var(--textSecondary);
      display:inline-flex;
      padding:6px 10px;
      font-size:12px;
      box-sizing:border-box;
      align-items:center;
      font-family:inherit;
      font-weight:500;
      line-height:1.2;
      white-space:nowrap;
      border-radius:9999px;
      flex-direction:row;
      background-color:var(--hairline);
    }

    .fpVkqj.isHero {
      color:var(--heroDetail);
      background-color:var(--heroChip);
    }

    .fpVkqj.isShop {
      color:var(--textPrimary);
      border:1px solid var(--shopLine);
      background-color:transparent;
    }

    .fpVkqj.isSystem {
      color:var(--textSecondary);
      border:none;
      background-color:var(--hairline);
    }

    .fpVkqj.isAccent {
      color:var(--accent);
      border:1px solid var(--accent);
      background-color:transparent;
    }

    .eMvqqz {
      color:var(--accent);
      display:block;
      font-size:inherit;
      flex-shrink:0;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .Chip\:accentIcon {
      color:inherit;
      display:block;
      font-size:12px;
      flex-shrink:0;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .cdzJkX {
      color:var(--textMuted);
      display:block;
      font-size:inherit;
      flex-shrink:0;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .bCOrlZ {
      color:inherit;
      display:block;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .Ehzzj {
      color:var(--textMuted);
      display:inline-flex;
      font-size:11px;
      font-family:inherit;
      font-weight:500;
      margin-left:2px;
      flex-direction:row;
    }

    .YXQrs {
      gap:8px;
      color:inherit;
      display:flex;
      flex-wrap:wrap;
      font-size:inherit;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .hYLMF {
      color:inherit;
      margin:0px;
      display:block;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .eaLHgA {
      color:var(--textPrimary);
      border:1px solid var(--hairline);
      cursor:pointer;
      display:inline-flex;
      padding:8px 18px;
      font-size:14px;
      box-sizing:border-box;
      min-height:44px;
      align-items:center;
      font-family:inherit;
      font-weight:500;
      border-radius:9999px;
      flex-direction:row;
      justify-content:center;
      text-decoration:none;
      background-color:var(--controls);
    }

    .eaLHgA:hover {
      opacity:0.9;
    }

    .eaLHgA:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .bgsmTR {
      color:var(--textMuted);
      display:block;
      font-size:12px;
      font-family:inherit;
      font-weight:400;
      flex-direction:row;
    }

    .bfCYFN {
      color:var(--textMuted);
      margin:0px;
      display:block;
      font-size:13px;
      font-family:inherit;
      font-weight:500;
      font-variant:small-caps;
      flex-direction:row;
      letter-spacing:0.06em;
      text-transform:uppercase;
    }

    .LWFpt {
      flex:1;
      color:inherit;
      display:block;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .fCWDDj {
      color:var(--textPrimary);
      margin:0px;
      display:block;
      font-size:18px;
      font-family:inherit;
      font-weight:500;
      flex-direction:row;
    }

    .bCnjGX {
      color:#FFFFFF;
      width:100%;
      height:48px;
      display:inline-flex;
      font-size:16px;
      box-sizing:border-box;
      min-height:48px;
      align-items:center;
      font-family:inherit;
      font-weight:500;
      border-radius:12px;
      flex-direction:row;
      justify-content:center;
      text-decoration:none;
      background-color:var(--primaryAction);
    }

    .bCnjGX:hover {
      opacity:0.9;
    }

    .bCnjGX:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .dlQeXy {
      gap:4px;
      color:inherit;
      width:80%;
      display:flex;
      font-size:inherit;
      min-width:0px;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
      justify-content:center;
    }

    .bAorzK {
      color:inherit;
      display:inline-flex;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      border-radius:9999px;
      flex-direction:row;
      text-decoration:none;
    }

    .bAorzK:hover {
      filter:brightness(1.15);
    }

    .bAorzK:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .btTgEE {
      gap:12px;
      color:inherit;
      display:flex;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
    }

    .bybhCJ {
      color:var(--textSecondary);
      display:inline-flex;
      padding:0 4px;
      font-size:12px;
      box-sizing:border-box;
      min-height:44px;
      align-items:center;
      font-family:inherit;
      font-weight:400;
      flex-direction:row;
      text-decoration:underline;
    }

    .bybhCJ:hover {
      color:var(--textPrimary);
    }

    .bybhCJ:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .cNMLDo {
      gap:8px;
      color:var(--textMuted);
      display:flex;
      font-size:12px;
      text-align:center;
      align-items:center;
      font-family:inherit;
      font-weight:400;
      padding-top:8px;
      flex-direction:column;
      padding-bottom:24px;
    }

    .GNrd {
      color:inherit;
      width:30px;
      height:30px;
      display:inline-block;
      font-size:inherit;
      object-fit:contain;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .rOqZt {
      color:var(--textMuted);
      border:1px solid var(--hairline);
      display:flex;
      padding:16px;
      font-size:15px;
      box-sizing:border-box;
      font-family:inherit;
      font-weight:400;
      grid-column:span 2;
      border-radius:14px;
      flex-direction:row;
      background-color:var(--raised);
    }

    .bIiEIb {
      flex-direction:column;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      color:inherit;
      display:flex;
      gap:12px;
      border:1px solid var(--hairline);
      margin:24px;
      padding:24px;
      box-sizing:border-box;
      align-items:flex-start;
      border-radius:14px;
      background-color:var(--raised);
    }

    .eryBAV {
      gap:4px;
      color:inherit;
      display:flex;
      font-size:inherit;
      margin-top:4px;
      align-items:flex-start;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
    }

    .dRDcn {
      color:var(--textMuted);
      border:none;
      cursor:pointer;
      display:inline;
      padding:0px;
      font-size:14px;
      background:transparent;
      font-family:inherit;
      font-weight:500;
      flex-direction:row;
      text-decoration:underline;
    }

    .dRDcn:hover {
      color:var(--textPrimary);
    }

    .dRDcn:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .exRA-Dq {
      color:var(--textPrimary);
      border:none;
      cursor:pointer;
      height:44px;
      display:inline-flex;
      padding:0 20px;
      font-size:15px;
      box-sizing:border-box;
      min-height:44px;
      align-items:center;
      font-family:inherit;
      font-weight:500;
      border-radius:12px;
      flex-direction:row;
      justify-content:center;
      background-color:var(--controls);
    }

    .exRA-Dq:hover {
      opacity:0.9;
    }

    .exRA-Dq:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .exRA-Dq:disabled {
      cursor:not-allowed;
      opacity:0.6;
    }

    .bVTYgh {
      color:var(--textMuted);
      margin:-4px 0 0 0;
      display:block;
      font-size:12px;
      font-family:inherit;
      font-weight:400;
      line-height:1.2;
      flex-direction:row;
    }

    .cUKvgl {
      gap:4px;
      color:inherit;
      display:flex;
      font-size:inherit;
      margin-top:4px;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
    }

    .fxXiOV {
      color:var(--textPrimary);
      border:none;
      height:44px;
      display:inline-flex;
      padding:0 16px;
      font-size:14px;
      align-self:flex-start;
      box-sizing:border-box;
      min-height:44px;
      align-items:center;
      font-family:inherit;
      font-weight:500;
      border-radius:12px;
      flex-direction:row;
      justify-content:center;
      text-decoration:none;
      background-color:var(--controls);
    }

    .fxXiOV:hover {
      opacity:0.9;
    }

    .fxXiOV:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .bZJlAE {
      gap:8px;
      color:inherit;
      display:flex;
      font-size:inherit;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .bpXtsm {
      color:inherit;
      display:inline-flex;
      font-size:inherit;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .bpXtsm:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .csuYzX {
      color:var(--accent);
      display:block;
      font-size:13px;
      font-family:inherit;
      font-weight:500;
      font-variant:small-caps;
      flex-direction:row;
      letter-spacing:0.06em;
      text-transform:uppercase;
    }

    .dKbwDP {
      gap:8px;
      color:inherit;
      display:flex;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
    }

    .evvMD {
      color:var(--textSecondary);
      margin:6px 0 14px 0;
      display:block;
      font-size:15px;
      font-family:inherit;
      font-weight:400;
      line-height:1.4;
      flex-direction:row;
    }

    .dNjPzG {
      gap:8px;
      color:inherit;
      width:100%;
      display:flex;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    @media (max-width: 600px) {

    .dNjPzG {
      flex-direction:column;
    }
    }

    .eybdJ {
      gap:12px;
      color:inherit;
      width:100%;
      display:grid;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
      grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    @media (max-width: 360px) {

    .eybdJ {
      grid-template-columns:repeat(1, minmax(0, 1fr));
    }
    }

    .bAskEY {
      color:inherit;
      width:88px;
      border:1px solid var(--hairline);
      height:88px;
      display:flex;
      overflow:hidden;
      font-size:inherit;
      box-sizing:border-box;
      flex-shrink:0;
      font-family:inherit;
      font-weight:inherit;
      border-radius:18px;
      flex-direction:column;
      background-color:var(--controls);
    }

    @media (max-width: 480px) {

    .bAskEY {
      width:72px;
      height:72px;
      border-radius:16px;
    }
    }

    .dmxxQv {
      color:var(--textSecondary);
      display:inline-flex;
      padding:2px 8px;
      font-size:11px;
      align-self:flex-start;
      font-family:inherit;
      font-weight:500;
      line-height:1.2;
      border-radius:9999px;
      flex-direction:row;
      background-color:var(--hairline);
    }

    .bmgzhf {
      color:var(--textMuted);
      border:1px solid var(--hairline);
      cursor:not-allowed;
      height:44px;
      display:inline-flex;
      padding:0 16px;
      font-size:14px;
      box-sizing:border-box;
      min-height:44px;
      align-items:center;
      font-family:inherit;
      font-weight:500;
      border-radius:12px;
      flex-direction:row;
      justify-content:center;
      background-color:var(--raised);
    }

    .qfatK {
      gap:6px;
      color:inherit;
      display:inline-flex;
      font-size:inherit;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .fcLRee {
      color:var(--textSecondary);
      margin:0px;
      display:block;
      font-size:14px;
      font-family:inherit;
      font-weight:400;
      line-height:1.5;
      white-space:pre-line;
      flex-direction:row;
    }

    .dSABOw {
      gap:10px;
      color:inherit;
      border:1px solid var(--hairline);
      display:flex;
      padding:16px;
      font-size:inherit;
      box-sizing:border-box;
      font-family:inherit;
      font-weight:inherit;
      border-radius:14px;
      flex-direction:column;
      background-color:var(--raised);
    }

    .dMQCUW {
      gap:12px;
      color:var(--textPrimary);
      border:1px solid var(--bookableBorder);
      display:flex;
      padding:20px;
      font-size:15px;
      box-sizing:border-box;
      font-family:inherit;
      font-weight:400;
      border-radius:16px;
      flex-direction:column;
      background-color:var(--raised);
    }

    .ectoA-d {
      color:var(--textMuted);
      margin:4px 0 0 0;
      display:block;
      font-size:12px;
      font-family:inherit;
      font-weight:400;
      flex-direction:row;
    }

    .dSAFyw {
      color:var(--textSecondary);
      border:none;
      cursor:pointer;
      display:inline-flex;
      padding:6px 0;
      font-size:13px;
      align-self:flex-start;
      background:transparent;
      box-sizing:border-box;
      min-height:44px;
      align-items:center;
      font-family:inherit;
      font-weight:500;
      flex-direction:row;
    }

    .dSAFyw:hover {
      color:var(--textPrimary);
      text-decoration:underline;
    }

    .dSAFyw:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .fraUIq {
      color:var(--textMuted);
      margin:0px;
      display:block;
      font-size:12px;
      font-family:inherit;
      font-weight:400;
      line-height:1.4;
      flex-direction:row;
    }

    .nbGAN {
      color:var(--textMuted);
      display:inline;
      font-size:12px;
      font-family:inherit;
      font-weight:400;
      flex-direction:row;
    }

    .RMdmY {
      gap:8px;
      color:var(--textPrimary);
      display:flex;
      flex-wrap:wrap;
      font-size:15px;
      align-items:center;
      font-family:inherit;
      font-weight:400;
      flex-direction:row;
    }

    .exHoCv {
      color:var(--textMuted);
      display:block;
      font-size:12px;
      margin-top:2px;
      font-family:inherit;
      font-weight:400;
      flex-direction:row;
    }

    .eqeeFF {
      gap:4px;
      color:inherit;
      display:flex;
      font-size:inherit;
      align-items:flex-start;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
    }

    .bLtGsY {
      gap:8px;
      flex:1;
      color:var(--textPrimary);
      border:1px solid var(--hairline);
      display:flex;
      padding:16px;
      position:relative;
      font-size:14px;
      min-width:0px;
      box-sizing:border-box;
      font-family:inherit;
      font-weight:400;
      border-radius:14px;
      flex-direction:column;
      background-color:var(--raised);
    }

    .bgtCYJ {
      color:var(--textMuted);
      width:20px;
      border:1px solid var(--hairline);
      cursor:pointer;
      height:20px;
      display:inline-flex;
      padding:0px;
      font-size:12px;
      min-width:20px;
      background:transparent;
      box-sizing:border-box;
      min-height:20px;
      align-items:center;
      font-family:inherit;
      font-weight:500;
      border-radius:9999px;
      flex-direction:row;
      justify-content:center;
    }

    .bgtCYJ:hover {
      color:var(--textPrimary);
      border-color:var(--textSecondary);
    }

    .bgtCYJ:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .dYtHfC {
      color:var(--textMuted);
      display:block;
      font-size:13px;
      font-family:inherit;
      font-weight:400;
      flex-direction:row;
    }

    .cgTEwM {
      color:inherit;
      display:flex;
      position:relative;
      font-size:inherit;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
      justify-content:space-between;
    }

    .eBDvPd {
      color:var(--textSecondary);
      display:inline;
      font-size:12px;
      font-family:inherit;
      font-weight:500;
      flex-direction:row;
    }

    .dWcVxH {
      gap:8px;
      color:var(--textPrimary);
      display:flex;
      font-size:30px;
      align-items:center;
      font-family:inherit;
      font-weight:600;
      line-height:1.1;
      flex-direction:row;
    }

    .CyPtT {
      gap:2px;
      color:inherit;
      display:flex;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
    }

    .fiMaFp {
      color:inherit;
      display:inline-flex;
      position:relative;
      font-size:inherit;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .fCAIxo {
      color:var(--textSecondary);
      display:block;
      font-size:14px;
      font-family:inherit;
      font-weight:500;
      line-height:1.2;
      flex-direction:row;
    }

    .qdJBj {
      fill:currentColor;
      color:var(--markerColor);
      display:block;
      font-size:inherit;
      flex-shrink:0;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .bzwRrB {
      color:var(--textMuted);
      display:block;
      padding:6px 0;
      font-size:15px;
      font-family:inherit;
      font-weight:400;
      flex-direction:row;
    }

    .eVoeYO {
      top:calc(100% + 6px);
      color:var(--textPrimary);
      right:0px;
      width:max-content;
      border:1px solid var(--hairline);
      display:block;
      padding:12px;
      z-index:50;
      position:absolute;
      font-size:12px;
      max-width:240px;
      box-shadow:0 4px 12px rgba(0, 0, 0, 0.4);
      box-sizing:border-box;
      font-family:inherit;
      font-weight:400;
      line-height:1.4;
      border-radius:12px;
      flex-direction:column;
      background-color:var(--raised);
    }

    .xfGDr {
      gap:16px;
      color:inherit;
      display:flex;
      font-size:inherit;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .clsmPG {
      color:var(--textSecondary);
      border:none;
      cursor:pointer;
      display:inline;
      padding:0px;
      font-size:14px;
      background:transparent;
      font-family:inherit;
      font-weight:500;
      flex-direction:row;
      text-decoration:underline;
    }

    .clsmPG:hover {
      color:var(--textPrimary);
    }

    .clsmPG:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .clsmPG:disabled {
      cursor:not-allowed;
      opacity:0.6;
    }

    .dYMhno {
      color:var(--textSecondary);
      margin:0px;
      display:block;
      font-size:13px;
      font-family:inherit;
      font-weight:400;
      line-height:1.4;
      flex-direction:row;
    }

    .bIvThA {
      gap:8px;
      flex:1;
      color:var(--textPrimary);
      border:1px solid var(--hairline);
      cursor:pointer;
      height:44px;
      display:inline-flex;
      padding:0 12px;
      font-size:14px;
      box-sizing:border-box;
      min-height:44px;
      align-items:center;
      font-family:inherit;
      font-weight:500;
      border-radius:12px;
      flex-direction:row;
      justify-content:center;
      background-color:var(--raised);
    }

    .bIvThA.selected {
      border:2px solid var(--textSecondary);
      padding:0 11px;
    }

    .bIvThA:hover {
      filter:brightness(1.08);
    }

    .bIvThA:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .bIvThA:disabled {
      cursor:not-allowed;
      opacity:0.6;
    }

    @media (max-width: 480px) {

    .bIvThA {
      width:100%;
      padding:0 14px;
      justify-content:flex-start;
    }
    }

    @media (max-width: 480px) {

    .bIvThA.selected {
      padding:0 13px;
    }
    }

    .euAczv {
      gap:8px;
      color:var(--textPrimary);
      display:block;
      flex-wrap:wrap;
      font-size:15px;
      margin-top:10px;
      align-items:center;
      font-family:inherit;
      font-weight:400;
      flex-direction:row;
    }

    .fxfuLF {
      gap:8px;
      color:inherit;
      display:flex;
      font-size:15px;
      margin-top:10px;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
    }

    .fsUTGi {
      gap:6px;
      color:inherit;
      display:flex;
      flex-wrap:wrap;
      font-size:inherit;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .clmnsw {
      color:var(--textSecondary);
      border:none;
      cursor:pointer;
      display:inline;
      padding:0px;
      font-size:14px;
      background:transparent;
      font-family:inherit;
      font-weight:500;
      flex-direction:row;
      text-decoration:underline;
    }

    .clmnsw:hover {
      color:var(--textPrimary);
    }

    .clmnsw:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .dSPsdM {
      fill:currentColor;
      color:var(--optMarkerColor);
      display:block;
      font-size:inherit;
      flex-shrink:0;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .bjrZgX {
      color:var(--textSecondary);
      display:inline;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .cfjmQq {
      color:var(--textPrimary);
      margin:0px;
      display:block;
      font-size:15px;
      font-family:inherit;
      font-weight:500;
      line-height:1.3;
      flex-direction:row;
    }

    .dELgox {
      color:var(--textPrimary);
      border:none;
      cursor:pointer;
      height:32px;
      display:inline-flex;
      padding:0 12px;
      font-size:13px;
      box-sizing:border-box;
      align-items:center;
      font-family:inherit;
      font-weight:500;
      border-radius:8px;
      flex-direction:row;
      justify-content:center;
      background-color:var(--controls);
    }

    .dELgox:hover {
      opacity:0.9;
    }

    .dELgox:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .dELgox:disabled {
      cursor:not-allowed;
      opacity:0.6;
    }

    .fAYDKv {
      gap:12px;
      color:var(--textPrimary);
      display:flex;
      flex-wrap:wrap;
      font-size:15px;
      align-items:center;
      font-family:inherit;
      font-weight:400;
      flex-direction:row;
    }

    .cyGLiS {
      color:var(--textSecondary);
      margin:0px;
      display:block;
      font-size:15px;
      max-width:62ch;
      font-family:inherit;
      font-weight:400;
      line-height:1.6;
      flex-direction:row;
    }

    .vuETM {
      row-gap:15px;
      column-gap:15px;
      flex-direction:row;
    }

    .ScveH {
      color:var(--textSecondary);
      display:inline;
      font-size:13px;
      font-family:inherit;
      font-weight:500;
      line-height:1.2;
      flex-direction:row;
    }

    .eYnszN {
      fill:currentColor;
      color:var(--markerGameColor);
      display:block;
      font-size:inherit;
      flex-shrink:0;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .fuFJjn {
      color:var(--textSecondary);
      display:block;
      font-size:inherit;
      font-family:"Inter", sans-serif;
      font-weight:400;
    }

    .eWgcuA {
      top:0px;
      left:0px;
      width:100vw;
      height:100vh;
      display:flex;
      padding:16px;
      z-index:1000;
      position:fixed;
      box-sizing:border-box;
      align-items:center;
      justify-content:center;
      background-color:rgba(0, 0, 0, 0.6);
    }

    .eWtUqF {
      color:var(--textPrimary);
      margin:0px;
      display:block;
      font-size:18px;
      font-family:"Inter", sans-serif;
      font-weight:600;
      line-height:1.3;
    }

    .bHoyqA {
      color:var(--textMuted);
      border:none;
      cursor:pointer;
      display:inline-flex;
      padding:4px;
      font-size:22px;
      background:transparent;
      align-items:center;
      font-family:"Inter", sans-serif;
      line-height:1;
      flex-direction:row;
      justify-content:center;
    }

    .bHoyqA:hover {
      color:var(--textPrimary);
    }

    .bHoyqA:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .cvxCqm {
      color:var(--textPrimary);
      border:none;
      cursor:pointer;
      display:inline-flex;
      padding:6px 14px;
      font-size:13px;
      box-sizing:border-box;
      min-height:36px;
      align-items:center;
      font-family:"Inter", sans-serif;
      font-weight:500;
      line-height:1.2;
      border-radius:9999px;
      justify-content:center;
      text-decoration:none;
      background-color:var(--controls);
    }

    .cvxCqm:hover {
      opacity:0.9;
    }

    .cvxCqm:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .cSbYLL {
      gap:16px;
      color:inherit;
      display:flex;
      text-align:center;
      font-family:inherit;
      flex-direction:column;
    }

    .eyivxg {
      gap:12px;
      color:var(--bandRed);
      display:flex;
      font-size:14px;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
    }

    .dGFoOa {
      color:var(--accent);
      border:1px solid var(--hairline);
      cursor:pointer;
      display:flex;
      padding:16px 40px;
      position:relative;
      font-size:24px;
      align-items:center;
      font-family:monospace;
      font-weight:600;
      border-radius:10px;
      flex-direction:row;
      letter-spacing:2px;
      justify-content:center;
      background-color:var(--backdrop);
    }

    .Efnzv {
      color:var(--textMuted);
      display:flex;
      font-size:12px;
      font-family:inherit;
      justify-content:center;
    }

    .fgCLXr {
      color:var(--textPrimary);
      display:flex;
      align-items:center;
      flex-direction:row;
      justify-content:space-between;
    }

    .eXcdOt {
      color:var(--textSecondary);
      margin:0px;
      display:block;
      font-size:14px;
      line-height:1.4;
    }

    .xBExN {
      gap:12px;
      color:inherit;
      display:flex;
      font-size:inherit;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
    }

    .AtQwP {
      color:var(--textSecondary);
      display:block;
      font-size:14px;
      font-family:inherit;
    }

    .dqDWbF {
      gap:12px;
      color:inherit;
      display:flex;
      font-family:inherit;
      flex-direction:column;
    }

    .cjQaNa {
      color:var(--bandGreen);
      display:block;
      font-size:14px;
      font-family:inherit;
      font-weight:600;
    }

    .cmlVio {
      gap:16px;
      color:var(--textPrimary);
      width:100%;
      border:1px solid var(--hairline);
      display:flex;
      padding:24px;
      max-width:400px;
      box-shadow:0 20px 50px rgba(0, 0, 0, 0.5);
      box-sizing:border-box;
      font-family:"Inter", sans-serif;
      border-radius:14px;
      flex-direction:column;
      background-color:var(--raised);
    }

    .dzKOAF {
      color:#ffffff;
      width:100%;
      display:flex;
      padding:10px 16px;
      font-size:14px;
      box-sizing:border-box;
      align-items:center;
      font-family:"Inter", sans-serif;
      font-weight:600;
      border-radius:9999px;
      justify-content:center;
      text-decoration:none;
      background-color:#0088cc;
    }

    .dzKOAF:hover {
      background-color:#0077b5;
    }

    .dzKOAF:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .klMBF {
      color:var(--textPrimary);
      border:none;
      cursor:pointer;
      display:inline-flex;
      padding:6px 14px;
      font-size:13px;
      box-sizing:border-box;
      min-height:36px;
      align-items:center;
      font-family:"Inter", sans-serif;
      font-weight:500;
      line-height:1.2;
      border-radius:9999px;
      flex-direction:column;
      justify-content:center;
      background-color:var(--controls);
    }

    .klMBF:hover {
      opacity:0.9;
    }

    .klMBF:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .ciDIzG {
      color:var(--textMuted);
      margin:0px;
      display:block;
      font-size:12px;
      line-height:1.4;
    }

    .ewNeoS {
      top:50%;
      color:var(--textMuted);
      right:12px;
      display:flex;
      position:absolute;
      transform:translateY(-50%);
    }

    .dBiLbu {
      gap:6px;
      color:var(--textSecondary);
      width:fit-content;
      display:flex;
      padding:1px 6px;
      row-gap:2px;
      flex-wrap:wrap;
      font-size:13px;
      column-gap:2px;
      margin-top:2px;
      align-items:center;
      font-family:inherit;
      font-weight:normal;
      line-height:1.2;
      border-color:var(--controls);
      border-style:solid;
      border-width:1px;
      flex-direction:row;
      border-top-left-radius:4px;
      border-top-right-radius:4px;
      border-bottom-left-radius:4px;
      border-bottom-right-radius:4px;
    }

    .coUfRG {
      color:inherit;
      width:8px;
      height:8px;
      display:inline-block;
      font-size:inherit;
      flex-shrink:0;
      font-family:inherit;
      font-weight:inherit;
      border-radius:9999px;
      flex-direction:row;
      background-color:var(--bookableDot);
    }

    .fHIkUq {
      color:var(--textSecondary);
      display:inline;
      font-size:13px;
      font-family:inherit;
      line-height:1.2;
      padding-top:1px;
      flex-direction:row;
      padding-bottom:1px;
    }

    .frjvbz {
      color:inherit;
      display:flex;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
    }

    .dcltar {
      color:var(--textPrimary);
      display:inline;
      font-size:inherit;
      font-family:inherit;
      font-weight:500;
      flex-direction:row;
    }

    .Shgvs {
      flex-direction:row;
    }

    .cenRHE {
      fill:currentColor;
      color:var(--markerSiteColor);
      display:block;
      font-size:inherit;
      flex-shrink:0;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .cwdgpN {
      gap:0px;
      color:inherit;
      display:flex;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
    }

    .cdDDpi {
      color:var(--textPrimary);
      border:1px solid var(--hairline);
      cursor:pointer;
      display:inline-flex;
      padding:8px 18px;
      font-size:14px;
      align-self:flex-start;
      box-sizing:border-box;
      min-height:44px;
      align-items:center;
      font-family:inherit;
      font-weight:500;
      border-radius:9999px;
      flex-direction:row;
      justify-content:center;
      background-color:var(--controls);
    }

    .cdDDpi:hover {
      opacity:0.9;
    }

    .cdDDpi:focus-visible {
      outline:2px solid var(--textSecondary);
      outline-offset:2px;
    }

    .eUHjo {
      color:var(--textSecondary);
      margin:-4px 0 0 0;
      display:block;
      font-size:13px;
      font-family:inherit;
      font-weight:400;
      flex-direction:row;
    }

    .dSQhIL {
      gap:12px;
      color:inherit;
      display:flex;
      flex-wrap:wrap;
      font-size:inherit;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .bwjxwV {
      gap:10px;
      color:inherit;
      display:inline-flex;
      font-size:inherit;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .WfsWW {
      gap:14px;
      color:inherit;
      display:flex;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
    }