/* Home page "Try it": a copy of the real BALL OS Scorer Tablet (ScorerTablet.css in the app),
   drawn at the tablet's own 1280x800 size and scaled to fit. Sample data only. */
.tabdemo { position: relative; }
.tabdemo__device {
  position: relative; padding: clamp(10px, 1.6vw, 22px); border-radius: clamp(22px, 3vw, 40px);
  background: linear-gradient(145deg, #3a3d44 0%, #15171b 18%, #0b0c0f 50%, #1b1d22 82%, #4a4d55 100%);
  box-shadow: 0 0 0 1px rgba(255,255,255,.08) inset, 0 1px 0 rgba(255,255,255,.18) inset, 0 50px 120px -30px rgba(0,0,0,.85), 0 30px 60px -40px rgba(205,170,99,.25);
}
.tabdemo__device::before { content: ""; position: absolute; top: 50%; left: clamp(4px, .7vw, 9px); width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #4b5563, #050608 70%); box-shadow: 0 0 0 1px rgba(255,255,255,.06); }
.tabdemo__screen { position: relative; overflow: hidden; border-radius: clamp(8px, 1.2vw, 14px); background: #000; box-shadow: 0 0 0 1px #000; }
.tabdemo__screen::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(115deg, rgba(255,255,255,.07) 0%, rgba(255,255,255,0) 28%, rgba(255,255,255,0) 72%, rgba(255,255,255,.035) 100%); }
.tabdemo__fit { position: relative; width: 100%; }
.tabdemo__note { display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; margin-top: 14px; font-size: 12.5px; color: var(--fg-3, #8a9098); }
.tabdemo__note b { color: var(--gold, #cdaa63); font-weight: 600; }
.tabdemo__auto { font: 500 10.5px var(--mono, monospace); letter-spacing: .14em; text-transform: uppercase; color: #6fde4f; }
.tabdemo__auto[hidden] { display: none; }
.tabdemo__out { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, .65fr); align-items: start; gap: 14px; margin-top: 18px; }
@media (max-width: 860px) { .tabdemo__out { grid-template-columns: 1fr; } }

.bxs { border-radius: 14px; border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.02); padding: 12px 14px; overflow-x: auto; }
.bxs table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.bxs th { font: 500 10px "JetBrains Mono", monospace; letter-spacing: .12em; color: rgba(239,236,228,.45); text-align: right; padding: 5px 6px; border-bottom: 1px solid rgba(255,255,255,.12); }
.bxs th:first-child, .bxs td:first-child { text-align: left; }
.bxs td { text-align: right; padding: 5px 6px; border-bottom: 1px solid rgba(255,255,255,.05); color: rgba(239,236,228,.7); font-variant-numeric: tabular-nums; }
.bxs td:first-child { color: #efece4; white-space: nowrap; }
.bxs td.hot { color: #e7d3a1; font-weight: 700; }
.bxs tr.team td { font: 700 10px "JetBrains Mono", monospace; letter-spacing: .16em; padding-top: 10px; color: #00e5ff; border-bottom: 0; }

/* ═══ The tablet ═════════════════════════════════════════════════════ */
.stab {
  --cyan: #00e5ff; --cyan-bright: #6effff; --amber: #ff9f1c; --red: #ff3b5c; --green: #6fde4f;
  --home: #e41248; --away: #4968bc; --edge: rgba(255,255,255,.32); --edge-soft: rgba(255,255,255,.16);
  position: absolute; left: 0; top: 0; width: 1280px; height: 800px; transform-origin: 0 0;
  background: #000; color: #fff; font-family: "Inter", -apple-system, sans-serif; overflow: hidden;
  display: flex; flex-direction: column; user-select: none; -webkit-user-select: none;
}
.stab button { font-family: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.stab__bar { display: grid; grid-template-columns: 296px 1fr 296px 64px; gap: 10px; align-items: start; padding: 4px 10px 6px 10px; border-bottom: 1px solid #111; height: 152px; }
.stab__live { position: absolute; top: 7px; left: 9px; z-index: 2; padding: 3px 8px; font: 700 9px "JetBrains Mono", monospace; letter-spacing: 2px; color: #fff; background: rgba(0,0,0,.6); border: 1px solid #333; }
.stab__live i { display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: #fff; margin-right: 5px; vertical-align: 1px; }
.stab__team { background: #181818; border: 1px solid #2a2a2a; border-top: 3px solid var(--tc); }
.stab__team--home { --tc: var(--home); background: linear-gradient(180deg, #2a0e15 0, #181818 36px); }
.stab__team--away { --tc: var(--away); background: linear-gradient(180deg, #171b26 0, #181818 36px); }
.stab__tname { height: 30px; display: grid; place-items: center; font: 900 17px "Inter", sans-serif; letter-spacing: 3px; border-bottom: 1px solid #2a2a2a; }
.stab__score { text-align: center; font: 900 28px/1 "Inter", sans-serif; padding: 3px 0 2px; font-variant-numeric: tabular-nums; }
.stab__score.pop { animation: spop .45s ease; }
@keyframes spop { 0% { transform: scale(1.3); color: var(--cyan-bright); text-shadow: 0 0 18px var(--cyan); } 100% { transform: none; } }
.stab__adj { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 0 9px 6px; }
.stab__adj button { height: 31px; border: 0; color: #fff; font-size: 11px; font-weight: 700; box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 2px 0 rgba(0,0,0,.5); }
.stab__adj button:first-child { background: linear-gradient(180deg, #23b558, #179a45); }
.stab__adj button:last-child { background: linear-gradient(180deg, #db6767, #c24c4c); }
.stab__adj button:active { transform: translateY(1px); }
.stab__meta { display: grid; grid-template-columns: 1fr 1fr 1fr; border-top: 1px solid #2a2a2a; padding: 5px 0 6px; text-align: center; }
.stab__meta small { display: block; font: 700 7px "JetBrains Mono", monospace; letter-spacing: 1px; color: #d4d8de; margin-bottom: 1px; }
.stab__meta span { font-size: 12px; font-weight: 700; }
.stab__meta .bonus { color: var(--amber); font-weight: 900; }
.stab__to { display: inline-flex; align-items: center; gap: 4px; }
.stab__to button { width: 14px; height: 14px; padding: 0; line-height: 12px; font-size: 11px; background: #e5e7eb; color: #000; border: 0; border-radius: 2px; }
.stab__mid { display: flex; flex-direction: column; align-items: center; gap: 8px; padding-top: 2px; }
.stab__clock { display: flex; align-items: baseline; gap: 12px; }
.stab__q { font: 900 22px/1 "Orbitron", sans-serif; text-shadow: 0 0 22px rgba(0,229,255,.65); }
.stab__time { font: 700 25px/1 "Orbitron", sans-serif; font-variant-numeric: tabular-nums; text-shadow: 0 0 24px rgba(0,229,255,.65); }
.stab__time.run { color: var(--cyan-bright); }
.stab__ctrls { display: flex; gap: 7px; }
.stab__ctrl { padding: 5px 12px; border-radius: 999px; font: 700 9px "JetBrains Mono", monospace; letter-spacing: 1.6px; color: #fff; border: 1px solid rgba(255,255,255,.35); box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 2px 0 rgba(0,0,0,.5), 0 0 12px rgba(255,255,255,.08); }
.stab__ctrl:active { transform: translateY(1px); }
.stab__ctrl--start { background: linear-gradient(180deg, #22c55e, #16a34a); box-shadow: 0 0 14px rgba(34,197,94,.45), inset 0 1px 0 rgba(255,255,255,.35); }
.stab__ctrl--start.stop { background: linear-gradient(180deg, #f43f5e, #be123c); box-shadow: 0 0 14px rgba(244,63,94,.5); }
.stab__ctrl--endq { background: linear-gradient(180deg, #f59e0b, #d97706); }
.stab__ctrl--edit { background: linear-gradient(180deg, #0ea5e9, #0284c7); }
.stab__ctrl--setup { background: linear-gradient(180deg, #a5b4fc, #818cf8); }
.stab__ctrl--buzz { background: linear-gradient(180deg, #fb7185, #e11d48); box-shadow: 0 0 16px rgba(225,29,72,.55), inset 0 1px 0 rgba(255,255,255,.35); }
.stab__ctrl--buzz.ring { animation: buzz .5s ease 2; }
@keyframes buzz { 0%,100% { transform: none; } 25% { transform: rotate(-5deg) scale(1.08); } 75% { transform: rotate(5deg) scale(1.08); } }
.stab__shot { display: flex; align-items: center; gap: 0; padding: 4px; background: #111; border: 1px solid #333; }
.stab__shot b { font: 700 8px "JetBrains Mono", monospace; letter-spacing: 2px; padding: 0 9px; color: #d4d8de; }
.stab__shot button { padding: 4px 9px; font: 700 8px "JetBrains Mono", monospace; letter-spacing: 1px; border: 0; background: #ff9f1c; color: #000; }
.stab__shot button + button { border-left: 1px solid #b86b00; }
.stab__shot button.on { background: #ffd9a0; }
.stab__shot output { margin-left: 8px; min-width: 64px; padding: 3px 6px; font: 700 8px "JetBrains Mono", monospace; letter-spacing: 1.5px; color: #8a9098; border: 1px dashed #555; text-align: center; }
.stab__shot output.live { font: 900 13px "Orbitron", sans-serif; color: var(--amber); border-style: solid; border-color: var(--amber); letter-spacing: 0; padding: 1px 6px; }
.stab__side { display: grid; gap: 6px; padding-top: 48px; }
.stab__lat { height: 18px; border: 1px solid #0e7490; font: 700 8px "JetBrains Mono", monospace; color: var(--cyan); display: grid; place-items: center; background: #031417; }
.stab__undo { height: 24px; border: 1px solid #ff3b5c; background: #ff3b5c; color: #fff; font: 700 8px "JetBrains Mono", monospace; letter-spacing: 1.5px; box-shadow: 0 0 10px rgba(255,59,92,.4); }

.stab__body { flex: 1; display: grid; grid-template-columns: 356px 1fr 356px; gap: 6px; padding: 6px 10px; min-height: 0; }
.stab__roster { position: relative; border: 1px solid #0a0a0a; outline: 1px solid var(--tc); outline-offset: -1px; padding: 6px; display: flex; flex-direction: column; gap: 4px; min-height: 0; overflow: hidden; }
.stab__roster--home { --tc: var(--home); }
.stab__roster--away { --tc: var(--away); }
.stab__rname { text-align: center; font: 900 11px "Inter", sans-serif; letter-spacing: 3px; padding: 3px 0 2px; background: #0d0d0d; }
.stab__rname::after { content: ""; display: block; height: 14px; }
.stab__timeout { height: 20px; border: 0; background: linear-gradient(180deg, #ffb340, #f59e0b); color: #000; font: 800 8px "JetBrains Mono", monospace; letter-spacing: 1.6px; box-shadow: 0 0 14px rgba(255,159,28,.45), inset 0 1px 0 rgba(255,255,255,.4); }
.stab__timeout:active { transform: translateY(1px); }
.stab__jersey { display: flex; align-items: center; gap: 10px; min-height: 47px; padding: 0 6px 0 8px; background: #1c1c1c; border: 1px solid var(--edge-soft); border-bottom: 2px solid rgba(0,0,0,.5); border-left: 3px solid var(--tc); color: #fff; text-align: left; box-shadow: inset 0 1px 0 rgba(255,255,255,.08); transition: background .12s, box-shadow .12s, border-color .12s; }
.stab__roster--away .stab__jersey { border-left: 1px solid var(--edge-soft); border-right: 3px solid var(--tc); padding: 0 8px 0 6px; }
.stab__jersey:hover { background: rgba(0,229,255,.12); border-color: var(--cyan); }
.stab__jersey.on { background: #2a2a2a; border-color: var(--tc); box-shadow: 0 0 18px var(--tc), inset 0 1px 0 rgba(255,255,255,.15); }
.stab__jersey:active { transform: translateY(1px); }
.stab__circ { flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--tc); font-size: 10px; font-weight: 800; box-shadow: inset 0 1px 0 rgba(255,255,255,.25); }
.stab__name { flex: 1; min-width: 0; font-size: 12.5px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.stab__chip { flex: none; width: 40px; height: 36px; display: grid; place-items: center; background: var(--tc); font: 900 22px "JetBrains Mono", monospace; border: 1px solid rgba(255,255,255,.22); border-bottom: 3px solid rgba(0,0,0,.45); box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 2px 0 rgba(0,0,0,.5); }
.stab__jersey.on .stab__chip { box-shadow: 0 0 16px var(--tc), inset 0 1px 0 rgba(255,255,255,.35); }
.stab__pf { font: 800 8px "JetBrains Mono", monospace; color: var(--amber); letter-spacing: .5px; }

.stab__center { display: flex; flex-direction: column; gap: 5px; min-height: 0; }
.stab__selrow { display: flex; gap: 6px; }
.stab__sel { flex: 1; height: 30px; display: flex; align-items: center; gap: 8px; padding: 0 9px; background: var(--cyan); color: #000; font: 800 10px "JetBrains Mono", monospace; letter-spacing: 1.6px; box-shadow: 0 0 16px rgba(0,229,255,.45); }
.stab__sel--empty { justify-content: center; background: #050505; color: #d4d8de; border: 1px dashed #333; box-shadow: none; letter-spacing: 3px; }
.stab__sel b { font: 900 12px "Orbitron", sans-serif; letter-spacing: 1px; }
.stab__sel span { font-family: "Inter", sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 1px; }
.stab__sel button { margin-left: auto; width: 18px; height: 18px; padding: 0; border: 1px solid rgba(0,0,0,.35); background: rgba(255,255,255,.35); font-size: 10px; line-height: 1; }
.stab__tech { width: 69px; border: 0; background: linear-gradient(180deg, #ef4444, #b91c1c); color: #fff; font-size: 8px; font-weight: 800; letter-spacing: .6px; box-shadow: 0 0 10px rgba(239,68,68,.35); }
.stab__shotvals { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.stab__sv { height: 22px; border: 0; font: 800 10px "Inter", sans-serif; letter-spacing: 2px; color: #000; border-radius: 4px; }
.stab__sv[data-v="2PT"] { background: #00b8cc; } .stab__sv[data-v="3PT"] { background: #00b8cc; } .stab__sv[data-v="FT"] { background: #f8b610; }
.stab__sv.on { background: #6effff; box-shadow: 0 0 0 2px #000, 0 0 0 3px #6effff, 0 0 14px rgba(0,229,255,.6); }
.stab__sv[data-v="FT"].on { background: #ffd35c; box-shadow: 0 0 0 2px #000, 0 0 0 3px #ffd35c, 0 0 14px rgba(248,182,16,.6); }
.stab__res { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 4px; background: #070707; border: 1px solid #141414; }
.stab__res::before { content: "SELECT RESULT"; position: absolute; top: -6px; left: 12px; padding: 0 4px; font: 800 6.5px "JetBrains Mono", monospace; letter-spacing: 1px; color: #f8b610; background: #000; }
.stab__btn { display: grid; place-items: center; align-content: center; gap: 1px; border: 1px solid rgba(255,255,255,.25); border-bottom: 3px solid rgba(0,0,0,.45); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 2px 0 rgba(0,0,0,.5); transition: filter .12s, opacity .2s, transform .06s; }
.stab__btn b { font-size: 11px; font-weight: 800; letter-spacing: 1.2px; }
.stab__btn small { font: 700 6.5px "JetBrains Mono", monospace; letter-spacing: 1px; opacity: .85; }
.stab__btn:not(:disabled):active { transform: translateY(2px); border-bottom-width: 1px; }
.stab__btn:not(:disabled):hover { filter: brightness(1.12); }
.stab__btn:disabled { opacity: .35; filter: saturate(.6); cursor: not-allowed; }
.stab__made { height: 44px; background: linear-gradient(180deg, #22c55e, #15803d); border-radius: 6px; }
.stab__miss { height: 44px; background: linear-gradient(180deg, #ef4444, #991b1b); border-radius: 6px; }
.stab__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 5px; }
.stab__stat { height: 37px; border-radius: 999px; }
.stab__stat[data-k="REB"] { background: #1d4ed8; border-color: #60a5fa; }
.stab__stat[data-k="AST"] { background: #7e22ce; border-color: #c084fc; }
.stab__stat[data-k="STL"] { background: #0d9488; border-color: #2dd4bf; }
.stab__stat[data-k="BLK"] { background: #be185d; border-color: #f472b6; }
.stab__stat[data-k="TO"] { background: #b91c1c; border-color: #f87171; }
.stab__stat[data-k="FOUL"] { background: #b45309; border-color: #fbbf24; }
.stab__voice { flex: 1; min-height: 0; margin-top: 3px; padding: 7px 8px; border: 1px solid #12232a; border-radius: 6px; background: #02070a; display: flex; flex-direction: column; gap: 5px; }
.stab__vhead { display: flex; align-items: center; justify-content: space-between; }
.stab__vhead strong { font: 800 7.5px "JetBrains Mono", monospace; letter-spacing: 1.2px; color: var(--cyan); }
.stab__vmode { display: flex; gap: 5px; }
.stab__vmode span { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-size: 13px; background: #0f1a1f; border: 1px solid #1f2f36; }
.stab__vmode span.on { background: #06b6d4; box-shadow: 0 0 14px rgba(6,182,212,.6); }
.stab__vsub { font: 700 6.5px "JetBrains Mono", monospace; letter-spacing: .4px; color: var(--cyan); }
.stab__vin { width: 100%; height: 34px; resize: none; padding: 6px 8px; background: #050b0e; border: 1px solid #1f2f36; border-radius: 4px; color: #fff; font: 10px "Inter", sans-serif; outline: none; }
.stab__vin:focus { border-color: var(--cyan); }
.stab__vbtns { display: grid; grid-template-columns: 1fr .9fr .6fr; gap: 5px; }
.stab__vbtns button { height: 22px; border: 0; border-radius: 3px; font-size: 7.5px; font-weight: 800; letter-spacing: .8px; color: #fff; }
.stab__vbtns button:nth-child(1) { background: #0891b2; } .stab__vbtns button:nth-child(2) { background: #334155; } .stab__vbtns button:nth-child(3) { background: #475569; }
.stab__vstatus { font-size: 8px; color: #8fdcec; min-height: 11px; }
.stab__pending { display: flex; align-items: center; gap: 6px; padding: 5px 6px; border: 1px solid #0e7490; background: #04161b; font-size: 9px; }
.stab__pending b { flex: 1; }
.stab__pending button { height: 18px; padding: 0 8px; border: 0; font-size: 7.5px; font-weight: 800; letter-spacing: .6px; color: #000; }
.stab__pending button:first-of-type { background: #6fde4f; } .stab__pending button:last-of-type { background: #ff6b81; }

.stab__assist { margin: 0 10px 6px; height: 64px; display: none; align-items: center; gap: 12px; padding: 0 12px; border: 1px solid rgba(245,197,24,.55); border-radius: 10px; background: linear-gradient(180deg, #1a1405, #0e0c06); box-shadow: 0 0 22px rgba(245,197,24,.18); animation: aslide .3s ease; }
.stab__assist.open { display: flex; }
@keyframes aslide { from { transform: translateY(14px); opacity: 0; } to { transform: none; opacity: 1; } }
.stab__assist h5 { margin: 0; font: 900 13px "Inter", sans-serif; color: #f5c518; letter-spacing: 1px; }
.stab__assist p { margin: 2px 0 0; font-size: 10px; color: #d4d8de; }
.stab__achips { display: flex; gap: 6px; margin-left: auto; }
.stab__achips button { width: 50px; height: 40px; border-radius: 8px; border: 1px solid #333; background: #141414; color: #fff; display: grid; place-items: center; align-content: center; font: 800 13px "Inter", sans-serif; }
.stab__achips button small { font: 700 6.5px "JetBrains Mono", monospace; color: #8a9098; letter-spacing: 1px; }
.stab__achips button:hover { border-color: var(--cyan); background: rgba(0,229,255,.1); }
.stab__skip { margin-left: 14px; width: 50px; height: 40px; border: 1px solid #333; border-radius: 8px; background: #141414; color: #fff; font-size: 10px; font-weight: 800; letter-spacing: 1px; }

.stab__plays { margin: 0 10px 8px; height: 64px; display: flex; align-items: center; gap: 8px; padding: 0 10px; border: 1px solid #1d232c; border-radius: 10px; background: #0b0f14; }
.stab__plays > div:first-child { flex: none; display: grid; gap: 5px; }
.stab__plays h6 { margin: 0; font: 800 7.5px "JetBrains Mono", monospace; letter-spacing: 2px; color: #d4d8de; }
.stab__ul { height: 22px; padding: 0 12px; border: 1px solid #334155; border-radius: 6px; background: #0f172a; color: #fff; font-size: 8px; font-weight: 700; }
.stab__ul:disabled { opacity: .45; cursor: not-allowed; }
.stab__list { display: flex; gap: 6px; overflow: hidden; flex: 1; }
.stab__play { flex: none; width: 118px; height: 42px; padding: 5px 8px; border: 1px solid #263040; border-radius: 6px; background: #121821; display: grid; align-content: center; gap: 2px; animation: pin .35s ease; }
.stab__play:first-child { border-color: #2dd4bf; box-shadow: 0 0 10px rgba(45,212,191,.2); }
@keyframes pin { from { transform: translateX(-12px); opacity: 0; } to { transform: none; opacity: 1; } }
.stab__play small { font: 600 6.5px "Inter", sans-serif; color: #9aa4b2; letter-spacing: .3px; white-space: nowrap; }
.stab__play b { font-size: 9px; font-weight: 800; letter-spacing: .3px; white-space: nowrap; }
.stab__play em { font-style: normal; font-size: 6px; font-weight: 800; color: #2dd4bf; letter-spacing: .6px; }
.stab__msg { flex: none; max-width: 190px; font-size: 9px; color: #9aa4b2; text-align: right; }
.stab__2nd { position: absolute; right: 18px; bottom: 150px; display: flex; align-items: center; gap: 8px; padding: 6px 6px 6px 10px; border: 1px solid #2a2f37; border-radius: 12px; background: rgba(12,14,18,.92); }
.stab__2nd i { color: #555; font-style: normal; font-size: 12px; }
.stab__2nd button { height: 34px; padding: 0 12px; border: 1px solid #333; border-radius: 8px; background: #16181d; color: #fff; font-size: 10px; font-weight: 800; letter-spacing: 1px; }
.stab__pop { position: absolute; right: 18px; top: 188px; width: 300px; padding: 14px; border: 1px solid #333; border-radius: 12px; background: #121418; box-shadow: 0 20px 60px rgba(0,0,0,.6); display: none; z-index: 4; }
.stab__pop.open { display: block; animation: aslide .25s ease; }
.stab__pop h5 { margin: 0 0 8px; font-size: 13px; }
.stab__pop p { margin: 0 0 8px; font-size: 10.5px; color: #c9ced6; line-height: 1.45; }
.stab__pop .opts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 8px 0 10px; }
.stab__pop .opts span { padding: 8px 0; border: 1px solid #333; border-radius: 6px; text-align: center; font-size: 10px; font-weight: 700; }
.stab__pop .opts span.on { background: #f5c518; color: #000; border-color: #f5c518; }
.stab__pop button { width: 100%; height: 30px; border: 0; border-radius: 6px; background: #2563eb; color: #fff; font-size: 10px; font-weight: 800; letter-spacing: .8px; }
.stab__toast { position: absolute; left: 50%; top: 158px; transform: translateX(-50%); padding: 7px 14px; border-radius: 999px; background: rgba(0,229,255,.14); border: 1px solid var(--cyan); color: #c9fbff; font-size: 10px; font-weight: 600; opacity: 0; pointer-events: none; transition: opacity .25s; z-index: 5; white-space: nowrap; }
.stab__toast.show { opacity: 1; }
.stab__final { position: absolute; inset: 0; display: none; place-items: center; background: rgba(0,0,0,.78); z-index: 6; }
.stab__final.open { display: grid; }
.stab__final > div { width: 460px; padding: 22px; border: 1px solid #2dd4bf; border-radius: 14px; background: #071012; text-align: center; box-shadow: 0 0 40px rgba(45,212,191,.25); }
.stab__final h5 { margin: 0 0 6px; font: 900 13px "JetBrains Mono", monospace; letter-spacing: 3px; color: #2dd4bf; }
.stab__final strong { display: block; font: 900 38px "Orbitron", sans-serif; margin: 8px 0; }
.stab__final p { font-size: 11px; color: #c9ced6; margin: 0 0 14px; }
.stab__final .row2 { display: flex; gap: 8px; justify-content: center; }
.stab__final button { height: 34px; padding: 0 16px; border: 0; border-radius: 6px; font-size: 10px; font-weight: 800; letter-spacing: 1px; }
.stab__final button.lock { background: #2dd4bf; color: #000; } .stab__final button.again { background: #1f2937; color: #fff; }
.stab__tap { position: absolute; width: 34px; height: 34px; margin: -17px 0 0 -17px; border-radius: 50%; border: 2px solid #fff; background: rgba(255,255,255,.18); pointer-events: none; z-index: 8; opacity: 0; }
.stab__tap.go { animation: tapfx .55s ease; }
@keyframes tapfx { 0% { opacity: .95; transform: scale(.4); } 100% { opacity: 0; transform: scale(1.4); } }
@media (prefers-reduced-motion: reduce) { .stab *, .tabdemo * { animation: none !important; transition: none !important; } }