/*
 * BESSO front-end styles. Lapis and gold, mobile first.
 * Palette: midnight lapis base, Bes gold accent, coral reserved for live and
 * drop, navy and teal for the controller. Display Unbounded, body Inter, data
 * in IBM Plex Mono (the provably-fair receipt is the signature).
 * House rules: UK English. No em or en dashes.
 */

.besso {
  --ink: #e9e1d0;
  --surface: #ffffff;
  --surface-2: #f4efe4;
  --gold: #004225;
  --gold-deep: #00311b;
  --drop: #c0392b;
  --teal: #2f4f3e;
  --navy: #2f4f3e;
  --text: #1b1c1e;
  --muted: #8a7f6a;
  --line: rgba(138, 127, 106, 0.4);

  color: var(--text);
  font-family: 'Jost', system-ui, sans-serif;
  line-height: 1.5;
  box-sizing: border-box;
}
.besso *, .besso *::before, .besso *::after { box-sizing: inherit; }

.besso-mono { font-family: 'IBM Plex Mono', ui-monospace, monospace; }

.besso-eyebrow {
  font-family: 'IBM Plex Mono', monospace;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-size: 0.72rem;
  color: var(--gold);
  margin: 0 0 0.5rem;
}
.besso-h2 {
  font-family: 'Unbounded', sans-serif;
  font-weight: 800;
  font-size: 1.7rem;
  margin: 0 0 0.75rem;
  letter-spacing: -0.01em;
}

.besso-card {
  background: linear-gradient(180deg, var(--surface) 0%, var(--ink) 100%);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 1.5rem;
  max-width: 480px;
}

.besso-label { display: block; font-size: 0.85rem; color: var(--muted); margin: 0.75rem 0 0.35rem; }
.besso-input {
  width: 100%;
  background: var(--ink);
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--text);
  padding: 0.8rem 0.9rem;
  font-size: 1rem;
}
.besso-input:focus { outline: 2px solid var(--gold); outline-offset: 1px; }

.besso-btn {
  display: inline-flex; align-items: center; justify-content: center;
  border: 0; border-radius: 12px; cursor: pointer;
  font-family: 'Unbounded', sans-serif; font-weight: 600; font-size: 0.95rem;
  padding: 0.8rem 1.1rem; margin-top: 0.75rem; width: 100%;
  transition: transform 0.08s ease, filter 0.15s ease;
}
.besso-btn:active { transform: translateY(1px); }
.besso-btn:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.besso-btn-gold { background: var(--gold); color: #201700; }
.besso-btn-gold:hover { filter: brightness(1.06); }
.besso-btn-ghost { background: transparent; color: var(--text); border: 1px solid var(--line); }
.besso-btn-start { background: var(--teal); color: #04211d; }
.besso-btn-drop { background: var(--drop); color: #fff; }

.besso-note { color: var(--muted); font-size: 0.85rem; margin-top: 0.75rem; min-height: 1.2em; }
.besso-signed { color: var(--gold); font-weight: 600; }

/* Live badge */
.besso-live {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-family: 'IBM Plex Mono', monospace; font-size: 0.7rem; letter-spacing: 0.15em;
  color: var(--drop); text-transform: uppercase;
}
.besso-live::before {
  content: ''; width: 8px; height: 8px; border-radius: 50%;
  background: var(--drop); box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.6);
  animation: besso-pulse 1.6s infinite;
}
@keyframes besso-pulse {
  0% { box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.6); }
  70% { box-shadow: 0 0 0 8px rgba(225, 29, 72, 0); }
  100% { box-shadow: 0 0 0 0 rgba(225, 29, 72, 0); }
}

/* Wallet */
.besso-balance { display: flex; align-items: baseline; justify-content: space-between; margin: 0.5rem 0 1rem; }
.besso-balance-label { color: var(--muted); text-transform: uppercase; letter-spacing: 0.12em; font-size: 0.75rem; }
.besso-balance-value { font-size: 2.4rem; color: var(--gold); }
.besso-packs { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.75rem; }
.besso-pack {
  background: var(--surface-2); border: 1px solid var(--line); border-radius: 14px;
  padding: 1rem; cursor: pointer; text-align: left; color: var(--text);
  display: flex; flex-direction: column; gap: 0.15rem;
}
.besso-pack:hover { border-color: var(--gold); }
.besso-pack-tokens { font-size: 1.5rem; color: var(--gold); }
.besso-pack-label { color: var(--muted); font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.1em; }
.besso-pack-price { margin-top: 0.4rem; font-weight: 600; }

/* Rooms grid */
.besso-rooms-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
.besso-room-card {
  display: block; text-decoration: none; color: var(--text);
  background: linear-gradient(180deg, var(--surface) 0%, var(--ink) 100%);
  border: 1px solid var(--line); border-radius: 16px; padding: 1.1rem;
}
.besso-room-card:hover { border-color: var(--gold); }
.besso-room-card-title { font-family: 'Unbounded', sans-serif; font-size: 1.2rem; margin: 0.5rem 0 0.25rem; }
.besso-room-card-prize { color: var(--muted); margin: 0 0 0.6rem; }
.besso-room-card-meta { display: flex; gap: 1rem; color: var(--gold); font-size: 0.85rem; }
.besso-room-card-stock { display: block; margin-top: 0.5rem; color: var(--muted); font-size: 0.8rem; }

/* Room layout */
.besso-room { display: grid; grid-template-columns: 1fr; gap: 1rem; }
.besso-stage-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.5rem; }
.besso-spectators { color: var(--muted); font-size: 0.8rem; }
.besso-stage {
  position: relative; aspect-ratio: 3 / 4; border-radius: 16px; overflow: hidden;
  background: radial-gradient(120% 80% at 50% 0%, var(--surface-2) 0%, var(--ink) 70%);
  border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
}
.besso-stage-placeholder { color: var(--muted); font-family: 'IBM Plex Mono', monospace; font-size: 0.85rem; }

