/* رصاصة بارون — pro noir look (2026-10-31): crimson velvet lounge, gold & gunmetal, revolver-cylinder hub, bullet pointer */
body.bb { background: #0c0405; color: #fff4dc; }
.bb-bg { position: fixed; inset: 0; z-index: 0; pointer-events: none; background: #0c0405 url(/assets/bullet/bg.webp?v=1) center / cover no-repeat; }
.bb-bg::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 35%, rgba(12, 4, 5, .25), rgba(12, 4, 5, .82) 75%); }
body.bb .page { position: relative; z-index: 1; }
body.bb header h1 { color: #f5d27a; text-shadow: 0 2px 0 #4a1a05, 0 0 18px rgba(245, 180, 80, .35); font-weight: 900; }
body.bb .icon { background: rgba(20, 6, 8, .7); border: 1px solid rgba(232, 192, 99, .35); color: #f5d27a; }
body.bb .panel, body.bb .side-list, body.bb .mode-nav { background: linear-gradient(160deg, rgba(48, 10, 14, .88), rgba(14, 6, 8, .92)); border: 1px solid rgba(232, 192, 99, .32); box-shadow: 0 16px 40px rgba(0, 0, 0, .55), inset 0 1px rgba(255, 220, 150, .12); }
body.bb .eyebrow { color: #e8c063; letter-spacing: 0; }
body.bb .panel h2 { color: #fff4dc; }
body.bb .panel p { color: #d9bfa8; }
body.bb .mode-nav button { background: rgba(255, 255, 255, .04); border: 1px solid rgba(232, 192, 99, .22); color: #fff4dc; }
body.bb .mode { background: linear-gradient(160deg, rgba(120, 20, 28, .55), rgba(30, 8, 10, .8)); border: 1px solid rgba(232, 192, 99, .3); }
body.bb .mode b { color: #f5d27a; }
body.bb .bullet-mark { width: 120px; height: 120px; border: 0; background: url(/assets/bullet/cylinder.webp?v=1) center / contain no-repeat; box-shadow: none; filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .6)); animation: bb-idle 9s linear infinite; }
body.bb .bullet-mark i { display: none; }
@keyframes bb-idle { to { transform: rotate(360deg); } }
body.bb .primary { background: linear-gradient(#f5d27a, #b8802a); color: #2a1200; box-shadow: 0 5px 0 #6b4510, 0 10px 24px rgba(0, 0, 0, .45); border: 0; font-weight: 900; }
body.bb .primary:disabled { filter: grayscale(.6) brightness(.7); }
body.bb .secondary { background: rgba(232, 192, 99, .14); border: 1px solid rgba(232, 192, 99, .45); color: #f5d27a; }
body.bb input { background: rgba(0, 0, 0, .45); border: 1px solid rgba(232, 192, 99, .35); color: #fff4dc; }
body.bb #nameForm button, body.bb .arena-add button, body.bb #joinForm button { background: linear-gradient(#c8222e, #7a0c14); color: #fff; border: 0; }
body.bb .chip { background: rgba(163, 21, 31, .35); border: 1px solid rgba(232, 192, 99, .3); color: #fff4dc; }
body.bb .lives-picker { background: rgba(0, 0, 0, .35); border: 1px solid rgba(232, 192, 99, .2); }
body.bb .lives-picker b { color: #ff6b6b; }
body.bb .person .avatar { background: linear-gradient(#c8222e, #5e0a10); color: #fff; border: 1px solid #e8c063; }
body.bb .life-dots { color: #ff4d5e; }
body.bb .person.dead { filter: grayscale(1); opacity: .55; }
/* the wheel */
body.bb .ambient-orbit, body.bb .wheel-halo { display: none; }
body.bb #wheel { filter: drop-shadow(0 18px 30px rgba(0, 0, 0, .7)); }
body.bb .pointer { width: 30px; height: 74px; top: -24px; background: url(/assets/bullet/bullet.webp?v=1) center / contain no-repeat; transform: translateX(-50%) rotate(180deg); border: 0; box-shadow: none; filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .7)); }
body.bb .pointer i, body.bb .pointer span { display: none; }
body.bb .spin-center { width: 128px; height: 128px; border-radius: 50%; border: 0; background: url(/assets/bullet/cylinder.webp?v=1) center / cover no-repeat; box-shadow: 0 0 0 4px #e8c063, 0 10px 26px rgba(0, 0, 0, .65); color: #fff4dc; text-shadow: 0 2px 4px #000, 0 0 10px #000; }
body.bb .spin-center b { display: none; }
body.bb .spin-center span { font-size: 22px; font-weight: 900; background: rgba(20, 4, 6, .62); border-radius: 10px; padding: 0 8px; }
body.bb .spin-center small { font-size: 12px; background: rgba(20, 4, 6, .62); border-radius: 8px; padding: 0 6px; margin-top: 2px; }
body.bb .spin-center:not(:disabled) { animation: bb-ready 1.6s ease-in-out infinite; }
@keyframes bb-ready { 50% { box-shadow: 0 0 0 4px #e8c063, 0 0 26px 6px rgba(245, 180, 80, .55), 0 10px 26px rgba(0, 0, 0, .65); } }
body.bb.bb-spinning .spin-center { animation: bb-cyl 4.9s cubic-bezier(.15, .8, .25, 1); }
@keyframes bb-cyl { to { transform: rotate(-1440deg); } }
body.bb .status { color: #f5d27a; font-weight: 800; }
/* hit: red flash + shake */
body.bb.bb-hit .page { animation: bb-shake .45s; }
body.bb.bb-hit .bb-bg::before { content: ""; position: absolute; inset: 0; z-index: 1; background: radial-gradient(circle, rgba(255, 60, 60, .55), rgba(120, 0, 0, .2)); animation: bb-flash .6s forwards; }
@keyframes bb-shake { 15% { transform: translate(-7px, 3px); } 30% { transform: translate(6px, -4px); } 45% { transform: translate(-4px, 2px); } 60% { transform: translate(3px, -1px); } }
@keyframes bb-flash { to { opacity: 0; } }
body.bb .result-card, body.bb .kafala-card, body.bb .winner-card { background: linear-gradient(160deg, #3b0a10, #120507); border: 1px solid rgba(232, 192, 99, .45); box-shadow: 0 24px 60px rgba(0, 0, 0, .7); }
body.bb #resultName, body.bb #winnerName, body.bb #kafalaName { color: #f5d27a; }
body.bb .winner-card > span:first-child { display: block; width: 130px; height: 110px; margin: 0 auto; font-size: 0; background: url(/assets/bullet/crown.webp?v=1) center / contain no-repeat; filter: drop-shadow(0 8px 16px rgba(245, 180, 80, .5)); }