[hidden] { display: none !important; }
#woa-clear-game-cache {
  position: absolute; z-index: 35; left: max(8px, env(safe-area-inset-left));
  bottom: max(8px, env(safe-area-inset-bottom)); min-height: 36px; padding: 5px 10px;
  border: 1px solid #ab8350; border-radius: 10px; background: #f7f0dce8;
  color: #543b2e; font: 12px system-ui, sans-serif; cursor: pointer; touch-action: manipulation;
}
#woa-clear-game-cache:focus-visible, #woa-cache-recovery button:focus-visible { outline: 3px solid #397c93; outline-offset: 3px; }
#woa-cache-recovery {
  position: absolute; inset: 0; z-index: 40; display: flex; align-items: center; justify-content: center;
  background: #172425; padding: 16px; box-sizing: border-box; overflow: auto;
  color: #543b2e; font: 15px/1.6 system-ui, sans-serif;
}
#woa-cache-recovery h1 { font-size: 22px; }
#woa-cache-recovery button { min-height: 42px; margin: 6px; padding: 8px 14px; border: 1px solid #ab8350; border-radius: 9px; background: #fffaf0; color: #543b2e; font: inherit; cursor: pointer; }
#woa-start-gate {
  position: absolute; inset: 0; z-index: 30; overflow: auto;
  box-sizing: border-box; display: flex; align-items: center; justify-content: center;
  min-height: 100%; padding: max(18px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
  background: radial-gradient(ellipse at 50% 25%, #314241 0, #172425 42%, #0c1519 100%);
  color: #543b2e; font-family: system-ui, "Noto Sans Thai Looped", "Noto Sans Thai", sans-serif;
}
.woa-gate-card {
  box-sizing: border-box; width: min(100%, 440px); padding: 25px 22px 20px;
  border: 1px solid #ab8350; border-radius: 22px; text-align: center;
  background: #f7f0dc; outline: 1px solid #e8cf98; outline-offset: -8px;
}
.woa-brand { margin: 0 0 10px; color: #88642d; font-weight: 700; letter-spacing: .16em; font-size: 13px; }
.woa-phone { font-family: sans-serif; font-size: 42px; color: #977036; line-height: 1; margin: 12px 0; }
#woa-gate-title { margin: 10px 0; font-size: clamp(21px, 5vw, 27px); font-weight: 600; }
#woa-gate-intro { margin: 0 0 22px; line-height: 1.6; font-size: 15px; }
#woa-start-gate button, #woa-mobile-fullscreen {
  box-sizing: border-box; min-height: 48px; border: 1px solid #ac7b3b; border-radius: 12px;
  font: inherit; cursor: pointer; touch-action: manipulation; color: #543b2e;
}
#woa-start-button { width: 100%; padding: 13px 12px; font-size: 16px; font-weight: 600; background: #efcf85; }
#woa-start-gate button:focus-visible, #woa-mobile-fullscreen:focus-visible { outline: 3px solid #397c93; outline-offset: 3px; }
#woa-start-gate button:disabled { opacity: .65; cursor: wait; }
#woa-start-gate .woa-secondary { width: 100%; padding: 10px; background: #fffaf0; font-size: 14px; }
#woa-gate-status { font-size: 14px; line-height: 1.6; margin: 13px 0; min-height: 24px; }
.woa-gate-note { color: #7c6a53; font-size: 12px; line-height: 1.7; margin: 14px 0 0; }
#woa-mobile-fullscreen { position: absolute; z-index: 20; top: max(8px, env(safe-area-inset-top)); right: max(8px, env(safe-area-inset-right)); padding: 5px 12px; min-height: 38px; background: #f7efdde8; font: 13px system-ui, sans-serif; }
#unity-fullscreen-container:fullscreen, #unity-fullscreen-container:-webkit-full-screen { width: 100% !important; height: 100% !important; background: #111b20; }
/* The mobile fullscreen root includes body-level inputs created by Unity. */
html#woa-fullscreen-root:fullscreen, html#woa-fullscreen-root:-webkit-full-screen { width: 100%; height: 100%; margin: 0; background: #111b20; }
html#woa-fullscreen-root:fullscreen body, html#woa-fullscreen-root:-webkit-full-screen body { width: 100%; min-height: 100%; margin: 0; }
.unity-mobile #unity-fullscreen-container { height: 100%; height: 100dvh; }
.unity-mobile #unity-canvas { touch-action: none; }
@media (max-height: 480px) and (orientation: landscape) {
  #woa-start-gate { align-items: flex-start; padding: 12px max(18px, env(safe-area-inset-right)) 12px max(18px, env(safe-area-inset-left)); }
  .woa-gate-card { width: min(100%, 540px); padding: 17px 24px 14px; }
  .woa-phone { display: none; }
  .woa-brand { margin-bottom: 5px; }
  #woa-gate-title { margin: 5px 0; font-size: 22px; }
  #woa-gate-intro { margin-bottom: 10px; }
  #woa-gate-status { margin: 6px 0; min-height: 0; }
  .woa-gate-note { margin-top: 7px; }
}