.besso-emote {
  position: absolute; bottom: 12px; left: 50%; width: 22px; height: 22px;
  border-radius: 50%; animation: besso-float 1.6s ease-out forwards;
}
.besso-emote-heart { background: var(--drop); }
.besso-emote-fire { background: var(--gold); }
.besso-emote-shock { background: var(--teal); }
@keyframes besso-float {
  0% { transform: translate(-50%, 0) scale(0.6); opacity: 0; }
  20% { opacity: 1; }
  100% { transform: translate(-50%, -160px) scale(1.1); opacity: 0; }
}

.besso-controls { display: flex; flex-direction: column; gap: 0.5rem; }
.besso-turn { color: var(--gold); font-size: 0.9rem; min-height: 1.2em; text-align: center; }

/* Provably-fair receipt (the signature) */
.besso-receipt {
  border: 1px dashed var(--line); border-radius: 12px; padding: 0.9rem;
  background: rgba(10, 14, 39, 0.6);
}
.besso-receipt-head { font-family: 'Unbounded', sans-serif; font-weight: 800; letter-spacing: 0.02em; margin-bottom: 0.5rem; }
.besso-receipt-head.is-win { color: var(--gold); }
.besso-receipt-head.is-loss { color: var(--muted); }
.besso-receipt-row { display: flex; justify-content: space-between; font-size: 0.8rem; padding: 0.15rem 0; border-top: 1px solid var(--line); }
.besso-receipt-key { color: var(--muted); text-transform: uppercase; letter-spacing: 0.08em; }

.besso-marquee { color: var(--gold); font-size: 0.85rem; min-height: 1.2em; margin-top: 0.5rem; }

/* Poll */
.besso-poll-bar { display: flex; height: 34px; border-radius: 10px; overflow: hidden; border: 1px solid var(--line); }
.besso-poll-yes { background: rgba(45, 212, 191, 0.35); color: var(--text); display: flex; align-items: center; padding-left: 0.6rem; flex-basis: 50%; font-size: 0.8rem; }
.besso-poll-no { background: rgba(225, 29, 72, 0.35); color: var(--text); display: flex; align-items: center; justify-content: flex-end; padding-right: 0.6rem; flex-basis: 50%; font-size: 0.8rem; }
.besso-poll-actions { display: flex; gap: 0.5rem; }

