/* Keep the development notice visible without covering page controls. */
:root {
  --development-notice-height: calc(44px + env(safe-area-inset-bottom, 0px));
  --development-page-height: calc(100dvh - var(--development-notice-height));
}

.development-notice {
  position: fixed;
  z-index: 2147483647;
  inset: auto 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
  height: var(--development-notice-height);
  box-sizing: border-box;
  margin: 0;
  padding: 10px max(12px, env(safe-area-inset-right, 0px)) calc(10px + env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
  background: #c62828;
  color: #fff;
  font: 700 clamp(10px, 2.6vw, 12px)/1.4 Arial, Helvetica, sans-serif;
  letter-spacing: 0.06em;
  text-align: center;
}

/* These surfaces manage their own scrolling and normally fill the viewport. */
body .catalog-page,
body .partner-page,
body .legal-page-shell,
body .v2-standalone-page,
body .v2-content-shell,
body .v2-auth-page,
body .app-shell,
body .workspace {
  height: var(--development-page-height);
}

body .v2-creator-page,
body .v2-standalone-page,
body .v2-auth-page,
body .v2-loading,
body .anillama-creator,
body .admin-shell,
body .admin-sidebar {
  min-height: var(--development-page-height);
}

body .anillama-creator__layout,
body .admin-content {
  height: var(--development-page-height);
}

body .admin-scroll {
  height: calc(var(--development-page-height) - 82px);
}

@media (max-width: 900px) {
  body .admin-shell { height: var(--development-page-height); min-height: 0; }
  body .admin-sidebar { min-height: 0; }
  body .admin-content { height: 100%; }
  body .admin-scroll { height: auto; }
}

@media (max-width: 780px) {
  body .studio-chat-creator.anillama-creator {
    bottom: var(--development-notice-height);
    height: calc(var(--studio-viewport-height, 100dvh) - var(--development-notice-height));
    min-height: 0;
  }
  body .studio-chat-creator .anillama-creator__layout {
    height: 100%;
    min-height: 0;
  }
}
