/* Compact story authoring. Dock is a sibling of the stage so the iframe keeps its height. */
.gallery-story-dialog { width: min(calc(100% - var(--sp-6)), 544px); }
.gallery-story-dialog__footer { flex-wrap: wrap; gap: var(--sp-2); }
.gallery-story-dialog__tools { display: flex; flex-wrap: wrap; gap: var(--sp-1); margin-right: auto; }
.gallery-story-dock {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-2) var(--sp-3);
  border-top: 1px solid var(--color-border);
  background: rgb(var(--surface-rgb));
  min-height: 44px;
  grid-column: 1;
}
.gallery-story-dock[hidden] { display: none; }
@media (min-width: 1200px) {
  .gallery-scene:has(> #story-author-dock:not([hidden])) {
    grid-template-rows: minmax(0, 1fr) auto;
  }
  .gallery-scene:has(> #story-author-dock:not([hidden])) .gallery-scene__stage {
    grid-column: 1;
    grid-row: 1;
    min-height: 0;
  }
  .gallery-scene:has(> #story-author-dock:not([hidden])) > #story-author-dock {
    grid-column: 1;
    grid-row: 2;
  }
  .gallery-scene:has(> #story-author-dock:not([hidden])) .gallery-scene__panel {
    grid-column: 2;
    grid-row: 1 / -1;
    height: auto;
    min-height: 0;
    overflow-y: auto;
  }
}
.gallery-story-dock .panel__submeta { margin: 0; flex: 1 1 10rem; min-width: 0; }
.gallery-story-dock .button { min-height: 44px; }
.gallery-story-dialog #highlight-point-section,
.gallery-story-dialog #highlight-camera-section { gap: var(--sp-2); }
.gallery-story-dialog #highlight-point-section + #highlight-camera-section { padding-top: var(--sp-3); }
.gallery-highlight { display: grid; gap: var(--sp-1); }
.gallery-highlight__heading { display: flex; align-items: center; gap: var(--sp-1); min-width: 0; }
.gallery-highlight__title { flex: 1; min-width: 0; text-align: start; }
.gallery-page .gallery-viewpoint__heading-actions > .gallery-edit-icon { flex: 0 0 32px; }
.gallery-highlight-delete { display: inline-flex; align-items: center; gap: var(--sp-2); min-height: 44px; }
.gallery-highlight-list .gallery-highlight { padding: var(--sp-3); }
.gallery-viewpoint { display: grid; gap: var(--sp-1); }
.gallery-viewpoint__heading-actions { display: flex; justify-content: flex-end; }
/* Focus: scene is a full-viewport column; dock is a reserved row, never over the canvas. */
body.gallery-presenting .gallery-scene,
body.gallery-presenting .gallery-scene:has(> #story-author-dock:not([hidden])) {
  position: fixed;
  inset: 0;
  z-index: 1500;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100dvh;
  min-height: 0;
  grid-template-columns: none;
  grid-template-rows: none;
}
body.gallery-presenting .gallery-scene > .gallery-scene__stage,
body.gallery-presenting .gallery-scene:has(> #story-author-dock:not([hidden])) .gallery-scene__stage {
  position: relative;
  inset: auto;
  z-index: auto;
  flex: 1 1 auto;
  width: 100%;
  height: auto;
  min-height: 0;
  grid-column: auto;
  grid-row: auto;
}
body.gallery-presenting .gallery-scene > #story-author-dock:not([hidden]),
body.gallery-presenting .gallery-story-dock:not([hidden]) {
  position: static;
  inset: auto;
  left: auto;
  top: auto;
  right: auto;
  bottom: auto;
  transform: none;
  z-index: auto;
  flex: none;
  width: 100%;
  max-width: none;
  grid-column: auto;
  grid-row: auto;
  box-shadow: none;
}
body.gallery-presenting .gallery-scene > .gallery-scene__panel {
  display: none;
}
@media (max-width: 900px) {
  body.gallery-page--scene:not(.gallery-page--presenting):not(.gallery-presenting) .gallery-scene__stage {
    min-height: 380px;
    height: max(380px, min(72vw, 480px));
  }
}
@media (max-width: 900px) and (max-height: 500px) {
  body.gallery-page--scene:not(.gallery-page--presenting):not(.gallery-presenting) .gallery-scene__stage {
    min-height: 0;
    height: min(72vw, calc(100dvh - 7rem), 480px);
  }
}
@media (max-width: 720px) {
  .gallery-page .gallery-viewpoint__heading-actions > .gallery-edit-icon,
  .gallery-page .button--icon.gallery-edit-icon { width: 44px; min-width: 44px; height: 44px; min-height: 44px; flex-basis: 44px; }
  .gallery-story-dialog { width: min(calc(100% - var(--sp-4)), 544px); max-height: calc(100dvh - var(--sp-4)); }
  .gallery-story-dialog .gallery-dialog__body { max-height: min(70dvh, calc(100dvh - 12rem)); }
}
@media (max-height: 430px) {
  .gallery-story-dock { padding-block: var(--sp-1); min-height: 36px; }
}
/* Camera track: one reserved dock surface, with 44px control geometry. */
.lf-track-editor { position:relative; --lf-tint:var(--gallery-tint); --lf-track: var(--gallery-track); display: grid; gap: var(--sp-3); width: 100%; min-width: 0; }
.lf-track-editor__toolbar, .lf-track-editor__group { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-1); }
.lf-track-editor__toolbar { gap: var(--sp-2); }
.lf-track-editor__toolbar--transport > span { white-space: nowrap; }
.lf-track-editor__settings { border-left: 1px solid var(--color-border); padding-left: var(--sp-2); }
.lf-track-editor__group + .lf-track-editor__group { border-left: 1px solid var(--color-border); padding-left: var(--sp-2); }
.gallery-page .lf-track-editor .button--icon { width: 44px; height: 44px; min-width: 44px; min-height: 44px; flex: 0 0 44px; padding: 0; }
.lf-track-editor__dirty { color: var(--gallery-ink); font-size: var(--type-12); }
#camera-path-time { font-size: var(--type-13); font-variant-numeric: tabular-nums; white-space: nowrap; }
#camera-path-save { margin-left: auto; }
.lf-track-editor__settings { position: relative; }
.lf-track-editor__popover { position: absolute; top: 100%; right: 0; z-index: 10; display: grid; gap: var(--sp-3); width: min(280px, calc(100vw - var(--sp-6))); padding: var(--sp-3); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-2); box-shadow: var(--shadow-surface); }
.lf-track-editor__details { display: flex; flex-wrap: wrap; align-items: start; gap: var(--sp-3); min-width: 0; }
#camera-path-keys { display: flex; gap: var(--sp-2); overflow-x: auto; padding: var(--sp-1); min-width: 0; flex: 1 1 240px; overscroll-behavior-x: contain; }
.lf-key-card { flex: 0 0 114px; display: grid; gap: var(--sp-1); padding: 0 0 var(--sp-1); border: 1px solid var(--color-border); border-radius: var(--r-1); background: var(--color-surface); color: var(--color-heading); font: 500 var(--type-12)/var(--lh-20) var(--font-body); cursor: pointer; overflow: hidden; }
.lf-key-card__image { display: grid; place-items: center; width: 112px; height: 70px; background: var(--lf-track); }
.lf-key-card img { width: 112px; height: 70px; object-fit: cover; }
.lf-key-card[aria-pressed=true] { outline: 2px solid var(--gallery-ink); outline-offset: 0; }
#camera-path-inspector { display: flex; flex-wrap: wrap; gap: var(--sp-2); flex: 0 1 auto; }
#camera-path-inspector .gallery-field { width: 104px; }
#camera-path-inspector .gallery-field:last-child { width: auto; }
.lf-track-editor .gallery-field { display: grid; gap: var(--sp-1); font-size: var(--type-13); }
.lf-track-editor input { min-height: 44px; width: 100%; }
.lf-track-editor .gallery-segmented { height: auto; min-height: 44px; padding: 0; }
.lf-track-editor .button[aria-pressed=true] { background: var(--gallery-tint); color: var(--gallery-ink); }
.lf-track-editor__confirm { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); padding-top: var(--sp-2); border-top: 1px solid var(--color-border); }
.lf-track-editor__confirm > span { margin-right: auto; }
.lf-track-editor :focus-visible { outline: 2px solid var(--gallery-ink); outline-offset: 2px; }
@media (max-width: 720px) { #camera-path-inspector { flex-basis: 100%; } .lf-track-editor__popover { right: auto; left: 0; } }
.gallery-page #camera-path-open { min-height: 44px; color: var(--gallery-ink); border-color: var(--gallery-ink); }
.gallery-page #camera-path-open:hover { background: var(--gallery-tint); }

/* R38/R44: preserve touch labels within the compact authoring row. */
.lf-track-editor__group { gap:8px; }
@media(max-width:719px) and (pointer:coarse) {
 .gallery-page .lf-track-editor :is(#camera-path-add-key,#camera-path-delete-key,#camera-path-undo,#camera-path-more) { width:auto; min-width:52px; height:auto; min-height:56px; flex-basis:auto; padding:4px; font-size:11px; gap:4px; }
}
@media(max-width:719px) { .lf-track-editor__settings .lf-track-editor__popover { left:auto; right:0; } }
