/* Phone-only presentation. All sizes are web_candidate, not game-native units. */
.answer-paper-viewport.phone-game-layout {
  position: fixed; inset: auto;
  left: var(--phone-x, 0px); top: var(--phone-y, 0px);
  width: var(--phone-width, 100vw); height: var(--phone-height, 100svh);
  box-sizing: border-box; display: grid;
  grid-template-rows: minmax(0, 1fr) auto; grid-template-columns: minmax(0, 1fr);
  gap: calc(6px + 4px * var(--phone-room, 1)); padding: max(64px, calc(env(safe-area-inset-top) + 56px)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
  overflow: hidden; pointer-events: none;
}
.phone-card-slot { min-width: 0; min-height: 0; pointer-events: none; }
.phone-game-layout .answer-paper-root {
  position: relative; inset: auto; transform: none; margin: 0;
  width: min(100%, 420px); max-width: none; min-height: 0;
  /* Keep an observation area even above a tall keyboard; only the paper may scroll. */
  max-height: min(350px, calc(var(--phone-height) * .53), max(90px, calc(var(--phone-height) - 214px)));
  align-self: end; justify-self: center; overflow: auto; overscroll-behavior: contain;
  pointer-events: auto; --answer-rest-opacity: 1;
}
.phone-game-layout .answer-paper-content { padding: calc(12px + 6px * var(--phone-room, 1)) calc(20px + 2px * var(--phone-room, 1)) calc(12px + 5px * var(--phone-room, 1)); }
.phone-game-layout .answer-paper-title { font-size: calc(24px * var(--phone-room, 1)); line-height: 1.35; text-align: left; margin: 0 0 calc(8px * var(--phone-room, 1)); max-height: calc(33px * var(--phone-room, 1)); overflow: hidden; opacity: var(--phone-room, 1); }
.phone-game-layout .answer-stage { position: absolute; right: 22px; bottom: calc(12px + 5px * var(--phone-room, 1)); top: auto; font-size: 11px; margin: 0; }
.phone-game-layout .answer-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: calc(4px + 2px * var(--phone-room, 1)) calc(8px + 2px * var(--phone-room, 1)); }
.phone-game-layout :is(.answer-label, .answer-search-wrap, .answer-hint, .answer-feedback, .answer-action-note) { grid-column: 1 / -1; }
.phone-game-layout .answer-label { font-size: calc(13px * var(--phone-room, 1)); margin: 0; max-height: calc(20px * var(--phone-room, 1)); overflow: hidden; opacity: var(--phone-room, 1); }
.phone-game-layout .answer-search { height: 44px; font-size: 16px; }
.phone-game-layout .answer-hint { margin: 0; font-size: calc(12px * var(--phone-room, 1)); max-height: calc(20px * var(--phone-room, 1)); overflow: hidden; opacity: var(--phone-room, 1); }
.phone-game-layout .answer-feedback { min-height: 0; margin: 0; font-size: 13px; }
.phone-game-layout .answer-feedback:empty { display: none; }
.phone-game-layout .answer-options { position: relative; inset: auto; margin-top: 6px; max-height: calc(48px + 40px * var(--phone-room, 1)); box-shadow: none; }
.phone-game-layout .answer-option { min-height: 44px; font-size: 15px; }
.phone-game-layout .answer-turn-button { width: 100%; min-height: calc(46px + 8px * var(--phone-room, 1)); margin: 0; font-size: calc(16px + 2px * var(--phone-room, 1)); }
.phone-game-layout .answer-turn-button.answer-clarify { margin: 0; font-size: calc(16px + 2px * var(--phone-room, 1)); }
.phone-game-layout .answer-turn-visual { inset: 0; width: 100%; margin: 0; }
.phone-game-layout .answer-turn-label { max-width: 90%; }
.phone-game-layout .answer-turn-button[data-shiny=true]:not(:disabled) .answer-turn-pulse { animation: none; opacity: 0; }
.phone-game-layout .answer-action-note { font-size: calc(10px + 1px * var(--phone-room, 1)); margin: 0; padding-right: 48px; text-align: left; }
.phone-game-layout :is(.answer-result, .answer-error) { padding-top: 4px; }
.phone-game-layout .answer-reveal-name { margin: 7px 0 14px; font-size: 23px; }
.phone-game-layout .answer-error-message { margin: 8px 0 14px; font-size: 16px; }
.phone-game-layout[data-side=true] { grid-template-columns: minmax(0, 1fr) minmax(260px, .95fr); grid-template-rows: minmax(0, 1fr); gap: 20px; }
.phone-game-layout[data-side=true] .answer-paper-root { max-height: 100%; align-self: center; }
html[data-pixel-phone=true] .paper-menu-root .scene-menu-button { top: calc(var(--phone-y, 0px) + max(10px, env(safe-area-inset-top))); left: calc(var(--phone-x, 0px) + max(12px, env(safe-area-inset-left))); min-height: 44px; font-size: 15px; padding: 7px 12px; }
html[data-pixel-phone=true] .scene-menu-button kbd { display: none; }
html[data-pixel-phone=true] .tb-global-settings:not(.tb-global-settings-inline) .tb-settings-entry { top: calc(var(--phone-y, 0px) + max(10px, env(safe-area-inset-top))); right: max(12px, env(safe-area-inset-right)); font-size: 15px; }