.od1-grid-page { padding: 0; overflow: hidden; background: #030507; touch-action: none; }
#od1-signal-grid { position: absolute; inset: 0; overflow: hidden; }
#od1-signal-grid canvas { position: absolute; inset: 0; display: block; width: max(var(--od1-game-viewport-width, 100vw), calc(var(--od1-game-viewport-height, 100vh) * .5)) !important; height: max(var(--od1-game-viewport-height, 100vh), calc(var(--od1-game-viewport-width, 100vw) * 2)) !important; margin: auto; touch-action: none; }
.od1-grid-page .od1-game-exit { position: fixed; z-index: 20; }
.od1-grid-overlay,
.od1-grid-help { position: absolute; z-index: 12; inset: 0; display: grid; padding: max(70px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(32px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left)); align-content: center; justify-items: center; box-sizing: border-box; color: #fff; text-align: center; background: rgba(3,5,7,.7); backdrop-filter: blur(12px); }
.od1-grid-overlay[hidden], .od1-grid-help[hidden] { display: none; }
.od1-grid-overlay h1, .od1-grid-overlay h2 { max-width: 500px; margin: 0; font-size: clamp(3rem, 12vw, 5.8rem); letter-spacing: -.08em; line-height: .85; }
.od1-grid-overlay > p:not(.od1-game-eyebrow) { max-width: 390px; margin: 18px 0 0; color: rgba(255,255,255,.68); line-height: 1.45; }
.od1-grid-actions { display: flex; margin-top: 26px; gap: 10px; }
.od1-grid-actions button, .od1-grid-actions a, .od1-grid-help__panel > button:last-child { display: inline-grid; min-width: 132px; min-height: 46px; padding: 0 20px; place-items: center; border: 1px solid var(--od1-game-accent); border-radius: 999px; color: #050607; background: var(--od1-game-accent); font: inherit; font-weight: 900; text-decoration: none; cursor: pointer; }
.od1-grid-actions .od1-grid-secondary { border-color: rgba(255,255,255,.24); color: #fff; background: rgba(255,255,255,.06); }
.od1-grid-help { z-index: 14; background: rgba(2,3,5,.82); }
.od1-grid-help__panel { position: relative; width: min(100%, 420px); padding: 26px; border: 1px solid rgba(255,255,255,.16); border-radius: 24px; text-align: left; background: #101219; box-shadow: 0 24px 90px rgba(0,0,0,.62); }
.od1-grid-help__panel h2 { margin: 0; font-size: 2.2rem; letter-spacing: -.055em; }
.od1-grid-help__panel ul { display: grid; margin: 20px 0; padding: 0; gap: 11px; list-style: none; }
.od1-grid-help__panel li { padding: 11px 12px; border: 1px solid rgba(255,255,255,.09); border-radius: 12px; color: rgba(255,255,255,.68); font-size: .82rem; line-height: 1.35; background: rgba(255,255,255,.03); }
.od1-grid-help__panel li strong { color: var(--od1-game-accent); }
.od1-grid-help__close { position: absolute; top: 10px; right: 10px; width: 38px; height: 38px; padding: 0; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; color: #fff; background: rgba(255,255,255,.05); font-size: 1.35rem; }
@media (min-width: 700px) {
  #od1-signal-grid canvas { width: min(50vw, 500px) !important; height: min(100vh, 1000px) !important; box-shadow: 0 0 90px rgba(0,0,0,.72); }
}
.od1-live-wire-page #od1-signal-grid canvas { width: max(var(--od1-game-viewport-width, 100vw), calc(var(--od1-game-viewport-height, 100vh) * 1.7778)) !important; height: max(var(--od1-game-viewport-height, 100vh), calc(var(--od1-game-viewport-width, 100vw) * .5625)) !important; box-shadow: none; }
@media (max-height: 700px) {
  .od1-grid-overlay { padding-block: 54px 16px; }
  .od1-grid-overlay h1, .od1-grid-overlay h2 { font-size: 2.8rem; }
  .od1-grid-overlay > p:not(.od1-game-eyebrow) { margin-top: 10px; font-size: .78rem; }
  .od1-grid-actions { margin-top: 15px; }
  .od1-grid-help__panel { padding: 18px; }
  .od1-grid-help__panel ul { margin: 12px 0; gap: 6px; }
  .od1-grid-help__panel li { padding: 7px 9px; font-size: .7rem; }
}