/* ChatBase — 🔢 Guess the Number (numbergame.js) */
#numBanner {
    position: fixed; left: 50%; bottom: 96px; transform: translateX(-50%); z-index: 99984;
    display: flex; align-items: center; gap: 10px; width: min(430px, calc(100vw - 24px));
    background: linear-gradient(135deg, rgba(20,35,55,.96), rgba(35,15,55,.96));
    border: 1px solid rgba(138,180,255,.5); border-radius: 14px; padding: 9px 13px;
    box-shadow: 0 10px 34px rgba(0,0,0,.45); color: #fff; animation: numIn .3s ease;
}
@keyframes numIn { from { opacity: 0; transform: translate(-50%, 14px); } to { opacity: 1; transform: translate(-50%, 0); } }
#numBanner.num-done { border-color: rgba(52,232,176,.6); }
.num-ico { font-size: 26px; }
.num-mid { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.num-mid b { font-size: 13px; }
.num-mid small { font-size: 11px; color: rgba(255,255,255,.65); }
.num-entry { display: flex; gap: 4px; align-items: center; }
.num-entry input { width: 64px; padding: 7px 8px; border-radius: 9px; border: 1px solid rgba(255,255,255,.25); background: rgba(0,0,0,.3); color: #fff; font: inherit; }
.num-entry button { font: inherit; font-size: 13px; font-weight: 800; cursor: pointer; color: #10203a; padding: 8px 12px; border-radius: 9px; border: none; background: linear-gradient(135deg, #8ab4ff, #6a9cff); }
.num-entry button:active { transform: scale(.93); }
.num-in { font-size: 12px; font-weight: 700; color: #8ab4ff; white-space: nowrap; }
@media (max-width: 560px) { #numBanner { bottom: 150px; } }