/* Side: queue, chat, gifts */
.besso-room-side { display: flex; flex-direction: column; gap: 1rem; }
.besso-queue-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.4rem; }
.besso-queue-item { background: var(--surface-2); border-radius: 8px; padding: 0.3rem 0.6rem; font-size: 0.8rem; font-family: 'IBM Plex Mono', monospace; }
.besso-queue-item.is-me { background: var(--gold); color: #201700; }

.besso-chat-log { height: 220px; overflow-y: auto; background: var(--ink); border: 1px solid var(--line); border-radius: 12px; padding: 0.6rem; }
.besso-chat-line { margin: 0 0 0.35rem; font-size: 0.85rem; }
.besso-chat-user { color: var(--gold); font-weight: 600; }
.besso-chat-input { display: flex; gap: 0.5rem; margin-top: 0.5rem; }
.besso-chat-input .besso-btn { width: auto; margin-top: 0; }
.besso-reacts { display: flex; gap: 0.5rem; margin-top: 0.5rem; }
.besso-react { background: var(--surface-2); border: 1px solid var(--line); border-radius: 999px; color: var(--text); padding: 0.35rem 0.8rem; cursor: pointer; font-size: 0.8rem; }
.besso-react:hover { border-color: var(--gold); }
.besso-gifts { display: flex; flex-direction: column; gap: 0.5rem; }
.besso-gifts .besso-btn { margin-top: 0; }

/* Verify */
.besso-verify-row { border-top: 1px solid var(--line); padding: 0.75rem 0; }
.besso-verify-head { display: flex; justify-content: space-between; align-items: center; }
.besso-verify-room { font-family: 'Unbounded', sans-serif; font-weight: 600; }
.besso-verify-result { font-family: 'IBM Plex Mono', monospace; font-size: 0.75rem; text-transform: uppercase; }
.besso-verify-result.is-win { color: var(--gold); }
.besso-verify-result.is-loss { color: var(--muted); }
.besso-verify-meta { color: var(--muted); font-size: 0.78rem; margin: 0.25rem 0; }
.besso-verify-status { font-size: 0.82rem; color: var(--muted); }
.besso-verify-status.is-ok { color: var(--teal); }
.besso-verify-status.is-bad { color: var(--drop); }

/* Wider screens: two-column room */
@media (min-width: 860px) {
  .besso-room { grid-template-columns: 1.6fr 1fr; align-items: start; }
  .besso-rooms-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .besso-live::before, .besso-emote { animation: none; }
}

/* ---- Pass 5 game layer ---- */
.besso-glass{display:block; width:100%; height:auto; border-radius:16px}
.besso-cams{display:flex; gap:6px}
.besso-cam{background:var(--surface-2); border:1px solid var(--line); color:var(--muted); border-radius:999px; padding:.3rem .8rem; font-size:.75rem; cursor:pointer; font-family:'IBM Plex Mono',monospace}
.besso-cam.active{background:var(--gold); color:var(--ink); border-color:var(--gold)}

.besso-controller{display:flex; justify-content:center; gap:26px; margin:16px 0 4px}
.besso-cbtn{position:relative; width:70px; height:70px; border-radius:50%; border:1px solid var(--line); background:var(--surface-2); cursor:default; padding:0; transition:background .15s, box-shadow .15s, border-color .15s}
.besso-cbtn.active{background:var(--drop); border-color:var(--drop); cursor:pointer; box-shadow:0 0 26px rgba(225,29,72,.6)}
.besso-cbtn.active:active{transform:translateY(1px)}
.besso-ring{position:absolute; inset:-6px; width:calc(100% + 12px); height:calc(100% + 12px); transform:rotate(-90deg); pointer-events:none}
.besso-ring circle{fill:none; stroke:transparent; stroke-width:3; stroke-linecap:round}
.besso-cbtn.active .besso-ring circle{stroke:#fff}
.besso-cnum{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#fff; font-family:'IBM Plex Mono',monospace; font-weight:600; font-size:1.35rem; pointer-events:none}

.besso-status{text-align:center; color:var(--gold); font-size:.9rem; min-height:1.2em; margin-top:8px}
.besso-chat-field{background:#fff; color:#12141c}
.besso-chat-field::placeholder{color:#6b7280}
.besso-chat-send{flex:0 0 auto; background:var(--gold); color:#201700; width:auto}
.besso-react{background:var(--surface-2); border:1px solid var(--line); border-radius:50%; width:40px; height:40px; font-size:19px; cursor:pointer; padding:0; line-height:1}

/* Game modals (win and loss), appended to body by the game layer */
.besso-modal{position:fixed; inset:0; background:rgba(6,9,24,.72); display:none; align-items:center; justify-content:center; padding:16px; z-index:9999}
.besso-modal.show{display:flex}
.besso-modal-box{position:relative; background:linear-gradient(180deg,var(--surface),var(--ink)); border:1px solid var(--gold); border-radius:20px; padding:22px; max-width:420px; width:100%; overflow:hidden}
.besso-modal-loss .besso-modal-box{border-color:var(--line)}
.besso-win-eyebrow{font-family:'IBM Plex Mono',monospace; letter-spacing:.2em; font-size:.72rem; text-transform:uppercase; color:var(--gold)}
.besso-modal-h2{font-family:'Unbounded',sans-serif; font-weight:800; font-size:1.7rem; margin:.3rem 0 .2rem}
.besso-modal-copy{color:var(--text); margin-bottom:1rem}
.besso-modal-note{color:var(--drop); font-size:.82rem; min-height:1em; margin:.3rem 0}
.besso-field{margin-bottom:.6rem}
.besso-field label{display:block; font-size:.78rem; color:var(--muted); margin-bottom:.25rem}
.besso-field input{width:100%; background:#fff; color:#12141c; border:1px solid var(--line); border-radius:10px; padding:.6rem}
.besso-grid2{display:grid; grid-template-columns:1fr 1fr; gap:.6rem}
.besso-confetti{position:absolute; inset:0; pointer-events:none}
.besso-lossbar{height:6px; background:var(--surface-2); border-radius:999px; overflow:hidden; margin:12px 0 6px}
.besso-lossbar>div{height:100%; background:var(--drop); width:100%; transition:width 1s linear}
.besso-losscount{text-align:center; font-family:'IBM Plex Mono',monospace; color:var(--text); font-size:1.5rem; margin:.1rem 0 1rem}
.besso-modal .besso-btn{width:100%}
.besso-modal .besso-btn-ghost{margin-top:8px}
.besso-emote{position:absolute; bottom:14px; left:50%; pointer-events:none; font-size:24px; animation:besso-float 1.6s ease-out forwards}
.besso-wallet-pill{display:inline-flex; gap:.4rem; align-items:center; background:var(--surface-2); border:1px solid var(--line); border-radius:999px; padding:.3rem .8rem; font-size:.8rem; color:var(--muted); margin:10px auto 0; justify-content:center}
.besso-wallet-pill [data-besso-balance]{color:var(--gold)}

/* ---- Account (profile, verification, responsible gaming, prizes) ---- */
.besso-account{display:grid; grid-template-columns:1fr; gap:16px; max-width:560px}
.besso-account .besso-card{max-width:none}
.besso-account select.besso-input{appearance:none}
.besso-exclude{margin-top:1rem; padding-top:1rem; border-top:1px solid var(--line)}
.besso-exclude-row{display:flex; gap:8px}
.besso-exclude-row .besso-btn{width:auto; flex:1; margin-top:0}
.besso-prize-row{display:flex; justify-content:space-between; align-items:center; border-top:1px solid var(--line); padding:.6rem 0}
.besso-prize-name{font-weight:600}
.besso-prize-status{color:var(--muted); font-size:.78rem; text-transform:uppercase; letter-spacing:.06em}
.besso-prize-form{display:flex; flex-direction:column; gap:.5rem; padding-bottom:.8rem}
.besso-prize-form .besso-grid2{display:grid; grid-template-columns:1fr 1fr; gap:.5rem}

/* Power-up pills: two-line label with token cost */
.besso-gifts{display:flex; gap:10px; flex-direction:column}
.besso-powerup{display:flex; flex-direction:column; align-items:flex-start; gap:2px; background:var(--surface-2); border:1px solid var(--line); border-radius:12px; padding:.6rem .9rem; cursor:pointer; color:var(--text); text-align:left; width:100%; font-family:'Unbounded',sans-serif}
.besso-powerup:hover{border-color:var(--gold)}
.besso-powerup-name{font-weight:600; font-size:.9rem}
.besso-powerup-cost{font-family:'IBM Plex Mono',monospace; font-size:.75rem; color:var(--gold)}

/* Scoped preflight for Tailwind components.
   Global preflight is off (to protect the theme); this restores the essential
   resets only inside .besso-scope, at zero specificity via :where() so Tailwind
   utilities always win. Fixes bare buttons defaulting to the browser's white
   background with invisible text, and border utilities needing solid style. */
:where(.besso-scope), :where(.besso-scope) *, :where(.besso-scope) *::before, :where(.besso-scope) *::after {
  box-sizing: border-box;
  border-width: 0;
  border-style: solid;
  border-color: currentColor;
}
:where(.besso-scope) button,
:where(.besso-scope) input,
:where(.besso-scope) select,
:where(.besso-scope) textarea {
  background-color: transparent;
  background-image: none;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  margin: 0;
  padding: 0;
  line-height: inherit;
}
:where(.besso-scope) button { cursor: pointer; }
:where(.besso-scope) input::placeholder,
:where(.besso-scope) textarea::placeholder { color: #6b7280; opacity: 1; }

/* ------------------------------------------------------------------ *
 * Theme-proof controls. Aggressive themes (e.g. Woodmart) style bare
 * buttons, inputs and selects with their own !important rules, which is
 * why secondary buttons render as blank bars and inputs vanish. These
 * classes force BESSO styling with !important so they win everywhere.
 * ------------------------------------------------------------------ */
.besso-scope .besso-btn {
  background-color: #004225 !important;
  color: #e9e1d0 !important;
  border: 0 !important;
  border-radius: .375rem !important;
  font-family: 'Jost', sans-serif !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .14em !important;
  font-size: 12px !important;
  text-decoration: none !important;
  box-shadow: none !important;
  cursor: pointer !important;
}
.besso-scope .besso-btn:hover { filter: brightness(1.12) !important; background-color: #004225 !important; color: #e9e1d0 !important; }

.besso-scope .besso-btn-ghost {
  background-color: transparent !important;
  color: #004225 !important;
  border: 1px solid #004225 !important;
  border-radius: .375rem !important;
  font-family: 'Jost', sans-serif !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .14em !important;
  font-size: 12px !important;
  text-decoration: none !important;
  box-shadow: none !important;
  cursor: pointer !important;
}
.besso-scope .besso-btn-ghost:hover { background-color: #004225 !important; color: #e9e1d0 !important; border-color: #004225 !important; }

/* Dark, readable form fields (white placeholder text) */
.besso-scope .besso-input,
.besso-scope .besso-select {
  background-color: #1b1c1e !important;
  color: #ffffff !important;
  border: 1px solid rgba(138,127,106,.5) !important;
  border-radius: .375rem !important;
  box-shadow: none !important;
}
.besso-scope .besso-input::placeholder { color: #ffffff !important; opacity: .9 !important; }
.besso-scope .besso-input:focus, .besso-scope .besso-select:focus { outline: none !important; border-color: #e9e1d0 !important; }
.besso-scope .besso-input:disabled,
.besso-scope .besso-input[readonly] { opacity: .6 !important; }

/* Token pack cards: dark by default, invert to racing green on hover. */
.besso-scope .besso-pack {
  background-color: #1b1c1e !important;
  border: 1px solid rgba(138,127,106,.4) !important;
  border-radius: .375rem !important;
  transition: background-color .15s ease, border-color .15s ease !important;
  cursor: pointer !important;
}
.besso-scope .besso-pack:hover { background-color: #004225 !important; border-color: #004225 !important; }
.besso-scope .besso-pack:hover * { color: #e9e1d0 !important; }

/* Switch-room dropdown: light menu, readable items. */
.besso-scope .besso-switch-menu { background-color: #ffffff !important; border: 1px solid rgba(138,127,106,.4) !important; }
.besso-scope .besso-switch-item { background-color: transparent !important; color: #1b1c1e !important; border: 0 !important; cursor: pointer !important; }
.besso-scope .besso-switch-item:hover { background-color: #e9e1d0 !important; color: #1b1c1e !important; }

.besso-scope .besso-el-room-desc { font-size: 1rem !important; }
.besso-scope .hidden, .besso-scope.hidden { display: none !important; }
.besso-scope .besso-el-chat-input-row { display: flex !important; }
.besso-scope .besso-el-chat-input { flex: 1 1 auto !important; width: auto !important; min-width: 0 !important; }
.besso-scope .besso-el-chat-send { flex: 0 0 auto !important; width: auto !important; }

/* ------------------------------------------------------------------ *
 * Luxury skin base. Off-white ground, racing-green ink, GFS Didot
 * headings, Jost body. This is the single BESSO skin.
 * ------------------------------------------------------------------ */
.besso-scope {
  background-color: #e9e1d0;
  color: #1b1c1e;
  font-family: 'Jost', system-ui, sans-serif;
  font-weight: 500;
  position: relative;
}
/* Full-bleed off-white ground: a background layer that breaks out to the full
 * viewport width behind the (centred) content, WITHOUT moving content or the
 * theme's header/footer. Scoped to the app section, so no footer overlap. */
.besso-scope:not([data-besso-authmodal]):not(.besso-el-checkout-modal)::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 100vw;
  transform: translateX(-50%);
  background-color: #e9e1d0;
  z-index: -1;
}
/* Prevent the 1-scrollbar-width overflow the full-bleed layer can cause.
 * overflow-x: clip does NOT break sticky headers (unlike overflow: hidden). */
html:has(.besso-scope) { overflow-x: clip; }
.besso-scope h1, .besso-scope h2, .besso-scope h3,
.besso-scope .font-display {
  font-family: 'GFS Didot', Georgia, serif !important;
  font-weight: 400;
}

/* Hide the theme page-title bar on the DEDICATED app pages only (never on host
 * pages that merely embed a shortcode). Specific classes, no wildcard, so we can
 * never hide real page content. */
body.besso-app-page .page-title,
body.besso-app-page .page-title-conteiner,
body.besso-app-page .wd-page-title,
body.besso-app-page .main-page-title-wrapper,
body.besso-app-page .title-wrapper,
body.besso-app-page .woodmart-title,
body.besso-app-page .breadcrumbs,
body.besso-app-page .wc-breadcrumb { display: none !important; }

/* Dark surfaces keep light text (chat stream, live stage, feed badges). */
.besso-scope .besso-el-chat-stream,
.besso-scope .besso-el-chat-stream *,
.besso-scope .besso-el-stage,
.besso-scope .besso-el-stage *,
.besso-scope .besso-el-roomcard-live { color: #e9e1d0 !important; }
.besso-scope .besso-el-chat-stream { background-color: #1b1c1e !important; }

/* Live Rooms card specifics */
.besso-scope .besso-el-roomcard-play { font-size: 15px !important; }




/* Ghost button on dark surfaces (token modal etc.): light border and text. */
.besso-scope .besso-btn-ghost-light {
  background-color: transparent !important;
  color: #e9e1d0 !important;
  border: 1px solid rgba(233,225,208,.5) !important;
  border-radius: .375rem !important;
  font-family: 'Jost', sans-serif !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .14em !important;
  font-size: 12px !important;
  cursor: pointer !important;
}
.besso-scope .besso-btn-ghost-light:hover { background-color: rgba(233,225,208,.12) !important; color: #ffffff !important; }

/* Segmented tabs (Sign In / Sign Up): equal height, no border shift. */
.besso-scope .besso-tab {
  background-color: transparent !important;
  color: #1b1c1e !important;
  border: 0 !important;
  border-radius: .375rem !important;
  font-family: 'Jost', sans-serif !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .14em !important;
  font-size: 12px !important;
  cursor: pointer !important;
}
.besso-scope .besso-tab-active { background-color: #004225 !important; color: #e9e1d0 !important; }

/* Full-width page template wrapper: never impose its own width or padding. */
.besso-fullwidth-wrap { width: 100%; max-width: 100%; margin: 0; padding: 0; }

/* Gameplay route only: pull the app flush into the theme content area. */
body.besso-room-page #main-content {
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-top: -40px !important;
  margin-bottom: -40px !important;
}