.lite-context {
  position: fixed;
  z-index: 1000;
  inset: 0 0 auto;
  min-height: 58px;
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  background: #f7f7f5;
  color: #0b0b0c;
  border-bottom: 1px solid #0b0b0c;
  font-family: Arial, Helvetica, sans-serif;
}

.lite-context > div,
.lite-context nav,
.lite-context a {
  display: flex;
  align-items: center;
}

.lite-context > div { gap: .65rem; padding: .75rem 1rem; }
.lite-context strong { font-size: 1rem; }
.lite-context span { font: 700 .62rem/1 Menlo, Monaco, "Courier New", monospace; letter-spacing: .07em; text-transform: uppercase; }
.lite-context nav { margin-left: auto; }
.lite-context a { min-height: 58px; padding: .65rem .9rem; border-left: 1px solid #0b0b0c; color: #0b0b0c; font: 700 .64rem/1.1 Menlo, Monaco, "Courier New", monospace; letter-spacing: .05em; text-decoration: none; text-transform: uppercase; }
.lite-context a:first-child { background: #ff2b21; }
.lite-context a:hover { background: #0b0b0c; color: #f7f7f5; }

body { padding-top: 58px; }
.studio-shell { height: calc(100dvh - 58px); min-height: calc(100dvh - 58px); }

.lite-capability { position: fixed; z-index: 1100; right: .75rem; bottom: .75rem; max-width: 28rem; padding: .9rem 2.5rem .9rem 1rem; border: 1px solid #0b0b0c; background: #ff2b21; color: #0b0b0c; font: 700 .75rem/1.35 Menlo, Monaco, "Courier New", monospace; }

.lite-fallback { min-height: calc(100vh - 58px); display: flex; flex-direction: column; justify-content: center; padding: clamp(2rem, 8vw, 8rem); background: #ff2b21; color: #0b0b0c; font-family: Arial, Helvetica, sans-serif; }
.lite-fallback img { width: 3rem; }
.lite-fallback h1 { max-width: 9ch; margin: 2rem 0; font-size: clamp(4rem, 12vw, 11rem); line-height: .84; letter-spacing: -.07em; }
.lite-fallback p { max-width: 40rem; font-size: 1.1rem; }

@media (max-width: 760px) {
  .lite-context { min-height: 68px; }
  .lite-context > div { flex-direction: column; align-items: flex-start; justify-content: center; gap: .2rem; }
  .lite-context nav a { display: none; }
  .lite-context nav a:first-child,
  .lite-context nav a:nth-child(2) { display: flex; min-height: 68px; }
  body { padding-top: 68px; }
  .studio-shell { height: calc(100dvh - 68px); min-height: calc(100dvh - 68px); }
}

@media (max-width: 440px) {
  .lite-context nav a:nth-child(2) { display: none; }
  .lite-context nav a:first-child { max-width: 8rem; text-align: center; }
}

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