
  

  
  @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;
    }
  }
}


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

    @media (max-width: 480px) {

    .bnEEWK {
      padding:0px;
    }
    }

    .eFfamR {
      gap:16px;
      color:var(--textPrimary);
      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;
      text-decoration:none;
      background-color:var(--raised);
    }

    .eFfamR.isBookable {
      border-color:var(--bookableBorder);
    }

    .eFfamR:hover {
      border-color:var(--textMuted);
    }

    .eFfamR: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;
    }

    .ctpqFO {
      color:var(--textPrimary);
      margin:0px;
      display:-webkit-box;
      overflow:hidden;
      font-size:20px;
      font-family:inherit;
      font-weight:600;
      line-height:1.3;
      flex-direction:row;
      -webkit-box-orient:vertical;
      -webkit-line-clamp:2;
    }

    .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;
    }

    .dHJnsQ {
      gap:12px;
      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:12px;
      flex-direction:column;
      background-color:var(--raised);
    }

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

    @media (max-width: 480px) {

    .ekkKwS {
      font-size:28px;
    }
    }

    .cquazq {
      gap:32px;
      color:inherit;
      display:flex;
      font-size:inherit;
      margin-top:8px;
      align-items:flex-start;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

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

    .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;
    }

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

    @media (max-width: 480px) {

    .duXguX {
      display:none;
    }
    }

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

    .uQgwH {
      gap:16px;
      color:var(--textPrimary);
      display:flex;
      padding:20px;
      z-index:1;
      position:relative;
      font-size:inherit;
      border-top:1px solid var(--hairline);
      box-sizing:border-box;
      max-height:85vh;
      overflow-y:auto;
      font-family:inherit;
      font-weight:inherit;
      border-radius:16px 16px 0 0;
      flex-direction:column;
      background-color:var(--raised);
    }

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

    .drFXRj {
      color:var(--textPrimary);
      border:1px solid var(--hairline);
      cursor:pointer;
      display:inline-block;
      outline:none;
      padding:0 12px;
      font-size:14px;
      box-sizing:border-box;
      min-height:44px;
      font-family:inherit;
      font-weight:400;
      border-radius:8px;
      flex-direction:row;
      background-color:var(--page);
    }

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

    .synId {
      gap:2px;
      color:inherit;
      border:1px solid var(--hairline);
      display:inline-flex;
      padding:3px;
      font-size:inherit;
      box-sizing:border-box;
      min-height:40px;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      border-radius:9999px;
      flex-direction:row;
      background-color:var(--raised);
    }

    .eHpccM {
      color:var(--textSecondary);
      border:none;
      cursor:pointer;
      display:inline-flex;
      padding:6px 14px;
      font-size:13px;
      background:transparent;
      transition:all 0.15s ease;
      align-items:center;
      font-family:inherit;
      font-weight:500;
      line-height:1.2;
      white-space:nowrap;
      border-radius:9999px;
      flex-direction:row;
      justify-content:center;
    }

    .eHpccM.active {
      color:var(--page);
      font-weight:500;
      background-color:var(--textPrimary);
    }

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

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

    .bXZZjm {
      color:var(--textPrimary);
      display:block;
      font-size:24px;
      font-family:inherit;
      font-weight:600;
      line-height:1.2;
      flex-direction:row;
    }

    .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);
    }

    .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;
    }

    .fhSsSD {
      gap:20px;
      color:inherit;
      display:flex;
      padding:24px;
      font-size:inherit;
      box-sizing:border-box;
      font-family:inherit;
      font-weight:inherit;
      container-type:inline-size;
      flex-direction:column;
    }

    @media (max-width: 480px) {

    .fhSsSD {
      padding:16px;
    }
    }

    .dJDgHa {
      top:0px;
      left:0px;
      color:inherit;
      right:0px;
      bottom:0px;
      display:flex;
      z-index:1000;
      position:fixed;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
      justify-content:flex-end;
    }

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

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

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

    @media (max-width: 880px) {

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

    @media (max-width: 560px) {

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

    .cbfnKn {
      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-bg);
    }

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

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

    .eRFKul {
      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;
      text-decoration:none;
      background-color:var(--btn-bg);
    }

    .eRFKul:hover {
      opacity:0.9;
    }

    .czcGuX {
      color:var(--textPrimary);
      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;
      text-decoration:none;
      background-color:var(--ctrl-bg);
    }

    .czcGuX:hover {
      opacity:0.9;
    }

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

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

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

    .dKVdbh {
      gap:12px;
      color:inherit;
      display:inline-flex;
      font-size:inherit;
      align-items:center;
      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;
    }

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

    .eLvJSh {
      color:#f4e6f0a3;
      display:inline;
      font-size:10px;
      font-family:inherit;
      font-weight:500;
      line-height:1.2;
      flex-direction:row;
    }

    .fyLzTy {
      color:var(--textMuted);
      display:inline;
      font-size:13px;
      font-family:inherit;
      font-weight:400;
      line-height:1.1;
      flex-direction:row;
    }

    .bOjvcW {
      color:var(--textPrimary);
      border:1px solid var(--hairline);
      cursor:pointer;
      display:inline-flex;
      padding:8px 16px;
      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);
    }

    .bOjvcW:disabled {
      color:var(--textMuted);
      cursor:not-allowed;
      opacity:0.5;
    }

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

    .bOjvcW:hover {
      opacity:0.9;
    }

    .cWpRxR {
      color:var(--textSecondary);
      width:100%;
      display:block;
      font-size:12px;
      font-family:inherit;
      font-weight:400;
      line-height:1.2;
      flex-direction:column;
    }

    .ckXucn {
      flex:1;
      color:var(--textPrimary);
      border:none;
      display:inline-block;
      outline:none;
      font-size:14px;
      background:transparent;
      box-sizing:border-box;
      min-height:44px;
      font-family:inherit;
      font-weight:400;
      flex-direction:row;
    }

    .ckXucn::placeholder {
      color:var(--textMuted);
    }

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

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

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

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

    .dLXAVN {
      color:var(--textPrimary);
      display:inline;
      font-size:24px;
      font-family:inherit;
      font-weight:600;
      line-height:1.1;
      flex-direction:row;
    }

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

    .bJmmVs {
      gap:12px;
      color:inherit;
      border:1px solid var(--hairline);
      display:flex;
      padding:16px;
      animation:pulse 1.5s ease-in-out infinite;
      font-size:inherit;
      box-sizing:border-box;
      min-height:180px;
      font-family:inherit;
      font-weight:inherit;
      border-radius:14px;
      flex-direction:column;
      background-color:var(--raised);
    }

    @media (prefers-reduced-motion: reduce) {

    .bJmmVs {
      animation:none;
    }
    }

    @keyframes pulse {
        0% {
          opacity: 1;
        }

        50% {
          opacity: 0.45;
        }

        100% {
          opacity: 1;
        }
    }

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

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

    .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;
    }

    .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;
    }

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

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

    @media (max-width: 480px) {

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

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

    .fbsKTP {
      top:0px;
      left:0px;
      color:inherit;
      right:0px;
      bottom:0px;
      display:block;
      position:absolute;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
      background-color:rgba(0, 0, 0, 0.6);
    }

    .WXpKS {
      color:var(--textSecondary);
      border:none;
      cursor:pointer;
      display:inline-flex;
      padding:0px;
      font-size:20px;
      min-width:44px;
      background:transparent;
      min-height:44px;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
      justify-content:center;
    }

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

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

    .fjSsGn {
      color:inherit;
      width:35%;
      height:18px;
      display:block;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      border-radius:9999px;
      flex-direction:row;
      background-color:var(--hairline);
    }

    .dWrQLV {
      color:inherit;
      width:70%;
      height:20px;
      display:block;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      border-radius:4px;
      flex-direction:row;
      background-color:var(--hairline);
    }

    .evmfWf {
      color:inherit;
      width:50%;
      height:16px;
      display:block;
      font-size:inherit;
      margin-top:auto;
      font-family:inherit;
      font-weight:inherit;
      border-radius:4px;
      flex-direction:row;
      background-color:var(--hairline);
    }

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

    .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;
    }

    .BpJTf {
      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:12px;
      flex-direction:column;
      background-color:var(--raised);
    }

    .eGRefo {
      gap:8px;
      color:var(--textSecondary);
      display:flex;
      font-size:14px;
      max-width:60ch;
      font-family:inherit;
      font-weight:400;
      line-height:1.5;
      padding-top:8px;
      flex-direction:column;
      padding-bottom:8px;
    }

    .dbgbjJ {
      color:var(--textSecondary);
      border:none;
      cursor:pointer;
      display:inline-flex;
      padding:0px;
      font-size:18px;
      min-width:44px;
      background:transparent;
      box-sizing:border-box;
      min-height:44px;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
      justify-content:center;
    }

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

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

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

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

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

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

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

    .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;
    }

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

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

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

    .eyUHtc {
      color:var(--textPrimary);
      border:1px solid var(--hairline);
      cursor:pointer;
      display:none;
      padding:6px 14px;
      font-size:13px;
      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);
    }

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

    @media (max-width: 480px) {

    .eyUHtc {
      display:inline-flex;
    }
    }

    .cVGmCk {
      flex:1;
      color:inherit;
      border:1px solid var(--hairline);
      display:flex;
      padding:0 12px;
      position:relative;
      font-size:inherit;
      min-width:200px;
      box-sizing:border-box;
      min-height:44px;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      border-radius:8px;
      flex-direction:row;
      background-color:var(--page);
    }

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

    .dGivOp {
      color:var(--textMuted);
      display:inline-flex;
      font-size:14px;
      font-family:inherit;
      font-weight:inherit;
      user-select:none;
      margin-right:8px;
      flex-direction:row;
    }

    .btxMtC {
      color:var(--textPrimary);
      width:100%;
      border:1px solid var(--hairline);
      display:block;
      outline:none;
      padding:0 12px;
      font-size:14px;
      box-sizing:border-box;
      min-height:44px;
      font-family:inherit;
      font-weight:400;
      border-radius:8px;
      flex-direction:row;
      background-color:var(--page);
    }

    .eFiZPD {
      clip:rect(0, 0, 0, 0);
      color:inherit;
      width:1px;
      border:0;
      height:1px;
      margin:-1px;
      display:block;
      padding:0px;
      overflow:hidden;
      position:absolute;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
      white-space:nowrap;
      flex-direction:row;
    }

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

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

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

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

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

    .lYHyF {
      color:var(--textSecondary);
      cursor:pointer;
      display:list-item;
      padding:4px 0;
      font-size:14px;
      box-sizing:border-box;
      min-height:44px;
      font-family:inherit;
      font-weight:500;
      user-select:none;
      align-content:center;
      flex-direction:row;
    }

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

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

    .dGSdUA {
      gap:16px;
      color:inherit;
      display:flex;
      padding:12px 0;
      font-size:inherit;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
      justify-content:center;
    }

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

    @media (max-width: 480px) {

    .dXFfuy {
      display:none;
    }
    }

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

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

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

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

    .HJzup {
      color:var(--page);
      border:none;
      cursor:pointer;
      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:9999px;
      flex-direction:row;
      justify-content:center;
      background-color:var(--textPrimary);
    }

    .HJzup:hover {
      opacity:0.9;
    }

    .cgXAGe {
      color:var(--textSecondary);
      border:none;
      cursor:pointer;
      display:inline-flex;
      padding:0px;
      font-size:18px;
      min-width:32px;
      background:transparent;
      box-sizing:border-box;
      min-height:44px;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
      justify-content:center;
    }

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

    .cdjmAT {
      color:inherit;
      border:1px solid var(--hairline);
      margin:0px;
      display:flex;
      padding:8px;
      font-size:inherit;
      box-sizing:border-box;
      list-style:none;
      max-height:240px;
      overflow-y:auto;
      font-family:inherit;
      font-weight:inherit;
      border-radius:12px;
      flex-direction:column;
      background-color:var(--raised);
    }

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

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

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

    .fHhAmi {
      color:var(--textPrimary);
      cursor:pointer;
      display:block;
      flex-wrap:wrap;
      font-size:14px;
      box-sizing:border-box;
      min-height:40px;
      text-align:left;
      align-items:center;
      font-family:inherit;
      font-weight:400;
      padding-top:5px;
      padding-left:12px;
      align-content:center;
      border-radius:8px;
      padding-right:12px;
      flex-direction:row;
      padding-bottom:5px;
      justify-content:flex-start;
    }

    .fHhAmi.isHighlighted {
      background-color:var(--controls);
    }

    .fHhAmi:hover {
      background-color:var(--controls);
    }

    .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;
    }

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

    .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;
    }

    .eKFdRD {
      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: 560px) {

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

    .dauMcn {
      color:var(--textMuted);
      margin:-4px 0 0 0;
      display:block;
      font-size:12px;
      align-items:flex-end;
      font-family:inherit;
      font-weight:400;
      line-height:30px;
      flex-direction:row;
      justify-content:center;
    }

    .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;
    }

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

    .IkFsL {
      gap:6px;
      color:var(--textSecondary);
      width:fit-content;
      display:flex;
      row-gap:2px;
      flex-wrap:wrap;
      font-size:13px;
      column-gap:2px;
      align-items:center;
      font-family:inherit;
      font-weight:normal;
      line-height:1.2;
      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);
    }

    .fA-dReg {
      gap:6px;
      color:inherit;
      display:flex;
      flex-wrap:wrap;
      font-size:inherit;
      margin-top:4px;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
    }

    .dsHLcA {
      display:inline;
      font-size:inherit;
      font-family:inherit;
      font-weight:inherit;
    }

    .VBkfh {
      color:var(--textMuted);
      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;
    }

    .dWkqJA {
      color:var(--textMuted);
      cursor:not-allowed;
      display:flex;
      padding:0 12px;
      font-size:14px;
      box-sizing:border-box;
      min-height:40px;
      align-items:center;
      font-family:inherit;
      font-weight:400;
      flex-direction:row;
    }

    .bwYgcf {
      display:flex;
      row-gap:10px;
      column-gap:10px;
      flex-direction:row;
    }

    .bfeLne {
      color:var(--textSecondary);
      border:none;
      cursor:pointer;
      display:inline-flex;
      padding:0px;
      font-size:18px;
      min-width:32px;
      background:transparent;
      box-sizing:border-box;
      min-height:44px;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:row;
      justify-content:center;
    }

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

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

    .eIYSBU {
      top:calc(100% + 4px);
      left:0px;
      color:inherit;
      right:0px;
      border:1px solid var(--hairline);
      margin:0px;
      display:flex;
      padding:8px;
      z-index:100;
      position:absolute;
      font-size:inherit;
      box-sizing:border-box;
      list-style:none;
      max-height:240px;
      overflow-y:auto;
      font-family:inherit;
      font-weight:inherit;
      border-radius:12px;
      flex-direction:column;
      background-color:var(--raised);
    }

    .SXzAT {
      color:inherit;
      border:1px solid var(--hairline);
      display:flex;
      padding:0 12px;
      font-size:inherit;
      box-sizing:border-box;
      min-height:44px;
      align-items:center;
      font-family:inherit;
      font-weight:inherit;
      border-radius:12px;
      flex-direction:row;
      background-color:var(--page);
    }

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

    .cVyKnC {
      color:inherit;
      display:flex;
      position:relative;
      font-size:inherit;
      min-width:180px;
      font-family:inherit;
      font-weight:inherit;
      flex-direction:column;
    }