/* ============================================================
   Apogee shared onboarding / "How to Play" — animated concept
   scenes on a canvas. Self-injected by onboarding.js into every
   game. Theme via --ob-accent (set per game by the script).
   ============================================================ */
.ob-help{
  position:fixed;z-index:9998;right:12px;bottom:14px;width:42px;height:42px;border-radius:50%;
  border:1px solid #ffffff33;background:#0d1124cc;color:#fff;font-size:20px;font-weight:800;
  cursor:pointer;backdrop-filter:blur(6px);box-shadow:0 4px 18px #0008;display:flex;align-items:center;justify-content:center}
.ob-help:active{transform:scale(.94)}

.ob-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;
  background:#03040ad9;backdrop-filter:blur(4px);font-family:-apple-system,Inter,system-ui,sans-serif}
.ob-modal.on{display:flex;animation:obFade .22s ease}
.ob-sheet{width:min(92vw,440px);max-height:92dvh;overflow:hidden;border-radius:20px;
  background:linear-gradient(180deg,#10142e,#080b18);border:1px solid #2b3768;box-shadow:0 24px 80px #000d;
  animation:obRise .3s ease}
.ob-canvas{width:100%;height:228px;display:block;background:#070a18}
.ob-body{padding:16px 18px 18px}
.ob-title{margin:0 0 4px;font-size:20px;font-weight:900;letter-spacing:.4px;
  background:linear-gradient(90deg,var(--ob-accent,#39e6ff),#7c5cff);-webkit-background-clip:text;background-clip:text;color:transparent}
.ob-text{margin:0;min-height:44px;color:#c7cbe6;font-size:14px;line-height:1.5}
.ob-dots{display:flex;gap:6px;justify-content:center;margin:14px 0 12px}
.ob-dots i{width:7px;height:7px;border-radius:50%;background:#2b3768;transition:.2s}
.ob-dots i.on{background:var(--ob-accent,#39e6ff);width:18px;border-radius:4px}
.ob-nav{display:flex;gap:8px}
.ob-nav button{flex:1;padding:12px;border-radius:12px;border:1px solid #2b3768;background:#0c1024;color:#eef1ff;font-weight:800;cursor:pointer;font-size:15px}
.ob-nav button.ob-primary{border:0;color:#fff;background:linear-gradient(90deg,#7c5cff,var(--ob-accent,#39e6ff));box-shadow:0 6px 22px #7c5cff55}
.ob-skip{display:block;width:100%;margin-top:9px;background:none;border:0;color:#6a72a0;font-size:12px;cursor:pointer}
@keyframes obFade{from{opacity:0}to{opacity:1}}
@keyframes obRise{from{transform:translateY(14px) scale(.97);opacity:0}to{transform:none;opacity:1}}

/* shared prominent error overlay (all games) */
.obx-err{position:fixed;inset:0;z-index:10000;display:none;align-items:center;justify-content:center;
  background:#03040ad9;backdrop-filter:blur(4px);padding:22px;font-family:-apple-system,Inter,system-ui,sans-serif}
.obx-err.on{display:flex;animation:obFade .2s ease}
.obx-card{width:min(92vw,420px);text-align:center;padding:30px 26px;border-radius:20px;
  background:linear-gradient(180deg,#241019,#120a14);border:1px solid #ff5470;
  box-shadow:0 0 60px #ff547066,0 20px 70px #000c;animation:obRise .3s ease}
.obx-ic{font-size:54px;line-height:1;margin-bottom:8px}
.obx-tt{margin:0 0 12px;font-size:25px;font-weight:900;letter-spacing:.3px;color:#ff6b81}
.obx-ms{margin:0 0 10px;font-size:16px;line-height:1.5;color:#f2e4e8;font-weight:600}
.obx-cd{margin:0 0 20px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;color:#8b93c0;word-break:break-all}
.obx-bt{width:100%;padding:15px;border:0;border-radius:13px;color:#fff;font-weight:800;font-size:16px;cursor:pointer;
  background:linear-gradient(90deg,#ff5470,#ff8a3c);box-shadow:0 6px 22px #ff547066}
.obx-bt:active{transform:translateY(1px)}