/* Explicit Studio slots. Artwork and workflow fields remain owned by their surfaces. */
.m-studio-frame { --m-studio-header-height: var(--m-s-12); color: var(--m-ink); background: var(--m-ground); }
.m-studio-frame__header {
  display: flex; align-items: center; flex-wrap: wrap;
  min-height: var(--m-studio-header-height); gap: var(--m-s-2);
  padding-inline: var(--m-s-3); border-bottom: var(--m-s-hair) solid var(--m-edge);
  background: var(--m-ground); color: var(--m-ink);
}
.m-studio-frame__menu-host { display: flex; flex: none; align-items: center; }
.m-studio-frame__title { margin: 0; font: var(--m-micro); letter-spacing: var(--m-track); text-transform: uppercase; min-width: 0; overflow-wrap: anywhere; }
.m-studio-frame__context { font: var(--m-body); color: var(--m-ink-2); min-width: 0; overflow-wrap: anywhere; }
.m-studio-frame__search { min-width: 0; flex: 1 1 12rem; }
.m-studio-frame__actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--m-s-2); margin-inline-start: auto; min-width: 0; }
.m-studio-frame__status { font: var(--m-micro); color: var(--m-ink-2); min-width: 0; overflow-wrap: anywhere; }
.m-studio-frame__main { min-width: 0; }
.m-studio-frame__header button,
.m-studio-frame__header input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.m-studio-frame__header select,
.m-studio-frame__header a {
  min-height: var(--m-target); box-sizing: border-box;
}
@media (max-width: 599px) {
  .m-studio-frame__header { padding-block: var(--m-s-1); }
  .m-studio-frame__search { flex-basis: 100%; }
  .m-studio-frame__actions { margin-inline-start: 0; flex: 1 1 auto; }
}

/* Canonical notices on admitted Studio frames reserve the actual header and
   bottom rail. Public/game callers retain tw-components' placement. */
.tw-toast-stack[data-studio-notifications] {
  --m-notify-rail: 0px; --m-notify-room: 100dvh;
  top: auto; right: var(--m-s-3);
  bottom: calc(var(--m-notify-rail, 0px) + var(--m-s-3) + env(safe-area-inset-bottom, 0px));
  width: min(420px, calc(100vw - 2 * var(--m-s-3)));
  max-width: none; gap: var(--m-s-2);
  max-height: min(40dvh, calc(var(--m-notify-room, 100dvh) - 2 * var(--m-s-3) - env(safe-area-inset-bottom, 0px)));
  overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain;
  pointer-events: auto; overflow-anchor: none;
}
.tw-toast-stack[data-studio-notifications] .tw-toast {
  display: grid; grid-template-columns: 20px minmax(0, 1fr) var(--m-target);
  flex: none; gap: var(--m-s-2); padding: var(--m-s-3);
  background: var(--m-tile-open); color: var(--m-ink);
  border: 1px solid var(--m-edge); border-radius: 0; box-shadow: none;
  font: var(--m-body);
}
.tw-toast-stack[data-studio-notifications] .tw-toast-message {
  color: var(--m-ink); font: var(--m-body); overflow-wrap: anywhere;
}
.tw-toast-stack[data-studio-notifications] .tw-toast-close,
.tw-toast-stack[data-studio-notifications] .tw-toast-action {
  min-width: var(--m-target); min-height: var(--m-target); height: auto;
  box-sizing: border-box; border-radius: 0; color: var(--m-ink);
}
.tw-toast-stack[data-studio-notifications] .tw-toast-close { width: var(--m-target); grid-column: 3; grid-row: 1; }
.tw-toast-stack[data-studio-notifications] .tw-toast-action {
  grid-column: 2 / 4; justify-self: start; max-width: 100%;
  padding: var(--m-s-2) var(--m-s-3); border: 1px solid var(--m-edge);
  font: var(--m-micro); letter-spacing: var(--m-track); white-space: normal; overflow-wrap: anywhere;
}
.tw-toast-stack[data-studio-notifications] button:focus-visible { outline: 2px solid var(--m-focus); outline-offset: -2px; }
.tw-toast-stack[data-studio-notifications] .tw-toast-error { border-left: 3px solid var(--m-err); }
.tw-toast-stack[data-studio-notifications] .tw-toast-warning { border-left: 3px solid var(--m-warn); }
.tw-toast-stack[data-studio-notifications] .tw-toast-success { border-left: 3px solid var(--m-ok); }
.tw-toast-stack[data-studio-notifications] .tw-toast-success .tw-toast-icon { color: var(--m-ok); }
.tw-toast-stack[data-studio-notifications] .tw-toast-error .tw-toast-icon { color: var(--m-err); }
.tw-toast-stack[data-studio-notifications] .tw-toast-warning .tw-toast-icon { color: var(--m-warn); }
.tw-toast-stack[data-studio-notifications] .tw-toast-info .tw-toast-icon { color: var(--m-ink-2); }
/* A long diagnostic scrolls inside its existing message area. The newest
   notice's recovery and dismiss controls remain visible outside that area. */
