/* Шапка конструкторів studio (public/ctor/ctor-head.js).
   html.ctor-compact — велику шапку згорнуто: заголовок лишається для читача екрана,
   назва видно в крихтах; html.ctor-full — робоча зона на весь екран, без хедера,
   крихт і футера, з кнопкою виходу вгорі праворуч. */
nav.app-crumbs.has-ctor { display: flex; align-items: center; gap: 12px; }
.app-crumbs.has-ctor ol { flex: 1 1 auto; min-width: 0; }
.ctor-tools { display: flex; gap: 6px; flex: none; }
.ctor-btn, .ctor-exit { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 4px 12px; border-radius: 999px;
  border: 1px solid rgba(27, 77, 62, .2); background: var(--surface, #fff); color: var(--green, #1B4D3E);
  font: 600 .8rem/1.2 var(--font, system-ui, sans-serif); cursor: pointer; white-space: nowrap;
  transition: background-color .15s ease, border-color .15s ease; }
.ctor-btn:hover, .ctor-exit:hover { background: rgba(27, 77, 62, .06); border-color: rgba(27, 77, 62, .4); }
.ctor-btn:focus-visible, .ctor-exit:focus-visible { outline: 2px solid var(--focus, #D4AF37); outline-offset: 2px; }
.ctor-btn[aria-expanded="true"] { background: rgba(27, 77, 62, .08); }

.ctor-compact [data-ctor-hero] { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.ctor-exit { display: none; }
.ctor-full .ctor-exit { display: inline-flex; position: fixed; top: 10px; right: 12px; z-index: 1000; box-shadow: 0 6px 20px rgba(0, 0, 0, .15); }
.ctor-full header.app-nav, .ctor-full nav.app-crumbs, .ctor-full footer.app-footer,
.ctor-full [data-ctor-hero], .ctor-full .cab-head, .ctor-full .cab-lead { display: none; }
.ctor-full #main { padding-top: 52px; }
/* Схема: полотно на всю висоту, що лишилась. */
.ctor-full .sc-stage .rb-scene { height: calc(100dvh - 150px); }

@media (max-width: 640px) {
  nav.app-crumbs.has-ctor { flex-wrap: wrap; row-gap: 4px; }
  .ctor-tools { width: 100%; }
  .ctor-btn { flex: 1 1 0; justify-content: center; min-height: 40px; }
  .ctor-full .sc-stage .rb-scene { height: calc(100dvh - 190px); }
}
@media (prefers-reduced-motion: reduce) { .ctor-btn, .ctor-exit { transition: none; } }