/* Shared presentation and accessibility guardrails for every Aurora room. */
:root{
  color-scheme:light;
  --aurora-focus:#f0c969;
}

*,
*::before,
*::after{
  box-sizing:border-box;
}

html{
  min-width:0;
  overflow-x:hidden;
  scroll-behavior:smooth;
}

body{
  min-width:0;
  word-break:normal;
  overflow-wrap:normal;
  hyphens:none;
}

img,
svg,
video,
canvas{
  max-width:100%;
}

img:not([src]),
img[src=""]{
  visibility:hidden;
}

button,
input,
select,
textarea,
[tabindex]{
  min-width:0;
  max-width:100%;
  font:inherit;
}

button,
a,
label,
h1,
h2,
h3,
h4,
p,
span{
  word-break:normal;
  overflow-wrap:normal;
  hyphens:none;
}

button{
  white-space:normal;
}

/* The app-level beta doorway belongs after the app, not over its controls. */
.aurora-room-beta{
  position:relative!important;
  inset:auto!important;
  display:block!important;
  width:max-content!important;
  max-width:calc(100% - 24px)!important;
  margin:18px auto 12px!important;
  text-align:center!important;
  white-space:normal!important;
}

/* Aurora's viewer already supplies the shared beta doorway outside the iframe. */
html.aurora-embedded .aurora-room-beta{
  display:none!important;
}

/* Language direction follows the shared Aurora/Khaemenes preference. */
html[dir="rtl"] body{
  direction:rtl;
}

html[dir="rtl"] input:not([type="range"]),
html[dir="rtl"] textarea,
html[dir="rtl"] select{
  text-align:right;
}

:where(button,a,input,select,textarea,[tabindex]):focus-visible{
  outline:3px solid var(--aurora-focus);
  outline-offset:3px;
}

.aurora-room-runtime-status{
  position:fixed;
  inset:auto 12px 12px 12px;
  z-index:2147483001;
  margin:0 auto;
  width:min(680px,calc(100% - 24px));
  padding:10px 14px;
  border:1px solid #e2b4aa;
  border-radius:7px;
  background:#2c2020;
  color:#fff7f2;
  font:600 13px/1.45 system-ui,sans-serif;
  text-align:center;
  box-shadow:0 12px 30px rgba(0,0,0,.32);
}

@media (max-width:700px){
  html,body{width:100%;max-width:100vw}
  .wrapper,
  .container,
  .app,
  .shell,
  .panel,
  .game-wrap,
  #mainWrap{
    width:min(100%,100vw)!important;
    min-width:0!important;
    max-width:100%!important;
  }
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,
  *::before,
  *::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
  }
}