:root{
  --gts-bg:#000000;
  --gts-card:#000000;
  --gts-accent:#CB9A16;
  --gts-ink:#EBD7A1;
  --gts-ink-dim:#E0C273;
  --gts-border:#CB9A16;
  --gts-wave-height:96px;
  --gts-padding:1rem;
  --gts-radius:18px;
  --gts-title-size:1.05rem;
  --gts-badge-fs:.9rem;
  --gts-fade-ms:220ms;
}

.gts-wrap{width:100%;font-family:inherit;background:var(--gts-card);color:var(--gts-ink);max-width:920px;margin:1rem auto;padding:var(--gts-padding);border:1px solid var(--gts-border);border-radius:var(--gts-radius);box-shadow:0 8px 30px rgba(0,0,0,.25)}
.gts-row{display:flex;align-items:center;gap:.65rem;flex-wrap:wrap}
.gts-title{font-weight:700;font-size:var(--gts-title-size);letter-spacing:.2px}
.gts-small{font-size:.85rem;color:var(--gts-ink-dim)}
.gts-spacer{flex:1}

.gts-btn{appearance:none;border:1px solid var(--gts-border);border-radius:999px;padding:.5rem .9rem;background:transparent;color:var(--gts-ink);cursor:pointer;transition:border-color 140ms ease, transform 120ms ease}
.gts-btn:hover{border-color:var(--gts-accent);transform:translateY(-1px)}
.gts-play{font-weight:700}

.gts-badges{display:flex;gap:.45rem}
.gts-badge{border:1px solid var(--gts-border);border-radius:999px;padding:.2rem .55rem;cursor:pointer;font-size:var(--gts-badge-fs);transition:color 160ms ease, border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;color:var(--gts-accent);background:transparent}
.gts-badge[data-active="true"]{border-color:var(--gts-ink-dim);background-color:var(--gts-ink-dim);color:var(--gts-bg)}

.gts-scope{position:relative;border:1px solid var(--gts-border);border-radius:14px;overflow:hidden;height:var(--gts-wave-height)}
.gts-scope .layer{position:absolute; inset:0; opacity:1; transition:opacity var(--gts-fade-ms) cubic-bezier(.2,.7,.2,1)}
.gts-scope .layer[data-visible="false"]{opacity:0; pointer-events:none}
.gts-scope .ws{height:var(--gts-wave-height)}

/* Compact variant overrides (applied via inline CSS variables) */
.gts-ab[data-variant="compact"] .gts-wrap{max-width:740px}

.gts-badge:hover{box-shadow:0 0 0 10px rgba(235,215,161,.12)}
.gts-badge[data-active="true"]{border-color:var(--gts-ink-dim);background-color:var(--gts-ink-dim);color:var(--gts-bg)}



.gts-badge:focus-visible{outline:2px solid var(--gts-accent);outline-offset:2px}
