Predefinição:Gb

<style> /* ==========================

  ESTILO DO WIDGET (TABS)
  ========================== */

.ot-tabs {

 width: 100%;
 background: #0d0d0d;
 border: 1px solid #2a2a2a;
 padding: 10px;
 border-radius: 8px;

}

/* Barra de botões */ .ot-tab-buttons {

 display: flex;
 gap: 8px;
 margin-bottom: 12px;

}

/* Botões */ .ot-tab-buttons button {

 background: #1a1a1a;
 color: #b5b5b5;
 border: 1px solid #333;
 padding: 8px 20px;
 cursor: pointer;
 font-weight: 600;
 border-radius: 6px;
 transition: 0.2s;

}

.ot-tab-buttons button:hover {

 background: #262626;
 color: #e5e5e5;

}

/* Aba ativa (estilo dourado igual ao do seu print) */ .ot-tab-buttons button.active {

 background: linear-gradient(90deg, #d89c00, #ffcc33);
 color: #000;
 border-color: #d89c00;

}

/* Conteúdo das abas */ .ot-tab-content {

 display: none;
 padding: 15px;
 border: 1px solid #333;
 border-radius: 6px;
 background: #151515;

}

.ot-tab-content.active {

 display: block;

} </style>

<script> /* ==========================

  SISTEMA DE TROCA DE TABS
  ========================== */

document.addEventListener("click", function (e) {

   const btn = e.target.closest(".ot-tab-buttons button");
   if (!btn) return;

   const container = btn.closest(".ot-tabs");
   const target = btn.dataset.target;

   // Atualiza botões
   container.querySelectorAll(".ot-tab-buttons button")
       .forEach(b => b.classList.remove("active"));
   btn.classList.add("active");

   // Atualiza conteúdos
   container.querySelectorAll(".ot-tab-content")
       .forEach(c => c.classList.remove("active"));

   container.querySelector("#" + target).classList.add("active");

}); </script>

   <button data-target="ot-tab-1" class="active">
     Outfit
   </button>
   <button data-target="ot-tab-2">
     Cursed Backpack
   </button>
   <button data-target="ot-tab-3">
     Crimsonevil's Head
   </button>

   Conteúdo da aba 1

   Conteúdo da aba 2

   Conteúdo da aba 3