/* Full-screen control shares the host site's colors and stays in its navigation. */
.gt-screen-controls { display: inline-flex; align-items: center; flex-shrink: 0; }
body .gt-screen-button,
body .portal .gt-screen-button {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 44px; height: auto; padding: 10px 12px; border: 1px solid currentColor;
  border-radius: 6px; background: transparent; color: inherit;
  font: 600 .875rem/1.3 Arial, Helvetica, sans-serif; white-space: normal; text-align: center;
  cursor: pointer; text-decoration: none; max-width: 100%;
}
.gt-screen-button svg { width: 18px; height: 18px; flex-shrink: 0; }
.gt-screen-button:focus-visible { outline: 3px solid #b68de7; outline-offset: 3px; }
body .gt-screen-dialog {
  box-sizing: border-box; width: min(36rem, calc(100% - 2rem));
  max-width: calc(100% - 2rem); max-height: calc(100dvh - 2rem - env(safe-area-inset-top) - env(safe-area-inset-bottom));
  overflow: auto; overscroll-behavior: contain; padding: 28px;
  border: 1px solid #d0b7f0; border-radius: 16px; background: #ffffff; color: #2e1150;
  font: 1rem/1.65 Arial, Helvetica, sans-serif; text-align: left;
}
dialog.gt-screen-dialog { margin: auto; }
.gt-screen-dialog::backdrop { background: #1d0b34b3; }
.gt-screen-dialog h2, .gt-screen-dialog [data-slot=dialog-title] { font-size: 1.5rem; line-height: 1.3; margin: 0 24px 12px 0; }
.gt-screen-dialog p { margin: 12px 0; font-size: 1rem; color: #5e23a6; }
.gt-screen-dialog [data-slot=dialog-close] { min-width: 44px; min-height: 44px; display: grid; place-items: center; }
html:fullscreen { width: 100%; height: 100%; overflow: auto; }
html:-webkit-full-screen { width: 100%; height: 100%; overflow: auto; }
@media (max-width: 600px) {
  body .gt-screen-dialog { padding: 24px 18px; }
}