:root {
  --adminuiux-content-font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --adminuiux-content-font-weight: 400;
  --adminuiux-title-font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --adminuiux-title-font-weight: 700;
  --b-B: #2f7cf6; --b-I: #e8453c; --b-N: #9aa3b5; --b-G: #20b26b; --b-O: #f5a524;
}
.brand-bingo { font-weight: 800; letter-spacing: .5px; }
.brand-bingo .l { display: inline-grid; place-items: center; width: 1.6em; height: 1.6em; border-radius: 50%;
  color: #fff; font-size: .8em; margin-right: 2px; box-shadow: inset 0 -3px 0 rgba(0,0,0,.18); }
.l-B { background: var(--b-B); } .l-I { background: var(--b-I); } .l-N { background: var(--b-N); }
.l-G { background: var(--b-G); } .l-O { background: var(--b-O); }

.text-theme { color: var(--adminuiux-theme-1) !important; }
.money { font-variant-numeric: tabular-nums; font-weight: 700; }
.kpi .value { font-size: 1.6rem; font-weight: 800; line-height: 1.1; }
.kpi .label { font-size: .8rem; opacity: .65; text-transform: uppercase; letter-spacing: .5px; }
.kpi .avatar { display: grid; place-items: center; }

/* ---------- carton ---------- */
.carton { --tam: 46px; display: inline-block; border-radius: 16px; padding: 10px; background: var(--bs-body-bg);
  box-shadow: 0 6px 24px rgba(0,0,0,.12); border: 1px solid rgba(127,127,127,.18); }
.carton .cab { display: grid; grid-template-columns: repeat(5, var(--tam)); gap: 4px; margin-bottom: 4px; }
.carton .cab span { text-align: center; color: #fff; font-weight: 800; border-radius: 8px; padding: 2px 0;
  font-size: calc(var(--tam) * .42); }
.carton .rej { display: grid; grid-template-columns: repeat(5, var(--tam)); gap: 4px; }
.carton .c { height: var(--tam); display: grid; place-items: center; border-radius: 10px; font-weight: 700;
  font-size: calc(var(--tam) * .4); background: rgba(127,127,127,.10); user-select: none; position: relative;
  transition: transform .15s, background .2s; }
.carton .c.libre { font-size: calc(var(--tam) * .22); background: var(--adminuiux-theme-1); color: #fff; }
.carton .c.fig { outline: 2px dashed var(--adminuiux-theme-1); outline-offset: -2px; }
.carton .c.cantado { background: var(--adminuiux-theme-1); color: #fff; transform: scale(.96); }
.carton .c.marcado:not(.cantado)::after { content: ""; position: absolute; inset: 18%; border-radius: 50%;
  border: 3px solid var(--adminuiux-theme-1); }
.carton .pie { display: flex; justify-content: space-between; align-items: center; margin-top: 6px; font-size: .85rem; }
.carton.ganador { box-shadow: 0 0 0 4px var(--b-G), 0 0 40px rgba(32,178,107,.6); animation: latido 1s infinite; }
@keyframes latido { 50% { transform: scale(1.02); } }

/* ---------- figura mini ---------- */
.mini-fig { display: inline-grid; grid-template-columns: repeat(5, 1fr); gap: 2px; width: 46px; vertical-align: middle; }
.mini-fig i { aspect-ratio: 1; border-radius: 2px; background: rgba(127,127,127,.25); }
.mini-fig i.on { background: var(--adminuiux-theme-1); }
.fig-opcion { cursor: pointer; border: 2px solid transparent; border-radius: 14px; padding: 10px 6px; text-align: center;
  background: rgba(127,127,127,.07); transition: .15s; }
.fig-opcion:hover { background: rgba(127,127,127,.14); }
.fig-opcion.activa { border-color: var(--adminuiux-theme-1); background: rgba(var(--adminuiux-theme-1-rgb), .12); }
.fig-opcion .mini-fig { width: 52px; }
.fig-opcion small { display: block; margin-top: 6px; font-weight: 600; }

/* ---------- balota ---------- */
.balota { --d: 64px; width: var(--d); height: var(--d); border-radius: 50%; display: inline-grid; place-items: center;
  color: #fff; font-weight: 800; position: relative;
  background: radial-gradient(circle at 32% 28%, rgba(255,255,255,.55), rgba(255,255,255,0) 42%), var(--bc, #888);
  box-shadow: inset 0 -6px 12px rgba(0,0,0,.25), 0 6px 18px rgba(0,0,0,.25); line-height: 1; }
.balota::before { content: ""; position: absolute; inset: 18%; border-radius: 50%; background: #fff; }
.balota > span { position: relative; color: #1b1f2a; text-align: center; font-size: calc(var(--d) * .36); }
.balota > span small { display: block; font-size: .45em; font-weight: 800; color: var(--bc); }

/* ---------- tablero 75 (admin) ---------- */
.tablero { display: grid; grid-template-columns: 34px repeat(15, 1fr); gap: 4px; }
.tablero .let { color: #fff; font-weight: 800; display: grid; place-items: center; border-radius: 8px; }
.tablero .n { aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%; font-weight: 700; font-size: .85rem;
  background: rgba(127,127,127,.10); color: inherit; opacity: .55; }
.tablero .n.si { background: var(--adminuiux-theme-1); color: #fff; opacity: 1; }
.tablero .n.ult { box-shadow: 0 0 0 3px var(--b-O); }

.tabla-ventas td, .tabla-ventas th { vertical-align: middle; }
.chip { display: inline-block; padding: 1px 8px; border-radius: 99px; background: rgba(var(--adminuiux-theme-1-rgb), .14);
  color: var(--adminuiux-theme-1); font-weight: 700; font-size: .8rem; margin: 1px; }
.estado { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; padding: 3px 10px; border-radius: 99px; }
.estado.preparando { background: rgba(245,165,36,.18); color: #c47f00; }
.estado.jugando { background: rgba(32,178,107,.18); color: #129256; }
.estado.terminado { background: rgba(127,127,127,.18); }
.estado.anulado { background: rgba(232,69,60,.15); color: #c0322a; }
.seccion { display: none; } .seccion.activa { display: block; animation: aparece .25s; }
@keyframes aparece { from { opacity: 0; transform: translateY(6px); } }
.cand { border-left: 4px solid var(--b-G); }
.btn-gigante { font-size: 1.25rem; padding: 14px 22px; border-radius: 16px; font-weight: 800; }
#toasts { position: fixed; top: 76px; right: 16px; z-index: 2000; display: flex; flex-direction: column; gap: 8px; }
.toast-b { padding: 10px 16px; border-radius: 12px; color: #fff; font-weight: 600; box-shadow: 0 8px 24px rgba(0,0,0,.2);
  animation: aparece .2s; max-width: 340px; }
.toast-b.ok { background: #129256; } .toast-b.err { background: #c0322a; }
.adminuiux-sidebar .menu-icon { font-size: 1.15rem; }
.pageloader { display: none !important; }

.adminuiux-header .navbar .navbar-brand.marca-bingo { display: inline-flex !important; flex-direction: column !important; align-items: center !important; justify-content: center; line-height: 1; gap: 3px; }
.adminuiux-header .navbar .navbar-brand.marca-bingo > span { margin: 0 !important; }
.marca-bingo .sub-marca { font-size: .68rem; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; opacity: .8; white-space: nowrap; }