.phone-fullscreen-page {
  --phone-fullscreen-top: calc(56px + env(safe-area-inset-top, 0px));
}
.phone-fullscreen-button {
  position: fixed;
  z-index: 100;
  top: calc(4px + env(safe-area-inset-top, 0px));
  right: calc(6px + env(safe-area-inset-right, 0px));
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  min-height: 44px;
  margin: 0;
  padding: 10px;
  border: 0;
  border-radius: 8px;
  color: #ddd7d2;
  background: #160707dd;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.phone-fullscreen-button svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.phone-fullscreen-button[hidden], .phone-fullscreen-button .phone-fullscreen-exit { display: none; }
.phone-fullscreen-button[aria-pressed="true"] .phone-fullscreen-enter { display: none; }
.phone-fullscreen-button[aria-pressed="true"] .phone-fullscreen-exit { display: initial; }
.phone-fullscreen-button:focus-visible { outline: 2px solid #c8ff2f; outline-offset: 2px; }
@media (hover: hover) { .phone-fullscreen-button:hover { color: #c8ff2f; background: #293021; } }
.phone-fullscreen-page:has(.participant-live-view[data-theme="light"]) .phone-fullscreen-button { color: #333; background: #f7f7f4ee; }
/* Reserve the corner even on small entry/pairing screens and activity views. */
.phone-fullscreen-page > main:has(> nav),
.phone-fullscreen-page > .phone-shell { padding-top: var(--phone-fullscreen-top); }
.phone-fullscreen-page > .participant-live-view { padding-block-start: var(--phone-fullscreen-top); }
.phone-fullscreen-page > .connection-status,
.phone-fullscreen-page > .rejoin-session { padding-inline-end: calc(60px + env(safe-area-inset-right, 0px)); }
.phone-fullscreen-page > .connection-status[data-manual="true"] { padding-block-start: var(--phone-fullscreen-top); }
.phone-fullscreen-page .participant-live-static,
.phone-fullscreen-page .participant-live-question,
.phone-fullscreen-page .participant-live-answer-hunt {
  min-height: calc(100dvh - var(--phone-fullscreen-top) - var(--participant-live-edge) - env(safe-area-inset-bottom, 0px));
}
.phone-fullscreen-help {
  box-sizing: border-box;
  width: min(28rem, calc(100% - 32px));
  max-height: calc(100dvh - 32px);
  overflow: auto;
  padding: 24px;
  border: 1px solid #756b64;
  border-radius: 12px;
  color: #fff7e9;
  background: #160707;
  font: 17px/1.5 Aptos, "Segoe UI", sans-serif;
}
.phone-fullscreen-help::backdrop { background: #0009; }
.phone-fullscreen-help h2 { margin: 0 0 16px; font-size: 1.25rem; }
.phone-fullscreen-help p { margin: 0 0 16px; }
.phone-fullscreen-help [hidden] { display: none; }
.phone-fullscreen-help button { min-height: 44px; padding: 8px 20px; border: 1px solid #756b64; border-radius: 8px; color: inherit; background: #293021; font: inherit; cursor: pointer; }
.phone-fullscreen-help button:focus-visible { outline: 2px solid #c8ff2f; outline-offset: 2px; }