.tw-toast-stack[data-studio-notifications] .tw-toast-content {
  max-height: min(20dvh, max(var(--m-target), calc(var(--m-notify-room, 100dvh) - 2 * var(--m-target) - 6 * var(--m-s-3))));
  overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain;
}
.tw-toast-stack[data-studio-notifications] .tw-toast-content:focus-visible { outline: 2px solid var(--m-focus); outline-offset: -2px; }

/* Generated Studio chrome groups live identity, context and commands. The
   caption stays in flow so a longer native title grows the row rather than
   clipping or covering Help. The Home link retains the complete 44px seat. */
.m-studio-frame__identity,.m-studio-frame__context-lane { display:flex; align-items:center; gap:var(--m-s-2); min-width:0; }
.m-studio-frame__identity { flex:none; }
.m-studio-frame__generated-header .m-studio-frame__identity,
.m-studio-frame__generated-header .m-studio-frame__identity .twsh-brand { min-height:var(--m-target); }
.m-studio-frame__context-lane:empty { display:none; }
.m-studio-frame__generated-header .twsh-help-btn { width:auto; border-radius:0; padding-inline:var(--m-s-3); font:var(--m-micro); letter-spacing:var(--m-track); }
.m-studio-frame__generated-header .twsh-topbar-right { width:auto; max-width:none; flex:0 1 auto; flex-wrap:wrap; overflow:visible; }
.m-studio-frame__generated-header .twsh-quiz-picker { flex:none; max-width:none; }
@media(max-width:899px) {
  .m-studio-frame__generated-header { gap:var(--m-s-1) var(--m-s-2); padding-block:var(--m-s-1); }
  .m-studio-frame__generated-header .m-studio-frame__identity { position:relative; flex:0 1 10rem; min-width:10rem; padding-top:var(--m-s-6); box-sizing:border-box; flex-wrap:wrap; gap:var(--m-s-1) var(--m-s-2); }
  .m-studio-frame__generated-header .m-studio-frame__identity .twsh-brand { position:absolute; inset:0; width:100%; height:100%; align-items:flex-start; padding-top:var(--m-s-1); padding-bottom:var(--m-s-3); box-sizing:border-box; }
  .m-studio-frame__generated-header .m-studio-frame__identity .m-studio-frame__title { position:relative; min-width:0; width:100%; white-space:normal; }
  .m-studio-frame__generated-header .m-studio-frame__context-lane { flex:0 1 auto; }
  .m-studio-frame__generated-header .twsh-topbar-right { margin-inline-start:0; flex:1 1 auto; gap:var(--m-s-1); }
  .m-studio-frame__generated-header .twsh-mode-tabs { flex:1 1 0; min-width:var(--m-target); }
}
@media(max-width:599px) {
  .tw-shell .m-studio-frame__generated-header { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; }
  .m-studio-frame__generated-header > .twsh-appnav-menu-btn { grid-column:1; grid-row:1; }
  .m-studio-frame__generated-header > .m-studio-frame__identity { grid-column:2 / 4; grid-row:1; min-width:0; }
  .m-studio-frame__generated-header > .m-studio-frame__context-lane { grid-column:1; grid-row:2; }
  .m-studio-frame__generated-header > .twsh-mode-tabs { grid-column:2 / 4; grid-row:2; width:100%; }
  .m-studio-frame__generated-header > .twsh-topbar-right { grid-column:1 / 3; grid-row:3; min-width:0; width:100%; flex-wrap:wrap; overflow-x:auto; overflow-y:hidden; scrollbar-width:thin; padding-bottom:2px; }
  .m-studio-frame__generated-header > .twsh-topbar-right::-webkit-scrollbar { display:block; height:3px; }
  .m-studio-frame__generated-header > .twsh-topbar-right::-webkit-scrollbar-thumb { background:var(--m-ink-3); }
  .m-studio-frame__generated-header > .studio-ai-dock { grid-column:3; grid-row:3; margin-inline-start:0; }
  /* A shell with no primary command or avatar can use two functional rows.
     This changes allocation only; live save/lifecycle nodes remain intact. */
  .m-studio-frame__generated-header.m-studio-frame__utility-header > .m-studio-frame__identity { grid-column:2; grid-row:1; min-width:0; width:100%; }
  .m-studio-frame__generated-header.m-studio-frame__utility-header > .twsh-topbar-right { grid-column:3; grid-row:1; width:auto; }
  .m-studio-frame__generated-header.m-studio-frame__utility-header > .twsh-mode-tabs { grid-column:2; grid-row:2; }
  .m-studio-frame__generated-header.m-studio-frame__utility-header > .studio-ai-dock { grid-column:3; grid-row:2; }
  .m-studio-frame__generated-header > .twsh-topbar-right:has(.twsh-btn-primary):not(:has(.twsh-avatar)) { display:grid; grid-template-columns:minmax(0,1fr) auto; }
  .m-studio-frame__generated-header > .twsh-topbar-right:has(.twsh-btn-primary):not(:has(.twsh-avatar)) > .twsh-lifecycle-seat,
  .m-studio-frame__generated-header > .twsh-topbar-right:has(.twsh-btn-primary):not(:has(.twsh-avatar)) > .twsh-save-state { grid-column:1 / -1; }
  .m-studio-frame__generated-header > .twsh-topbar-right:has(.twsh-btn-primary):not(:has(.twsh-avatar)) > .twsh-btn-primary { min-width:0; padding-inline:var(--m-s-2); white-space:normal; }
  /* BBZ inserts these authored groups beside the direct right cluster.
     Following rows reserve their real space without moving live nodes. */
  .m-studio-frame__generated-header > #bbz-zoom-strip,
  .m-studio-frame__generated-header > #bbz-nav-group,
  .m-studio-frame__generated-header > [data-bbz-bank-search] { grid-column:1 / -1; grid-row:auto; min-width:0; max-width:100%; }
}
/* Whole destination labels remain available through a visibly scrollable
   native list. These Studio scopes outrank legacy short-label admission. */
