.pvp-class-btn{width:auto;min-height:42px;justify-content:center;cursor:pointer}.pvp-class-btn[aria-checked="true"]{transform:translateY(-1px)}.pvp-class-btn:focus-visible{outline:2px solid #fff;outline-offset:2px}
    #tblPairs{--ewr-statW:68px;--ewr-totalW:68px}#tblPairs .col-stat,#tblPairs .col-total{min-width:68px;white-space:nowrap;text-overflow:clip}
    /* Small helpers for the “Use My Tavern” chip */
    .chip-btn {
      display:inline-flex; align-items:center; gap:.5rem;
      padding:.35rem .6rem; border-radius:.6rem; font-weight:700; font-size:.85rem;
      background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
      border: 1px solid rgba(255,255,255,.12);
      cursor: pointer; user-select:none;
    }
    .chip-btn:hover { background: rgba(255,255,255,.10); }
    .chip-btn.is-active { box-shadow:0 0 0 2px rgba(255,255,255,.75) inset, 0 4px 14px rgba(0,0,0,.25); }
    .chip-btn.is-disabled { opacity:.5; pointer-events:none; }
    .chip-dot { inline-size:.5rem; block-size:.5rem; border-radius:9999px; background:#22c55e; box-shadow:0 0 0 2px rgba(0,0,0,.25) inset; } /* green = ON */
    .chip-dot.is-off { background:#ef4444; }     /* red when toggle OFF but available */
    .chip-dot.is-disabled { background:#999; }   /* gray when no tavern / logged out */

    /* NEW: make the “Set to Any” button same height and font as Use My Tavern */
    .picker-clear{
      display:inline-flex; align-items:center; justify-content:center;
      padding:.35rem .6rem; border-radius:.6rem;
      font-weight:700; font-size:.85rem; line-height:1;
    }
    /* [SB-STYLE] simple toggle look */
.ewr-toggle {
  width: 1.1rem; height: 1.1rem; accent-color: #10b981; /* Tailwind emerald-500 */
}
/* === [SB-CHIP-LARGE] Bigger, more prominent Include Skill Books chip === */
#chipSkillBooks {
  font-size: 1rem;                /* bump up font size */
  padding: 0.65rem 1.25rem;       /* taller + wider */
  border-radius: 0.9rem;          /* more pill-shaped */
  font-weight: 700;
  letter-spacing: 0.3px;
  transition: all 0.25s ease;
  background: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.04));
  border: 1px solid rgba(255,255,255,0.2);
  box-shadow: 0 0 0 1px rgba(0,0,0,0.3) inset, 0 4px 18px rgba(0,0,0,0.35);
}

/* When active: stronger glow and greener accent */
#chipSkillBooks.is-active {
  background: linear-gradient(180deg, rgba(34,197,94,0.25), rgba(22,163,74,0.15));
  border-color: rgba(34,197,94,0.6);
  box-shadow:
    0 0 10px rgba(34,197,94,0.45),
    0 0 0 2px rgba(34,197,94,0.3) inset;
}

/* Dot tweaks for visibility */
#chipSkillBooks .chip-dot {
  inline-size: 0.65rem;
  block-size: 0.65rem;
  box-shadow: 0 0 0 2px rgba(0,0,0,0.4) inset;
}

#chipSkillBooks:hover {
  transform: scale(1.04);
  background: linear-gradient(180deg, rgba(255,255,255,0.15), rgba(255,255,255,0.07));
}

/* [SB-CHIP-ROW] create more breathing room around the chip */
#chipSkillBooks {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}

#chipSkillBooks:focus-visible {
  outline: 2px solid rgba(255,255,255,0.5);
  outline-offset: 3px;
}

/* Make "Use My Tavern" look like the SB chip when active */
#btnUseTavern {
  transition: all 0.25s ease;    /* smooth glow/scale */
}

/* Active state = green gradient, green outline/glow (same recipe as SB chip) */
#btnUseTavern.is-active {
  background: linear-gradient(180deg, rgba(34,197,94,0.25), rgba(22,163,74,0.15));
  border-color: rgba(34,197,94,0.6);
  box-shadow:
    0 0 10px rgba(34,197,94,0.45),
    0 0 0 2px rgba(34,197,94,0.3) inset;
}

/* Slight lift on hover when active (keeps size the same; just a tiny scale) */
#btnUseTavern.is-active:hover {
  transform: scale(1.04);
}

/* Dot behavior: leave as-is—your JS/logic already flips red (is-off) when OFF,
   green when ON, and gray (is-disabled) when no tavern or logged out. */

.poweruser-roster-card { overflow: visible; }
