/* 🤖 Battle Bots Playground (the Boss's idea, 2026-11-03 night): red vs blue practice fights, 3 lives, the bench cheers */
.bb-h{margin:6px 0 4px;text-align:center;font-size:clamp(1.6rem,4.2vw,2.6rem);letter-spacing:1px;color:#ff6b7a;text-shadow:0 0 14px rgba(255,59,79,.6)}
.bb-h span{color:#7cc4ff;text-shadow:0 0 14px rgba(47,168,255,.6)}
.bb-lead{max-width:760px;margin:0 auto 12px;text-align:center;line-height:1.5;color:#e4dcff}
.bb .red{color:#ff6b7a}.bb .blue{color:#7cc4ff}
.bb-wrap{position:relative;width:100%;max-width:1100px;margin:0 auto;border-radius:16px;overflow:hidden;box-shadow:0 0 0 2px #3b1d6e,0 0 34px rgba(155,92,255,.4)}
#yard{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#0b0620;touch-action:manipulation;cursor:pointer}
.bb-pick{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:12px;
  background:radial-gradient(ellipse at center,rgba(20,8,48,.82),rgba(7,4,15,.94));text-align:center}
.bb-pick[hidden]{display:none}
.bb-pick h2{margin:0;font-size:clamp(1.1rem,3vw,2rem);color:#ffd23f;text-shadow:0 0 12px rgba(255,210,63,.6)}
.bb-pick p{margin:0;color:#d8ccff;font-size:clamp(.8rem,1.8vw,1rem)}
.bb-plays{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:900px}
.bb-play{font:inherit;cursor:pointer;min-width:118px;padding:8px 10px;border-radius:12px;border:2px solid #ff3b4f;color:#fff;
  background:linear-gradient(180deg,#3a0a18,#1c0610);box-shadow:0 0 10px rgba(255,59,79,.35);transition:transform .15s ease,box-shadow .15s ease}
.bb-play b{display:block;font-size:clamp(.9rem,2vw,1.1rem)}
.bb-play small{display:block;color:#ffb3bc;font-size:.75rem}
.bb-play:hover,.bb-play:focus-visible{transform:translateY(-3px) scale(1.04);box-shadow:0 0 18px rgba(255,59,79,.7);outline:none}
.bb-play:active{transform:scale(.97)}
.bb-drive{color:#cfe8ff;font-size:clamp(.72rem,1.6vw,.9rem);cursor:pointer}
.bb-drive input{accent-color:#ff3b4f;width:1.1em;height:1.1em;vertical-align:-2px}
.bb-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;max-width:1100px;margin:10px auto 0}
.bb-score{font-weight:900;font-size:1.15rem;display:flex;gap:14px;align-items:center}
.bb-score b{font-size:1.5rem}
.bb-round{color:#ffd23f;font-size:.95rem;border:1px solid #6b4bb0;border-radius:999px;padding:2px 10px}
.bb-btns{display:flex;gap:8px}
.bb-btn{font:inherit;cursor:pointer;color:#e8d5ff;background:#1b1036;border:2px solid #6b4bb0;border-radius:10px;padding:6px 12px}
.bb-btn:hover,.bb-btn:focus-visible{border-color:#d8b4fe;outline:none}
.bb-call{max-width:1100px;margin:8px auto 0;min-height:1.5em;text-align:center;color:#ffd23f;font-weight:700}
.bb-how{max-width:760px;margin:22px auto 0;line-height:1.55;color:#ddd3ff}
.bb-how h2{color:#d8b4fe;font-size:1.3rem}
.bb-how li{margin:4px 0}
.bb-small{font-size:.9rem;color:#b9acdf}
.bb-small a{color:#7cc4ff}
@media (max-width:600px){.bb-play{min-width:92px;padding:6px 8px}.bb-play small{display:none}.bb-score{font-size:1rem}}
.bb-trophy{width:min(320px,60%);border-radius:12px;box-shadow:0 0 24px rgba(255,210,63,.5)}
/* phones: the yard is too short for the play cards, so they sit under it */
@media (max-width:760px){.bb-pick{position:static;background:#120a2c;border-top:2px solid #3b1d6e;padding:12px 8px}.bb-trophy{width:min(260px,80%)}}
.bb-turn{display:none;margin:8px 0 0;text-align:center;color:#cfe8ff;font-size:.9rem}
@media (max-width:600px) and (orientation:portrait){.bb-turn{display:block}}
/* 🧠 the grown-ups' plan box */
.bb-brain{display:flex;flex-direction:column;align-items:center;gap:8px;width:min(640px,100%)}
.bb-brain textarea{width:100%;font:inherit;font-size:1rem;color:#fff;background:#140b2c;border:2px solid #6b4bb0;border-radius:12px;padding:10px;resize:vertical}
.bb-brain textarea:focus{outline:none;border-color:#ff6b7a;box-shadow:0 0 12px rgba(255,59,79,.5)}
/* ⛶ full screen: the yard as big as the screen allows, the play cards over it */
.bb-wrap:fullscreen{max-width:none;width:100vw;height:100vh;border-radius:0;display:flex;align-items:center;justify-content:center;background:#07040f}
.bb-wrap:fullscreen #yard{width:min(100vw,177.78vh);height:auto}
.bb-wrap:fullscreen .bb-pick{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(20,8,48,.82),rgba(7,4,15,.94))}
.bb-exit{display:none}
.bb-wrap:fullscreen .bb-exit{display:grid;place-items:center;position:absolute;top:10px;right:10px;z-index:3;width:44px;height:44px;border-radius:50%;
  font:inherit;font-size:1.3rem;color:#fff;background:rgba(20,10,40,.85);border:2px solid #d8b4fe;cursor:pointer}