.tw-shell.m-studio-frame.has-appnav.appnav-bottom .twsh-appnav-label.has-short,
.m-studio-frame.m-appnav-frame:not(.m-appnav-frame--menu) .twsh-appnav-label.has-short { display:inline; }
.tw-shell.m-studio-frame.has-appnav.appnav-bottom .twsh-appnav-short,
.m-studio-frame.m-appnav-frame:not(.m-appnav-frame--menu) .twsh-appnav-short { display:none; }
.tw-shell.m-studio-frame.has-appnav.appnav-bottom .twsh-appnav-list,
.m-studio-frame.m-appnav-frame:not(.m-appnav-frame--menu) .twsh-appnav-list { overflow-x:auto; scrollbar-width:thin; padding-bottom:2px; }
.tw-shell.m-studio-frame.has-appnav.appnav-bottom .twsh-appnav-list::-webkit-scrollbar,
.m-studio-frame.m-appnav-frame:not(.m-appnav-frame--menu) .twsh-appnav-list::-webkit-scrollbar { display:block; height:3px; }
.tw-shell.m-studio-frame.has-appnav.appnav-bottom .twsh-appnav-list::-webkit-scrollbar-thumb,
.m-studio-frame.m-appnav-frame:not(.m-appnav-frame--menu) .twsh-appnav-list::-webkit-scrollbar-thumb { background:var(--m-ink-3); }
.m-studio-frame .twsh-appnav-list:focus-visible { outline:2px solid var(--m-focus); outline-offset:-2px; }
