/* Integration fixes shared by the standalone route and shadow component. */
:host { display:block; color-scheme:dark; }
body { overflow-wrap:break-word; }
.skip { top:0; transform:translateY(-200%); }
.skip:focus { transform:none; }
.curated-brand, .muda-identity { flex-wrap:wrap; max-width:100%; }
.muda-identity { white-space:normal; }
.muda-type { min-width:0; max-width:100%; }
.muda-type b { overflow-wrap:anywhere; }
header, main, footer { box-sizing:border-box; }
button, a, input, #stage-title { scroll-margin-block:110px; }
header nav { margin-left:0; }
main { height:auto; }
.opening-bottom button { font-size:1rem; }
#brand-opening { width:100%; max-width:none; height:100dvh; max-height:none; margin:0; border:0; padding:0; }
#brand-opening::backdrop { background:#282828; }
#overview { position:relative; grid-column:1/-1; grid-row:1/-1; overflow:visible; }
.map-mode main { min-height:0; }
.map-mode #world { display:none; }
#loading { left:auto; right:4%; max-width:90%; }
dialog { overflow-y:auto; overscroll-behavior:contain; }
dialog h2, dialog h3 { overflow-wrap:anywhere; }
.footnote a { text-decoration:underline; min-height:44px; display:inline-flex; align-items:center; }
@media(max-width:1100px) {
  /* Reserve two label lines, including at 200% text size, above the scene. */
  #shot-label { min-height:3.2em; }
}
@media(max-width:900px) {
  .brand, .brand-baseline, .curated-brand { max-width:100%; }
  header nav { justify-content:flex-start; }
}
@media(prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation:none!important; transition:none!important; }
}