/* Physical viewport HTML surface, also available when WebGL cannot start. */
#sb-graphics-advisory[hidden], #sb-graphics-help[hidden], #sb-graphics-how[hidden] { display: none; }
#sb-graphics-advisory {
  position: fixed; inset: 0; z-index: 100000; box-sizing: border-box;
  display: flex; align-items: center; justify-content: center; padding: 24px;
  background: rgba(0, 2, 6, .91); color: #bfccd9;
  font: 400 16px/1.5 var(--sb-font-ui); text-align: left;
}
#sb-graphics-panel {
  box-sizing: border-box; width: min(600px, 100%); max-height: calc(100dvh - 48px);
  overflow-y: auto; padding: 30px 34px; border: 1px solid rgba(126, 214, 235, .3);
  border-top: 2px solid #67c9df; border-radius: 0;
  background: linear-gradient(180deg, #080e17, #03060b);
}
.sb-graphics-label { color: #67c9df; font-size: 12px; letter-spacing: .2em; margin: 0 0 14px; }
#sb-graphics-title { color: #f4fcff; font: 400 22px/1.3 var(--sb-font-display); margin: 0 0 18px; }
#sb-graphics-copy { margin: 0 0 14px; }
#sb-graphics-prompt { color: #dcebf2; margin: 0 0 20px; }
#sb-graphics-help { border-top: 1px solid #243945; padding-top: 16px; margin-bottom: 20px; font-size: 15px; }
#sb-graphics-help h3 { font-size: 12px; font-weight: 600; letter-spacing: .14em; color: #67c9df; margin: 0; }
#sb-graphics-help ol { padding-left: 20px; margin: 12px 0; }
#sb-graphics-help li { margin-bottom: 8px; }
#sb-graphics-help p { color: #98adbc; margin: 0; }
#sb-graphics-actions { display: flex; justify-content: flex-end; gap: 16px; flex-wrap: wrap; }
#sb-graphics-actions .sbhs-btn { border: 1px solid #38505f; min-height: 42px; padding: 10px 14px; }
#sb-graphics-actions .sbhs-btn:hover, #sb-graphics-actions .sbhs-btn:focus-visible,
#sb-graphics-actions .sb-menu-selected { color: #f4fcff; background: #132a36; border-color: #67c9df; }
#sb-graphics-actions .sbhs-btn:focus-visible { outline: 2px solid #b6efff; outline-offset: 3px; }
@media (max-height: 650px), (max-width: 640px) {
  #sb-graphics-advisory { padding: 16px; font-size: 15px; }
  #sb-graphics-panel { padding: 20px 24px; max-height: calc(100dvh - 32px); }
  #sb-graphics-title { font-size: 20px; }
  #sb-graphics-help { font-size: 14px; }
}