/* Gallery rhythm. Dimensions below are UI geometry, not spacing: 40px desktop
   controls, 44px mobile targets, 32px compact desktop controls, 36px desktop
   segments, 2px segment/switch insets, 6px meters, 1px hairlines and 2px focus
   rings. Media sizes, breakpoints, aspect ratios, safe-area positions and
   percentages are intrinsic layout exceptions. */
.gallery-page {
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px;
  --r-1: 6px; --r-2: 10px; --r-3: 14px; --r-pill: 9999px;
  --type-12: 12px; --type-13: 13px; --type-14: 14px; --type-15: 15px;
  --type-16: 16px; --type-18: 18px; --type-22: 22px; --type-28: 28px;
  --type-36: 36px; --type-54: 54px;
  /* Uppercase labels are the explicit 11px exception to the type scale. */
  --type-caps: 11px;
  --lh-16: 16px; --lh-20: 20px; --lh-24: 24px; --lh-28: 28px;
  --lh-32: 32px; --lh-36: 36px; --lh-44: 44px; --lh-60: 60px;
  --gallery-inset: rgba(var(--ink-rgb), .04);
  --gallery-track: rgba(var(--ink-rgb), .08);
  /* Accent ink is for text/focus; button fill stays a solid action blue. */
  --gallery-ink: #0b3fb8;
  --gallery-ink-rgb: 11, 63, 184;
  --gallery-button-fill: var(--color-primary);
  --gallery-button-fill-hover: var(--color-primary-hover);
  --gallery-tint: rgba(var(--gallery-ink-rgb), .12);
  /* Scene imagery keeps a dark neutral surround in either chrome theme. */
  --gallery-stage: #0a0e13; --gallery-cover: #11151b;
  --gallery-cover-ink: rgb(255 255 255 / 60%);
  --gallery-cover-icon: rgb(255 255 255 / 30%);
  --radius-button: var(--r-2); --card-radius: var(--r-3);
  font-family: var(--font-body); font-size: var(--type-16); line-height: var(--lh-24); text-align: left;
}
:root[data-theme="dark"] .gallery-page {
  --gallery-ink: #93b8ff;
  --gallery-ink-rgb: 147, 184, 255;
  --gallery-button-fill: color-mix(in srgb, var(--color-primary) 82%, #000);
  --gallery-button-fill-hover: color-mix(in srgb, var(--color-primary) 70%, #000);
}
.gallery-page *, .gallery-page *::before, .gallery-page *::after { box-sizing: border-box; }
.gallery-page :is(h1,h2,h3,p,ul,ol,pre,form) { margin: 0; }
.gallery-page [hidden] { display: none !important; }
.gallery-page :is(h2,h3,.gallery-section__title) { font: 600 var(--type-15)/var(--lh-24) var(--font-body); color: var(--color-heading); letter-spacing: normal; text-transform: none; }
.gallery-page :is(.panel__submeta,.gallery-section__hint,.gallery-meta,small) { font-size: var(--type-13); line-height: var(--lh-20); font-weight: 400; color: var(--color-muted); }
.gallery-page .eyebrow { font-size: var(--type-caps); line-height: var(--lh-16); letter-spacing: .08em; gap: var(--sp-2); }
.gallery-page :is(output,.gallery-meta,.gallery-meter,.gallery-toolbar__end,.gallery-tour-nav,.gallery-metrics strong) { font-variant-numeric: tabular-nums; }
.gallery-icon { display: inline-block; flex: none; vertical-align: middle; pointer-events: none; }
.gallery-page .button { display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-2); min-height: 40px; padding: var(--sp-2) var(--sp-4); border-radius: var(--r-2); font: 600 var(--type-14)/var(--lh-20) var(--font-body); box-shadow: none; text-align: left; background: var(--gallery-button-fill); border-color: var(--gallery-button-fill); color: #fff; }
.gallery-page .button:hover { background: var(--gallery-button-fill-hover); border-color: var(--gallery-button-fill-hover); color: #fff; }
.gallery-page .button--small { min-height: 32px; padding: var(--sp-1) var(--sp-3); font-size: var(--type-13); }
.gallery-page .button--icon { width: 40px; height: 40px; min-width: 40px; padding: 0; flex: 0 0 40px; }
.gallery-page .button .gallery-icon { width: 18px; height: 18px; }
.gallery-page .button--small .gallery-icon { width: 16px; height: 16px; }
.gallery-page .button--ghost { background: transparent; color: var(--color-heading); border-color: var(--color-border); }
.gallery-page .button--ghost:hover { background: var(--gallery-inset); color: var(--color-heading); border-color: var(--color-border); }
.gallery-page .button--danger { color: white; background: var(--color-danger-solid); border-color: var(--color-danger-solid); }
.gallery-page .button--danger:hover { background: var(--color-danger-solid-hover); border-color: var(--color-danger-solid-hover); color: white; }
.gallery-page .button--danger-ghost { color: var(--color-error); background: transparent; border-color: color-mix(in srgb, var(--color-error) 35%, transparent); }
.gallery-page .button--danger-ghost:hover { background: color-mix(in srgb, var(--color-error) 10%, transparent); color: var(--color-error); }
.gallery-page .button--light-ghost { color: white; background: transparent; border-color: rgb(255 255 255 / 30%); }
.gallery-page .button--light-ghost:hover { background: rgb(255 255 255 / 10%); color: white; }
.gallery-page a:has(> .gallery-icon):not([role=menuitem]) { gap: var(--sp-1); }
.gallery-page a:has(> .gallery-icon) { display: inline-flex; align-items: center; }
.gallery-page .badge, .gallery-card__format, .gallery-stat { display: inline-flex; align-items: center; justify-self: start; flex: none; width: fit-content; padding: var(--sp-1) var(--sp-2); border: 0; border-radius: var(--r-1); background: var(--gallery-tint); color: var(--gallery-ink); font: 600 var(--type-caps)/var(--lh-16) var(--font-body); letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.gallery-page .badge--neutral { background: var(--gallery-track); color: var(--color-heading); }

/* Page and section layout. */
.gallery-page .site-main { padding-block: var(--sp-7); }
.gallery-page .dashboard-main { display: grid; gap: var(--sp-5); padding-block: 0; }
.gallery-page .dashboard-main:has(.gallery-settings-form) { gap: var(--sp-6); }
.gallery-page .site-main > .shell + .shell { margin-top: 0; }
.gallery-page .page-hero { grid-template-columns: minmax(0,1fr); gap: var(--sp-3); }
.gallery-page .page-hero .page-hero__title { font-size: var(--type-36); line-height: var(--lh-44); }
.gallery-page .page-hero > div > .button { justify-self: start; }
.gallery-page .page-hero, .gallery-header { padding-block: 0 var(--sp-6); }
.gallery-header { display: grid; grid-template-columns: minmax(0,7fr) minmax(0,5fr); column-gap: var(--sp-5); row-gap: var(--sp-2); align-items: baseline; --hero-eyebrow-row: 1; --hero-title-row: 2; --hero-lead-row: 3; }
.gallery-header:has(> div > a:first-child) { --hero-eyebrow-row: 2; --hero-title-row: 3; --hero-lead-row: 4; }
.gallery-header > div > .eyebrow { grid-column: 1; grid-row: var(--hero-eyebrow-row); }
.gallery-header > div > .page-hero__title { grid-column: 1; grid-row: var(--hero-title-row); }
.gallery-header > div > :is(.page-hero__lead,p:not(.eyebrow)) { grid-column: 1; grid-row: var(--hero-lead-row); }
.gallery-header > div > a:first-child { grid-column: 1; grid-row: 1; justify-self: start; color: var(--gallery-ink); text-decoration: none; }
.gallery-header > div > :is(.gallery-profile,.gallery-scene__owner) { grid-column: 1; }
.gallery-header > .button, .gallery-header .gallery-header__actions { grid-column: 2; grid-row: var(--hero-title-row); align-self: baseline; }
.gallery-header .gallery-quota { grid-column: 2; grid-row: var(--hero-lead-row) / span 3; align-self: start; }
.gallery-page .page-hero > div { display: grid; gap: var(--sp-2); min-width: 0; }
.gallery-header:not(.gallery-header--library) > div { display: contents; }
.gallery-page .page-hero__title { font: 700 var(--type-54)/var(--lh-60) var(--font-display); letter-spacing: -.04em; overflow-wrap: anywhere; }
.gallery-page .page-hero__lead { max-width: 62ch; font-size: var(--type-16); line-height: var(--lh-28); }
.gallery-header .page-hero__lead, .gallery-page .page-hero__title + p { padding-top: var(--sp-1); }
.gallery-header__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: var(--sp-2); }
.gallery-header > .button { justify-self: end; white-space: nowrap; }
.gallery-header:not(.gallery-header--library) > .gallery-header__side { display: contents; }
.gallery-header--library {
  grid-template-columns: minmax(0,1fr) minmax(15.5rem,20rem);
  column-gap: var(--sp-5);
  row-gap: var(--sp-4);
  align-items: start;
}
.gallery-header--library .gallery-header__main { display: grid; gap: var(--sp-2); min-width: 0; }
.gallery-header--library .gallery-header__side {
  display: flex; flex-direction: column; align-items: stretch; gap: var(--sp-3); min-width: 0;
  padding-top: var(--sp-6);
}
.gallery-header--library .gallery-header__actions {
  align-self: stretch; width: 100%; justify-content: flex-end;
}
.gallery-header--library .gallery-header__actions .button {
  white-space: normal; text-align: center; min-height: 44px;
}
.gallery-header--library .gallery-storage {
  display: grid; gap: var(--sp-1); padding: 0; border: 0; background: transparent; box-shadow: none;
}
.gallery-header--library .gallery-storage__meta {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--sp-1) var(--sp-3);
}
.gallery-header--library .gallery-storage__label {
  font: 600 var(--type-caps)/var(--lh-16) var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--color-muted);
}
.gallery-header--library .gallery-storage--over .gallery-meter__used { background: var(--color-error); }
.gallery-header--library .gallery-storage--over [data-storage-text] { color: var(--color-error); }
.gallery-subnav { display: flex; gap: var(--sp-5); overflow-x: auto; margin-bottom: var(--sp-6); border-bottom: 1px solid var(--color-border); }
.gallery-subnav a { display: flex; align-items: center; min-height: 40px; padding-block: var(--sp-2); border-bottom: 2px solid transparent; color: var(--color-muted); text-decoration: none; font-size: var(--type-14); line-height: var(--lh-24); white-space: nowrap; }
.gallery-subnav a[aria-current=page] { color: var(--gallery-ink); border-color: var(--gallery-ink); }
.gallery-subnav a:hover { color: var(--gallery-ink); }
body.gallery-page .site-nav__link--active, body.gallery-page .site-nav__link--active > span { color: var(--gallery-ink); }
body.gallery-page .site-nav__link--active:hover { color: var(--gallery-ink); }
body.gallery-page .site-nav__link--active::after { background: var(--gallery-ink); }
.gallery-page .panel, .gallery-quota, .gallery-analytics-panel, .gallery-metrics article { display: grid; align-content: start; gap: var(--sp-3); padding: var(--sp-4); border: 1px solid var(--color-border); border-radius: var(--r-3); background: var(--color-surface); box-shadow: none; min-width: 0; }
.gallery-page :is(.panel,.gallery-quota,.gallery-analytics-panel,.gallery-metrics article):hover { box-shadow: var(--shadow-card); }
.gallery-page .release-card__actions, .gallery-inline-actions, .gallery-upload-actions, .gallery-stage-actions, .gallery-details__footer, .gallery-view-settings__footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: var(--sp-2); margin: 0; }
.gallery-page nav.release-card__actions { margin-top: 0; }
.gallery-profile, .gallery-stats, .gallery-scene__owner, .gallery-profile__country { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); }
.gallery-avatar { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; flex: none; border-radius: var(--r-pill); overflow: hidden; background: var(--gallery-track); font-size: var(--type-12); font-weight: 600; }
.gallery-avatar img { width: 100%; height: 100%; object-fit: cover; }
.gallery-description { white-space: pre-wrap; overflow-wrap: anywhere; max-width: 70ch; font-size: var(--type-15); line-height: var(--lh-24); color: var(--color-body); }

/* Form rhythm: labels/control/hint live inside one field. */
.gallery-form, .gallery-details, #export-form { display: grid; gap: var(--sp-4); min-width: 0; max-width: 48rem; }
.gallery-field, .gallery-form label, .gallery-link-create label { display: grid; gap: var(--sp-1); min-width: 0; }
.gallery-page label { font-size: var(--type-14); line-height: var(--lh-20); font-weight: 500; color: var(--color-heading); }
.gallery-page :where(.form-control,.gallery-search input,.gallery-form input:not([type=checkbox]):not([type=color]):not([type=file]):not([type=range]),.gallery-form textarea,.gallery-form select,#analytics-days) { appearance: none; box-sizing: border-box; width: 100%; min-width: 0; min-height: 40px; padding: var(--sp-2) var(--sp-3); border: 1px solid var(--color-border); border-radius: var(--r-2); background-color: var(--color-surface); color: var(--color-heading); font: 400 var(--type-14)/var(--lh-20) var(--font-body); box-shadow: none; }
.gallery-page textarea { resize: vertical; }
.gallery-page select.form-control, .gallery-page #analytics-days { padding-right: var(--sp-6); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23818b98' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-size: 16px; background-repeat: no-repeat; background-position: right var(--sp-3) center; }
/* Native select indicator is an embedded copy of the shared chevron; neutral ink
   remains visible in both themes where CSS currentColor cannot cross a data URL. */
.gallery-page .gallery-check { display: flex; align-items: center; gap: var(--sp-2); min-height: 44px; cursor: pointer; }
.gallery-page input[type=checkbox] { appearance: none; display: inline-grid; place-content: center; width: 16px; height: 16px; flex: none; margin: 0; border: 1px solid var(--color-border); border-radius: var(--r-1); background: var(--color-surface); cursor: pointer; }
.gallery-page input[type=checkbox]:checked { background: var(--gallery-button-fill); border-color: var(--gallery-button-fill); }
.gallery-page input[type=checkbox]:checked::after { content: ''; width: 8px; height: 4px; border-left: 1.5px solid white; border-bottom: 1.5px solid white; transform: translateY(-1px) rotate(-45deg); }
.gallery-check input { position: relative; top: 0; }
.gallery-check span { display: grid; gap: var(--sp-1); }
.gallery-check b { font-weight: 500; }
.gallery-file { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); }
.gallery-file input[type=file] { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); overflow: hidden; }
.gallery-file output { font-size: var(--type-13); line-height: var(--lh-20); color: var(--color-muted); overflow-wrap: anywhere; }
.gallery-logo-preview, .gallery-file .gallery-logo-preview { display: block; width: 48px; height: 48px; flex: none; border-radius: var(--r-2); border: 1px solid var(--color-border); object-fit: contain; }
.gallery-swatch { display: inline-block; position: relative; width: 40px; height: 40px; border: 1px solid var(--color-border); border-radius: var(--r-2); overflow: hidden; }
.gallery-swatch input[type=color] { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; cursor: pointer; }
.gallery-page input[type=range] { appearance: none; height: 40px; min-width: 0; padding: 0; border: 0; background: transparent; accent-color: var(--color-primary); }
.gallery-page input[type=range]::-webkit-slider-runnable-track { height: 4px; border-radius: var(--r-1); background: var(--gallery-track); }
.gallery-page input[type=range]::-moz-range-track { height: 4px; border-radius: var(--r-1); background: var(--gallery-track); }
/* Thumb/track centering is geometry: (4px -16px)/2, not a rhythm margin. */
.gallery-page input[type=range]::-webkit-slider-thumb { appearance: none; width: 16px; height: 16px; margin-top: calc((4px - 16px) / 2); border-radius: var(--r-pill); background: var(--color-primary); }
.gallery-page input[type=range]::-moz-range-thumb { width: 16px; height: 16px; border: 0; border-radius: var(--r-pill); background: var(--color-primary); }
.gallery-form > .button { justify-self: start; }
.gallery-form-section { display: grid; gap: var(--sp-4); min-width: 0; }
.gallery-form-section > h2 { padding-bottom: 0; }
.gallery-settings-form { gap: var(--sp-6); }
.gallery-settings-form .gallery-form-section { gap: var(--sp-3); }
.gallery-form-fields { display: grid; gap: var(--sp-4); }
.gallery-private-link { margin-top: 0; }
.gallery-control { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: var(--sp-3); min-width: 0; }
.gallery-control > div { min-width: 0; }
.gallery-control > div:first-child { display: grid; gap: var(--sp-1); font-size: var(--type-14); line-height: var(--lh-20); font-weight: 500; }
.gallery-control + .gallery-control { padding-top: var(--sp-3); border-top: 1px solid var(--color-border); }
/* Saved appearance and device rendering share field rhythm, in separate sections. */
.gallery-control--stacked, .gallery-control--field { grid-template-columns: minmax(0,1fr); }
.gallery-control--stacked > :last-child { justify-self: start; }
.gallery-control.gallery-control--field > .gallery-field { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.15fr); align-items: center; gap: var(--sp-3); }
.gallery-control--field select { width: 100%; padding: var(--sp-2) var(--sp-6) var(--sp-2) var(--sp-3); font-size: var(--type-14); border-radius: var(--r-2); }
/* Preserve the 44px color-control target from the appearance layout. */
.gallery-control--field .gallery-swatch { justify-self: end; width: 44px; height: 44px; }
.gallery-control.gallery-control--range > .gallery-field { grid-template-columns: minmax(0,1fr); gap: var(--sp-2); }
.gallery-control--range label { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-3); }
.gallery-control--range output { color: var(--color-muted); font-size: var(--type-14); font-weight: 500; }
#view-settings-form { display: contents; }
/* The section's shared --sp-3 gap replaces the removed display-fields wrapper. */
.gallery-view-settings input, .gallery-view-settings select { min-width: 0; accent-color: var(--color-primary); }
/* Preserve the 28px range-control height; its track spans the full field. */
.gallery-view-settings input[type=range] { width: 100%; height: 28px; padding: 0 var(--sp-2); margin: 0; border: 0; border-radius: 0; box-shadow: none; cursor: pointer; }
.gallery-view-settings__footer { padding-top: var(--sp-4); border-top: 1px solid var(--color-border); }
.gallery-view-settings__footer p { flex-basis: 100%; }
/* Includes both .gallery-rendering and .gallery-view-settings controls. */
.gallery-page :disabled { opacity: .5; cursor: not-allowed; }
.gallery-page [role=status]:empty { display: none; }

/* Shared segmented component and device switch. */
.gallery-segmented { display: flex; align-items: stretch; height: 36px; min-height: 36px; padding: 2px; gap: 0; border: 0; border-radius: var(--r-2); background: var(--gallery-inset); }
.gallery-segmented :is(button,a) { display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-2); min-width: 0; padding: 0 var(--sp-2); border: 0; border-radius: var(--r-1); font: 500 var(--type-13)/var(--lh-20) var(--font-body); color: var(--color-muted); background: transparent; text-decoration: none; white-space: nowrap; cursor: pointer; }
.gallery-segmented :is(.is-active,[aria-current=true],[aria-selected=true],[aria-pressed=true]) { color: var(--gallery-ink); background: var(--gallery-tint); }
.gallery-segmented :is(button,a):hover { color: var(--gallery-ink); }
.gallery-tabs { width: 100%; }
.gallery-tabs [role=tab] { flex: 1; }
.gallery-switch { width: 36px; height: 20px; padding: 2px; border: 0; border-radius: var(--r-pill); background: rgba(var(--ink-rgb), .16); cursor: pointer; transition: background var(--transition-fast); }
.gallery-switch__thumb { display: block; width: 16px; height: 16px; border-radius: var(--r-pill); background: white; transition: transform var(--transition-fast); }
.gallery-switch[aria-checked=true] { background: var(--color-primary); }
.gallery-switch[aria-checked=true] .gallery-switch__thumb { transform: translateX(16px); }

/* Gallery toolbar, cards and states. */
.gallery-toolbar { display: flex; align-items: center; flex-wrap: wrap; column-gap: var(--sp-3); row-gap: var(--sp-2); padding: var(--sp-3); margin-bottom: 0; border: 1px solid var(--color-border); border-radius: var(--r-3); background: var(--color-surface); }
.gallery-search { display: flex; align-items: stretch; gap: var(--sp-2); flex: 1 1 16rem; min-width: 0; }
.gallery-search label { display: block; position: relative; flex: 1 1 auto; min-width: 0; }
.gallery-search > button { flex: none; }
.gallery-search label > .gallery-icon { position: absolute; left: var(--sp-4); width: 16px; height: 16px; top: 50%; transform: translateY(-50%); color: var(--color-muted); }
.gallery-page .gallery-search input { padding-left: calc(var(--sp-4) + var(--sp-4) + var(--sp-2)); height: 40px; }
.gallery-filter-summary { display: block; margin: 0; color: var(--color-muted); font-size: var(--type-13); line-height: var(--lh-20); }
.gallery-page :is(p,small,li,.gallery-instructions,.gallery-section__hint,.panel__submeta,.gallery-filter-summary) a:not(.button) { color: var(--gallery-ink); text-decoration: underline; text-underline-offset: .15em; }
.gallery-toolbar .gallery-segmented { height: 40px; flex: 0 1 auto; }
.gallery-toolbar .gallery-layout { flex: 0 0 auto; }
.gallery-toolbar .gallery-icon { width: 18px; height: 18px; }
.gallery-toolbar__end { display: flex; align-items: center; min-height: 40px; margin-inline-start: auto; flex: 0 0 auto; }
.gallery-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--sp-5); }
.gallery-grid > :is(.gallery-card--pending,.gallery-card--interrupted,.gallery-upload-row) { align-self: start; }
.gallery-card { position: relative; min-width: 0; border: 1px solid var(--color-border); border-radius: var(--r-3); background: var(--color-surface); transition: box-shadow var(--transition-fast); }
.gallery-card:hover { box-shadow: var(--shadow-card); }
.gallery-card:has([role=menu]:not([hidden])) { z-index: 30; }
.gallery-card__image { position: relative; display: grid; place-items: center; aspect-ratio: 16/10; overflow: hidden; border-radius: var(--r-3) var(--r-3) 0 0; background: var(--gallery-cover); }
.gallery-card__image img { width: 100%; height: 100%; object-fit: contain; }
.gallery-card__placeholder, .gallery-viewpoint__placeholder { display: grid; place-content: center; justify-items: center; gap: var(--sp-2); width: 100%; height: 100%; aspect-ratio: 16/10; background: radial-gradient(ellipse at center, rgb(255 255 255 / 3%), transparent 70%), var(--gallery-cover); color: var(--gallery-cover-icon); }
.gallery-card__placeholder small { font-size: var(--type-12); line-height: var(--lh-16); color: var(--gallery-cover-ink); }
.gallery-card__format { position: absolute; top: var(--sp-3); left: var(--sp-3); background: rgb(16 18 22 / 85%); color: white; }
.gallery-card__body { min-height: 0; align-content: start; display: grid; gap: var(--sp-3); padding: var(--sp-4); }
.gallery-card__heading { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-3); }
.gallery-card h2 { font-size: var(--type-16); line-height: var(--lh-24); overflow-wrap: anywhere; }
.gallery-card h2 a { color: var(--color-heading); text-decoration: none; }
.gallery-card__footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-2); min-width: 0; }
.gallery-card__footer > p { min-width: 0; }
.gallery-card__actions { display: flex; align-items: center; gap: var(--sp-2); flex: none; flex-wrap: nowrap; min-width: 0; }
.gallery-page .gallery-card__actions .button--icon { width: 44px; height: 44px; min-width: 44px; min-height: 44px; flex: 0 0 44px; }
.gallery-page .gallery-card__list-format { display: none; }
.gallery-card__date::before { content: ' · '; }
.gallery-menu { position: relative; }
.gallery-menu [role=menu] { position: absolute; top: 100%; right: 0; z-index: 20; min-width: 224px; max-width: calc(100vw - var(--sp-6)); overflow-y: auto; padding: var(--sp-1); border: 1px solid var(--color-border); border-radius: var(--r-2); background: rgb(var(--surface-rgb)); box-shadow: var(--shadow-card); }
.gallery-menu [role=menu][data-placement=above] { top: auto; bottom: 100%; }
.gallery-menu [role=menuitem] { display: flex; align-items: center; gap: var(--sp-2); width: 100%; min-height: 36px; padding: 0 var(--sp-3); border: 0; border-radius: var(--r-1); background: transparent; color: var(--color-heading); text-align: left; text-decoration: none; font: 400 var(--type-13)/var(--lh-20) var(--font-body); cursor: pointer; }
@media (max-width: 600px), (pointer: coarse) {
  .gallery-menu [role=menuitem] { min-height: 44px; }
}
.gallery-menu [role=menuitem] .gallery-icon { width: 16px; height: 16px; }
.gallery-menu [role=menuitem]:is(:hover,:focus-visible) { background: var(--gallery-tint); }
.gallery-menu .gallery-menu__danger { color: var(--color-error); }
.gallery-menu small { margin-left: auto; }
.gallery-card__body > .gallery-menu { justify-self: end; }
/* Upload records keep their status/actions together when the list layout is selected. */
.gallery-grid[data-layout=list] :is(.gallery-upload-row,.gallery-card--interrupted) { display: grid; grid-template-columns: 96px minmax(0,1fr); align-items: start; gap: var(--sp-3); padding: var(--sp-3); }
.gallery-grid[data-layout=list] :is(.gallery-upload-row,.gallery-card--interrupted) .gallery-card__body { display: grid; grid-column: 2; grid-row: 1; gap: var(--sp-3); padding: 0; }
.gallery-grid[data-layout=list] :is(.gallery-upload-row,.gallery-card--interrupted) h2 { grid-column: auto; grid-row: auto; }
.gallery-grid[data-layout=list] .gallery-upload-cover { grid-column: 1; grid-row: 1; height: auto; border-radius: var(--r-2); }
.gallery-empty, .gallery-dropzone { display: grid; justify-items: center; gap: var(--sp-3); padding: var(--sp-6); text-align: center; }
.gallery-empty { grid-column: 1/-1; }
.gallery-empty .button { width: auto; justify-self: center; }
.gallery-empty--upload { padding: 0; }
.gallery-dropzone { width: 100%; border: 1px dashed var(--color-border); border-radius: var(--r-3); background: var(--gallery-inset); }
.gallery-dropzone > .gallery-icon { width: 40px; height: 40px; color: var(--gallery-ink); }
.gallery-dropzone > p:first-of-type { font-size: var(--type-18); line-height: var(--lh-28); color: var(--color-heading); }
/* Status covers stay a compact meter strip; scene photos keep 16/10. */
.gallery-upload-cover { height: auto; min-height: 80px; max-height: 112px; aspect-ratio: auto; border-radius: var(--r-3) var(--r-3) 0 0; }
.gallery-card__placeholder.gallery-upload-cover { width: 100%; height: 80px; max-height: 112px; aspect-ratio: auto; }
.gallery-upload-cover > .gallery-icon { width: 24px; height: 24px; color: var(--color-error); }
.gallery-upload-ring { position: relative; width: 56px; height: 56px; color: var(--gallery-ink); }
.gallery-upload-ring > span, .gallery-upload-ring > .gallery-upload-warning { position: absolute; inset: 0; display: grid; place-items: center; font-size: var(--type-12); line-height: var(--lh-16); color: white; }
.gallery-upload-ring > .gallery-upload-warning { display: none; z-index: 1; background: var(--gallery-cover); color: var(--color-error); }
.gallery-upload-row[data-state=error] .gallery-upload-warning { display: grid; }
.gallery-upload-row[data-state=error] [role=status], .gallery-card--interrupted [data-pending-status] { color: var(--color-error); }
.gallery-upload-row .gallery-card__body { overflow-wrap: anywhere; }
#upload-overlay { position: fixed; inset: 0; z-index: 2000; display: grid; place-items: center; padding: var(--sp-4); background: var(--glass-bg-strong); backdrop-filter: var(--glass-blur); pointer-events: none; }
#upload-overlay::before { content: ''; position: absolute; inset: var(--sp-4); border: 2px dashed var(--gallery-ink); border-radius: var(--r-3); }
.gallery-drop-overlay__card { display: grid; justify-items: center; gap: var(--sp-3); width: min(360px,calc(100vw - var(--sp-8))); padding: var(--sp-6); border: 1px solid var(--color-border); border-radius: var(--r-3); background: var(--color-surface-strong); box-shadow: var(--shadow-surface); text-align: center; }
.gallery-drop-overlay__card > .gallery-icon { width: 48px; height: 48px; color: var(--gallery-ink); }

/* Scene stage and owner/visitor column. */
body.gallery-page--scene .site-main { padding: 0; }
body.gallery-page--scene .site-main > .messages { margin: var(--sp-4) auto; }
.gallery-scene { display: grid; grid-template-columns: minmax(0,1fr); width: 100%; }
.gallery-scene__stage { position: relative; display: flex; flex-direction: column; height: clamp(320px,62dvh,640px); background: var(--gallery-stage); }
.gallery-viewer { display: block; position: relative; flex: 1; width: 100%; height: 100%; min-height: 0; border: 0; background: var(--gallery-stage); }
.gallery-scene__panel { display: grid; grid-auto-rows: max-content; align-content: start; gap: var(--sp-6); width: 100%; min-width: 0; padding: var(--sp-5); overflow-wrap: anywhere; }
.gallery-scene__head, .gallery-scene__heading { display: grid; gap: var(--sp-3); min-width: 0; }
.gallery-scene__head { align-content: start; }
.gallery-scene__topline, .gallery-scene__byline { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); }
.gallery-scene__back { display: inline-flex; align-items: center; gap: var(--sp-1); min-height: 32px; color: var(--color-muted); font-size: var(--type-13); line-height: var(--lh-20); }
.gallery-scene__title { font: 700 var(--type-28)/var(--lh-36) var(--font-display); letter-spacing: -.03em; text-wrap: wrap; overflow-wrap: anywhere; }
.gallery-scene__identity { display: grid; gap: var(--sp-2); }
.gallery-scene__owner a { color: inherit; }
.gallery-scene__action-row { display: flex; align-items: center; gap: var(--sp-2); }
.gallery-scene__action-row .button { min-height: 40px; }
.gallery-scene__action-row .gallery-icon { width: 18px; height: 18px; }
.gallery-scene-menu { margin: 0; }
/* Fixed menu geometry: preserve the 16rem width and 16px viewport clearance.
   ui.js supplies panel-constrained coordinates and closes on scroll/resize. */
.gallery-scene-menu [role=menu], .gallery-scene-menu [role=menu][data-placement=above] { position: fixed; top: var(--gallery-menu-top); left: var(--gallery-menu-left); right: auto; bottom: auto; width: min(16rem,calc(100vw - 16px)); min-width: 0; background: rgb(var(--surface-rgb)); }
#panel-story, #panel-display, #panel-manage { display: grid; align-content: start; gap: var(--sp-6); min-width: 0; }
.gallery-scene__section, .gallery-experience, .gallery-fold { display: grid; align-content: start; gap: var(--sp-3); min-width: 0; padding: 0; border: 0; }
.gallery-scene__section > .button, .gallery-fold > .button { justify-self: start; }
.gallery-scene__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); }
.gallery-scene__actions form { display: contents; }
.gallery-scene__actions [role=status] { flex-basis: 100%; }
.gallery-experience__heading { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); }
.gallery-experience__heading > :first-child { margin-right: auto; }
.gallery-experience__heading h2 { font-size: var(--type-15); }
.gallery-viewpoints { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--sp-3); }
.gallery-viewpoint { min-width: 0; }
.gallery-viewpoint__select { display: grid; gap: var(--sp-2); width: 100%; padding: var(--sp-2); border: 1px solid var(--color-border); border-radius: var(--r-3); background: var(--color-surface); color: var(--color-heading); text-align: left; font: inherit; cursor: pointer; }
.gallery-viewpoint__select:hover { box-shadow: var(--shadow-card); }
.gallery-viewpoint__select[aria-pressed=true] { border-color: var(--gallery-ink); background: var(--gallery-tint); }
.gallery-viewpoint__select img, .gallery-viewpoint__placeholder { display: block; width: 100%; aspect-ratio: 16/10; object-fit: cover; border-radius: var(--r-1); }
.gallery-viewpoint__select > span:not(.gallery-viewpoint__placeholder) { font-size: var(--type-12); line-height: var(--lh-16); font-weight: 500; overflow-wrap: anywhere; }
.gallery-viewpoint__placeholder { display: grid; }
.gallery-viewpoint__actions { display: none; justify-content: flex-end; gap: var(--sp-2); padding-top: var(--sp-2); }
.gallery-experience.is-editing .gallery-viewpoint__actions { display: flex; }
.gallery-page .button--icon.gallery-edit-icon { width: 32px; min-width: 32px; height: 32px; min-height: 32px; flex-basis: 32px; border: 0; background: transparent; color: var(--color-muted); }
.gallery-page .button--icon.gallery-edit-icon[aria-busy=true] { width: auto; flex-basis: auto; padding-inline: var(--sp-2); }
.gallery-page .gallery-edit-icon .gallery-icon { width: 16px; height: 16px; }
.gallery-page .gallery-edit-icon--remove:hover { background: color-mix(in srgb, var(--color-error) 10%, transparent); color: var(--color-error); }
.gallery-tour-nav { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); }
.gallery-highlight-list { display: grid; gap: var(--sp-2); }
.gallery-highlight { position: relative; display: grid; gap: var(--sp-1); padding: var(--sp-4); border: 1px solid var(--color-border); border-radius: var(--r-3); background: var(--color-surface); }
.gallery-highlight__heading { display: flex; align-items: center; gap: var(--sp-2); }
.gallery-highlight__title { display: flex; align-items: center; flex: 1; min-width: 0; min-height: 32px; padding: 0; border: 0; background: transparent; color: var(--color-heading); text-align: left; font: 600 var(--type-14)/var(--lh-20) var(--font-body); cursor: pointer; }
.gallery-highlight__heading > .gallery-edit-icon { flex: 0 0 32px; }
.gallery-highlight__heading > .gallery-edit-icon[aria-busy=true] { flex: 0 0 auto; min-width: 32px; padding-inline: var(--sp-2); }
.gallery-highlight-status[aria-busy], #highlights[aria-busy=true] .gallery-highlight-status { color: var(--color-heading); font-weight: 600; }
#highlight-save[aria-busy=true]::after, #highlight-place[aria-busy=true]::after, #camera-path-save[aria-busy=true]::after, .gallery-highlight__pending::after {
  content: ""; display: inline-block; width: 0.7em; height: 0.7em; margin-left: 0.4em; border: 2px solid currentColor;
  border-right-color: transparent; border-radius: 50%; animation: gallery-spin 0.6s linear infinite; vertical-align: -0.1em;
}
@keyframes gallery-spin { to { transform: rotate(360deg); } }
.gallery-highlight p { white-space: pre-wrap; overflow-wrap: anywhere; }
.gallery-fold { display: block; }
.gallery-fold > summary { display: flex; align-items: center; gap: var(--sp-2); list-style: none; cursor: pointer; }
.gallery-fold > summary::-webkit-details-marker { display: none; }
.gallery-fold > summary > .gallery-icon { margin-left: auto; transition: transform var(--transition-fast); }
.gallery-fold[open] > summary > .gallery-icon { transform: rotate(180deg); }
.gallery-fold > summary .gallery-section__hint { display: none; }
/* Native details content is not a flex sibling of its summary. */
.gallery-fold[open] > form { margin-top: var(--sp-3); }
.gallery-manage-cover { display: block; width: min(200px,100%); aspect-ratio: 16/10; object-fit: contain; border-radius: var(--r-2); }
.gallery-danger { display: grid; gap: var(--sp-3); padding: var(--sp-4); border: 1px solid color-mix(in srgb,var(--color-error) 30%,transparent); border-radius: var(--r-3); }
.gallery-danger .button { justify-self: start; }
.gallery-storage { display: grid; gap: var(--sp-2); }
.gallery-quota { gap: var(--sp-3); }
.gallery-meter { position: relative; height: 6px; overflow: hidden; border-radius: var(--r-1); background: var(--gallery-track); }
.gallery-meter__used, .gallery-meter__scene { position: absolute; inset: 0 auto 0 0; min-width: 4px; border-radius: inherit; }
.gallery-meter__used { background: rgba(var(--color-primary-rgb), .35); }
.gallery-meter__scene, .gallery-quota .gallery-meter__used { background: var(--color-primary); }
.gallery-storage-legend { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-4); }
.gallery-storage-legend span { display: inline-flex; align-items: center; gap: var(--sp-1); font-size: var(--type-12); line-height: var(--lh-16); color: var(--color-muted); }
.gallery-storage-legend span::before { content: ''; width: 8px; height: 8px; border-radius: var(--r-1); background: var(--color-primary); }
.gallery-storage-legend span + span::before { opacity: .35; }
body.gallery-presenting { overflow: hidden; }
.gallery-presenting .gallery-scene__stage { position: fixed; inset: 0; z-index: 1500; height: 100dvh; }
.gallery-page--presenting .gallery-scene__topline { display: none; }
.gallery-contact { justify-self: start; width: fit-content; }

/* Share surfaces and copy controls. Copy control is inside the input boundary. */
.gallery-links { display: grid; gap: var(--sp-4); padding: 0; list-style: none; }
.gallery-link, .gallery-share-block { display: grid; gap: var(--sp-3); min-width: 0; }
.gallery-share-block + .gallery-share-block { padding-top: var(--sp-3); border-top: 1px solid var(--color-border); }
.gallery-share-block__heading { display: grid; gap: var(--sp-1); }
.gallery-share-hint { display: grid; grid-template-columns: auto 1fr; align-items: start; gap: var(--sp-2); padding: var(--sp-3); border: 1px solid var(--color-border); border-radius: var(--r-2); font-size: var(--type-13); line-height: var(--lh-20); color: var(--color-muted); }
.gallery-share-hint[hidden] { display: none; }
.gallery-share-hint > svg { width: 18px; height: 18px; color: var(--color-error); }
.gallery-share-hint > p { margin: 0; }
.gallery-share-hint > button { grid-column: 2; justify-self: start; }
.gallery-share-block > a.button { justify-self: start; width: auto; }
.gallery-link-create { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--sp-2); }
.gallery-link-create > select { flex: 1; min-width: 120px; width: auto; }
.gallery-link-create .button { min-height: 40px; }
.gallery-page .gallery-expiry { display: inline-block; text-transform: none; letter-spacing: normal; }
.gallery-expiry-field { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--sp-2); min-width: 0; }
.gallery-expiry-preview { display: block; flex: none; width: 32ch; min-height: 40px; line-height: 40px; margin: 0; white-space: nowrap; font-variant-numeric: tabular-nums; }
@media (max-width: 600px) {
  .gallery-page .gallery-expiry { max-width: 100%; white-space: normal; }
  .gallery-expiry-field { flex-direction: column; align-items: stretch; }
  .gallery-expiry-preview { max-width: 100%; }
}
.gallery-copy-row { position: relative; display: flex; min-width: 0; }
.gallery-page .gallery-copy-row > .form-control { width: 100%; min-height: 40px; padding-right: calc(var(--sp-6) + var(--sp-3)); background: var(--gallery-inset); border-radius: var(--r-2); color: var(--color-body); }
/* Copy geometry:32px button +4px right inset +8px text clearance =44px. */
.gallery-page .gallery-copy-row > .button--icon { position: absolute; right: var(--sp-1); top: 50%; transform: translateY(-50%); width: 32px; min-width: 32px; height: 32px; min-height: 32px; flex-basis: 32px; border: 0; background: transparent; border-radius: var(--r-2); }
/* Dual geometry:2×32px buttons +4px inset +4px gap +8px clearance =80px. */
.gallery-page .gallery-copy-row:has(> .button--icon + .button--icon) > .form-control { padding-right: calc(var(--sp-8) + var(--sp-4)); }
.gallery-page .gallery-copy-row > .button--icon:has(+ .button--icon) { right: calc(var(--sp-1) + 32px + var(--sp-1)); }
.gallery-page .gallery-copy-row > .button--icon .gallery-icon { width: 16px; height: 16px; }
.gallery-page .gallery-copy-row--multiline > .button--icon { top: var(--sp-1); transform: none; }
.gallery-page .gallery-copy-row > .button--icon:hover { background: var(--gallery-tint); }
.gallery-link__url, .gallery-token { min-width: 0; overflow-wrap: anywhere; user-select: all; }
.gallery-embed-code { resize: vertical; }
#share-compact { display: grid; gap: var(--sp-4); }
.gallery-code-copy { position: relative; min-width: 0; }
.gallery-code { max-width: 100%; overflow-x: auto; white-space: pre-wrap; overflow-wrap: anywhere; padding: var(--sp-4); border: 1px solid var(--color-border); border-radius: var(--r-2); background: var(--gallery-inset); font-size: var(--type-13); line-height: var(--lh-20); }
.gallery-code-copy .gallery-code { padding-right: var(--sp-8); }
.gallery-code code { padding: 0; background: transparent; white-space: inherit; }
.gallery-code-copy > .button--icon { position: absolute; top: var(--sp-2); right: var(--sp-2); border: 0; }

/* Dialogs keep the native top layer and focus behavior. */
.gallery-dialog { width: min(calc(100% - var(--sp-6)),544px); max-height: calc(100dvh - var(--sp-6)); padding: 0; border: 1px solid var(--color-border); border-radius: var(--r-3); background: rgb(var(--surface-rgb)); color: var(--color-heading); box-shadow: var(--shadow-surface); overflow: hidden; }
.gallery-dialog::backdrop { background: rgba(var(--shadow-rgb),.55); backdrop-filter: blur(8px); }
.gallery-dialog__header, .gallery-dialog__footer { display: flex; align-items: center; gap: var(--sp-2); padding: var(--sp-4) var(--sp-5); }
.gallery-dialog__header { justify-content: space-between; border-bottom: 1px solid var(--color-border); }
.gallery-dialog__header h2 { font-size: var(--type-15); line-height: var(--lh-24); overflow-wrap: anywhere; }
.gallery-dialog__body { display: grid; gap: var(--sp-4); min-width: 0; padding: var(--sp-4) var(--sp-5); overflow-y: auto; max-height: min(70dvh,calc(100dvh - 176px)); }
/* 176px reserves both dialog chrome rows and viewport margins. */
.gallery-dialog__footer { justify-content: flex-end; flex-wrap: wrap; border-top: 1px solid var(--color-border); }
.gallery-cover-editor { width: min(calc(100% - var(--sp-6)),688px); }
.gallery-cover-editor .gallery-dialog__body { grid-auto-rows: max-content; }
.gallery-cover-editor__row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); }
.gallery-cover-editor__row .button { min-height: 40px; }
.gallery-cover-editor__stage { position: relative; display: grid; place-items: center; width: 100%; max-width: 640px; aspect-ratio: 16/10; overflow: hidden; background: var(--gallery-cover); border: 1px solid var(--color-border); border-radius: var(--r-2); }
.gallery-cover-editor__stage :is(canvas,img) { display: block; width: 100%; height: 100%; object-fit: contain; }
.gallery-cover-editor__stage canvas { touch-action: none; cursor: grab; }
.gallery-cover-editor__stage canvas:active { cursor: grabbing; }
.gallery-cover-editor input[type=range] { flex: 1; min-width: 80px; }
.gallery-placeholder { display: grid; place-items: center; color: var(--gallery-cover-icon); }
.gallery-placeholder .gallery-icon { width: 24px; height: 24px; }
.gallery-export { width: min(calc(100% - var(--sp-6)),832px); }
.gallery-export__fields { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--sp-4); }
#export-preview { width: 100%; max-height: 45vh; object-fit: contain; border-radius: var(--r-2); background: var(--gallery-stage); }
.gallery-toast { position: fixed; z-index: 2147483647; top: auto; right: auto; bottom: var(--sp-5); left: var(--sp-5); display: flex; align-items: center; gap: var(--sp-2); margin: 0; padding: var(--sp-3) var(--sp-4); width: max-content; max-width: min(360px,calc(100vw - var(--sp-7))); border: 1px solid var(--color-border); border-radius: var(--r-2); background: var(--color-surface-strong); color: var(--color-heading); box-shadow: var(--shadow-card); font: 400 var(--type-14)/var(--lh-20) var(--font-body); transform: translateY(var(--sp-2)); opacity: 0; pointer-events: none; transition: opacity .15s,transform .15s; }
.gallery-toast.is-visible { opacity: 1; transform: translateY(0); }
.gallery-toast[data-tone=error] > .gallery-icon { color: var(--color-error); }
.gallery-toast[data-tone=success] > .gallery-icon { color: var(--gallery-ink); }
.gallery-qr-dialog { width:min(360px,calc(100% - var(--sp-6))); }
.gallery-qr-dialog .gallery-dialog__body { display:grid; justify-items:center; text-align:center; }
.gallery-qr-image { display:block; width:min(264px,70vw); height:auto; aspect-ratio:1; border:8px solid #fff; border-radius:var(--r-2); background:#fff; image-rendering:pixelated; }

/* Projects, settings, connection and audience reports. */
.gallery-project-editor, .gallery-connect { display: grid; grid-template-columns: minmax(0,7fr) minmax(0,5fr); gap: var(--sp-6); align-items: start; }
.gallery-project-editor > #collection-form { grid-column: 1; grid-row: 1; }
.gallery-project-editor > .gallery-project-sharing { grid-column: 2; grid-row: 1; }
.gallery-project-editor > .gallery-danger { grid-column: 1; grid-row: 2; }
#collection-scenes { display: grid; gap: var(--sp-2); }
.gallery-project-choice { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); padding: var(--sp-3) var(--sp-4); border: 1px solid var(--color-border); border-radius: var(--r-2); background: var(--color-surface); }
.gallery-project-choice label { display: flex; align-items: center; gap: var(--sp-2); min-width: 0; min-height: 44px; overflow-wrap: anywhere; cursor: pointer; }
.gallery-project-choice > div { display: flex; flex: none; gap: var(--sp-2); }
.gallery-project-sharing > .button { justify-self: start; }
.gallery-project-sharing .gallery-form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--sp-2); }
.gallery-project-sharing .gallery-form > .gallery-field { flex: 1 1 130px; }
.gallery-project-sharing .gallery-form .button { min-height: 40px; }
.gallery-project-hero { position: relative; margin-bottom: var(--sp-6); display: grid; align-items: end; min-height: 336px; overflow: hidden; padding: var(--sp-7); border-radius: var(--r-3); background: var(--gallery-stage); color: white; }
.gallery-project-cover { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .35; }
.gallery-project-hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg,rgb(0 0 0 / 15%),rgb(0 0 0 / 75%)); pointer-events: none; }
.gallery-project-hero > div { position: relative; z-index: 1; display: grid; gap: var(--sp-3); max-width: 45rem; }
.gallery-project-hero h1 { color: white; font: 700 var(--type-54)/var(--lh-60) var(--font-display); letter-spacing: -.04em; overflow-wrap: anywhere; }
.gallery-project-hero p { white-space: pre-wrap; }
.gallery-project-hero ~ .gallery-grid .gallery-card__body p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 40px; }
.gallery-project-nav { display: grid; gap: var(--sp-2); padding-bottom: var(--sp-4); border-bottom: 1px solid var(--color-border); }
.gallery-project-nav > div { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.gallery-instructions { display: grid; gap: var(--sp-4); padding-left: var(--sp-5); }
.gallery-instructions .gallery-code-copy { margin-block: var(--sp-3); }
.gallery-pending { display: grid; gap: var(--sp-3); padding: 0; list-style: none; }
.gallery-pending li { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--sp-3); padding-top: var(--sp-3); border-top: 1px solid var(--color-border); }
.gallery-analytics { display: grid; gap: var(--sp-6); }
.gallery-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--sp-4); }
.gallery-metrics strong { font-size: var(--type-36); line-height: var(--lh-44); }
.gallery-analytics-filter { display: contents; }
.gallery-analytics-filter > label { grid-column: 2; grid-row: var(--hero-eyebrow-row); justify-self: end; }
.gallery-analytics-filter > .gallery-inline-actions { grid-column: 2; grid-row: var(--hero-title-row); justify-self: end; align-self: baseline; }
.gallery-analytics-filter .gallery-inline-actions { flex-wrap: nowrap; }
.gallery-analytics-filter .button { min-height: 40px; }
.gallery-analytics-bar { display: flex; align-items: center; gap: var(--sp-3); }
.gallery-analytics-bar time { width: 64px; flex: none; font-size: var(--type-13); line-height: var(--lh-20); }
.gallery-analytics-bar > span { flex: 1; border-radius: var(--r-1); overflow: hidden; background: var(--gallery-track); }
.gallery-analytics-bar i { display: block; height: 24px; width: var(--bar); background: var(--color-primary); }
.gallery-analytics-bar strong { min-width: 32px; font-size: var(--type-13); line-height: var(--lh-20); font-variant-numeric: tabular-nums; }
.gallery-table-scroll { overflow: auto; }
.gallery-analytics table { width: 100%; border-collapse: collapse; text-align: left; font-size: var(--type-13); line-height: var(--lh-20); }
.gallery-analytics :is(th,td) { padding: var(--sp-4) var(--sp-3); border-bottom: 1px solid var(--color-border); }
.gallery-analytics thead { color: var(--color-muted); }

/* Branded viewer and click-to-load embed. Dock clearance64+24 is geometry. */
.gallery-brand-header { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4); min-height: 64px; padding: var(--sp-4) var(--sp-5); border-bottom: 1px solid var(--color-border); background: var(--color-surface); }
.gallery-brand-identity { display: inline-flex; align-items: center; gap: var(--sp-3); color: var(--color-heading); font: 600 var(--type-16)/var(--lh-24) var(--font-display); text-decoration: none; }
.gallery-brand-identity img { width: auto; max-width: 120px; height: 40px; object-fit: contain; border-radius: var(--r-1); }
.gallery-embed { margin: 0; background: var(--gallery-stage); }
.gallery-embed__layout { display: block; position: relative; height: 100dvh; }
.gallery-embed__stage { position: relative; width: 100%; height: 100%; }
.gallery-embed__stage .gallery-viewer { position: absolute; inset: 0; width: 100%; height: 100%; }
.gallery-embed__poster { position: absolute; inset: 0; display: grid; place-items: center; padding: var(--sp-6); overflow: hidden; text-align: left; background: var(--gallery-stage); }
.gallery-embed__poster > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .45; filter: blur(8px); }
.gallery-embed__poster > div { position: relative; display: grid; justify-items: start; gap: var(--sp-3); max-width: 36rem; }
.gallery-embed__poster h1 { font: 700 var(--type-36)/var(--lh-44) var(--font-display); color: white; }
.gallery-embed__status { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: max-content; max-width: calc(100% - var(--sp-7)); padding: var(--sp-3) var(--sp-4); border: 1px solid var(--color-border); border-radius: var(--r-2); color: var(--color-heading); background: var(--color-surface-strong); }
#embed-retry { position: absolute; bottom: var(--sp-5); left: var(--sp-5); }
.gallery-embed__views { position: absolute; bottom: calc(var(--sp-8) + var(--sp-5)); left: var(--sp-4); max-width: calc(100% - var(--sp-6)); padding: var(--sp-2); border: 1px solid var(--color-border); border-radius: var(--r-3); background: var(--color-surface-strong); }
.gallery-embed__views .gallery-experience { padding: 0; border: 0; }
.gallery-embed__views .gallery-viewpoints { display: flex; overflow-x: auto; max-width: 420px; gap: var(--sp-2); }
.gallery-embed__views .gallery-viewpoint { flex: 0 0 96px; }
.gallery-embed__views .gallery-viewpoint__select span, .gallery-embed__views .gallery-tour-nav, .gallery-embed__views #view-share-open { display: none !important; }
@media (max-width:700px), (max-height:500px) and (pointer:coarse) {
  .gallery-embed__views { display: none !important; }
}

/* Responsive alignment retains intrinsic content rather than compressing labels. */
@media (min-width:1200px) {
  .gallery-scene { grid-template-columns: minmax(0,1fr) clamp(360px,29vw,464px); height: calc(100dvh - var(--nav-height)); min-height: 560px; }
  .gallery-scene__stage { height: auto; }
  .gallery-scene__panel { height: 100%; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
}
@media (max-width:1000px) { .gallery-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width:900px) {
  .gallery-header, .gallery-project-editor, .gallery-connect { grid-template-columns: minmax(0,1fr); }
  .gallery-project-editor > :is(#collection-form,.gallery-project-sharing,.gallery-danger) { grid-column: 1; grid-row: auto; }
  .gallery-header:not(.gallery-header--library) > div > :is(.eyebrow,.page-hero__title,.page-hero__lead,p:not(.eyebrow),a:first-child), .gallery-header > .button, .gallery-header:not(.gallery-header--library) .gallery-header__actions, .gallery-header .gallery-quota, .gallery-analytics-filter > :is(label,.gallery-inline-actions) { grid-column: 1; grid-row: auto; }
  .gallery-header:not(.gallery-header--library) .gallery-quota { order: 1; }
  .gallery-header:not(.gallery-header--library) .gallery-header__actions { justify-content: flex-end; padding-top: var(--sp-3); }
  .gallery-header--library .gallery-header__side { padding-top: 0; }
  .gallery-header--library .gallery-header__actions { justify-content: stretch; }
  .gallery-header--library .gallery-header__actions .button { flex: 1 1 auto; }
  .gallery-scene__stage { height: min(72vw,480px); min-height: 0; }
}
@media (max-width:600px) {
  .gallery-page .site-main { padding-block: var(--sp-6); }
  .gallery-page--scene .site-main { padding: 0; }
  .gallery-page .page-hero__title, .gallery-project-hero h1 { font-size: var(--type-36); line-height: var(--lh-44); }
  .gallery-scene__title { font-size: var(--type-22); line-height: var(--lh-32); }
  .gallery-grid, .gallery-export__fields { grid-template-columns: minmax(0,1fr); }
  .gallery-page .button, .gallery-page .button--small { min-height: 44px; }
  .gallery-page .button--icon { width: 44px; height: 44px; min-width: 44px; min-height: 44px; flex: 0 0 44px; }
  .gallery-page .button--icon.gallery-edit-icon { width: 44px; min-width: 44px; height: 44px; min-height: 44px; flex-basis: 44px; }
  .gallery-page .gallery-copy-row > .button--icon { width: 44px; min-width: 44px; height: 44px; min-height: 44px; flex-basis: 44px; }
  .gallery-page .gallery-copy-row > .form-control { min-height: 44px; padding-right: calc(var(--sp-8) + var(--sp-2)); }
  /* 2×44px targets +4px inset +4px gap +8px clearance. */
  .gallery-page .gallery-copy-row:has(> .button--icon + .button--icon) > .form-control { padding-right: 104px; }
  .gallery-page .gallery-copy-row > .button--icon:has(+ .button--icon) { right: calc(var(--sp-1) + 44px + var(--sp-1)); }
  .gallery-subnav a { min-height: 44px; }
  .gallery-segmented { height: auto; min-height: 44px; flex-wrap: wrap; }
  .gallery-segmented :is(button,a) { min-height: 44px; min-width: 44px; padding: 0 var(--sp-3); }
  .gallery-toolbar .gallery-segmented { height: auto; min-height: 44px; }
  .gallery-toolbar .gallery-search { flex-basis: 100%; }
  .gallery-toolbar { gap: var(--sp-2); }
  .gallery-toolbar__end { margin-inline-start: 0; min-height: 44px; }
  .gallery-card__actions { flex: 1 1 100%; flex-wrap: wrap; justify-content: flex-start; }
  .gallery-page .gallery-card__actions .button:not(.button--icon) { flex: 0 0 auto; min-width: 44px; }
  .gallery-page :where(.form-control,.gallery-search input,.gallery-form input:not([type=checkbox]):not([type=color]):not([type=file]):not([type=range]),.gallery-form textarea,.gallery-form select,#analytics-days) { font-size: var(--type-16); line-height: var(--lh-24); min-height: 44px; }
  .gallery-page .gallery-search input { height: 44px; }
  .gallery-scene__back, .gallery-highlight__title { min-height: 44px; }
  .gallery-scene__action-row .button, .gallery-link-create .button, .gallery-cover-editor__row .button, .gallery-analytics-filter .button, .gallery-project-sharing .gallery-form .button { min-height: 44px; }
  .gallery-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .gallery-project-hero { padding: var(--sp-5); }
  .gallery-brand-header > .panel__submeta { display: none; }
  .gallery-experience__heading > :first-child { flex-basis: 100%; }
  .gallery-experience__heading { justify-content: flex-end; }
  .gallery-grid[data-layout=list] :is(.gallery-upload-row,.gallery-card--interrupted) { grid-template-columns: 64px minmax(0,1fr); }
}
/* One keyboard focus treatment, including hidden native swatch/file controls. */
.gallery-page :focus-visible { outline: 2px solid var(--gallery-ink); outline-offset: 2px; box-shadow: none; }
.gallery-cover-editor__stage:has(canvas:focus-visible), .gallery-swatch:has(:focus-visible), .gallery-file:has(input:focus-visible) .button { outline: 2px solid var(--gallery-ink); outline-offset: 2px; }
@media (prefers-reduced-motion:reduce) { .gallery-page *, .gallery-page *::before, .gallery-page *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }

.gallery-transfer-popup { position: fixed; right: max(var(--sp-4), env(safe-area-inset-right, 0px)); bottom: max(var(--sp-4), env(safe-area-inset-bottom, 0px)); z-index: 150; width: min(370px, calc(100vw - var(--sp-8) - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px))); max-height: min(65vh, 600px); overflow: auto; padding: var(--sp-4); background: rgb(var(--surface-rgb)); color: var(--color-heading); border: 1px solid var(--color-border); border-radius: var(--r-3); box-shadow: var(--shadow-surface); }
.gallery-transfer-popup[hidden], .gallery-transfer-popup [hidden] { display: none; }
.gallery-transfer-popup__header { display: flex; justify-content: space-between; align-items: center; gap: var(--sp-3); }
.gallery-transfer-popup__header .button { min-height: 44px; }
.gallery-transfer-popup__item { display: grid; gap: var(--sp-2); padding-top: var(--sp-3); margin-top: var(--sp-3); border-top: 1px solid var(--color-border); overflow-wrap: anywhere; }
.gallery-transfer-popup__item p { margin: 0; }
.gallery-transfer-popup__item progress { width: 100%; height: 8px; accent-color: var(--gallery-ink); }
.gallery-transfer-popup__item small { color: var(--color-muted); }
.gallery-transfer-popup a { color: var(--gallery-ink); }
.gallery-transfer-popup :focus-visible { outline: 2px solid var(--gallery-ink); outline-offset: 2px; }
.gallery-transfer-popup__footer { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); margin-top: var(--sp-3); padding-top: var(--sp-3); border-top: 1px solid var(--color-border); }
.gallery-transfer-popup__footer .button { min-height: 44px; }
@media (max-width:600px) {
  .gallery-transfer-popup { left: max(var(--sp-3), env(safe-area-inset-left, 0px)); right: max(var(--sp-3), env(safe-area-inset-right, 0px)); width: auto; }
}

.gallery-download-options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--sp-5); align-items: start; }
.gallery-download-options .panel { display: grid; gap: var(--sp-4); min-width: 0; }
.gallery-download-options .button { justify-self: start; }
.gallery-payload-downloads { display: grid; gap: var(--sp-3); list-style: none; padding: 0; margin: 0; }
.gallery-payload-downloads li { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-3); }
.gallery-page .errorlist { margin: 0; padding: 0; list-style: none; color: var(--color-error); font-size: var(--type-13); line-height: var(--lh-20); }
.gallery-settings-dialog .gallery-form { max-width: none; gap: var(--sp-4); }
.gallery-settings-dialog .gallery-form > .release-card__actions { display: none; }
.gallery-settings-dialog [data-settings-save-status] { display: grid; gap: var(--sp-2); }
.gallery-settings-dialog [data-settings-save-status] .button { justify-self: start; min-height: 44px; }
.gallery-settings-dialog [data-settings-save] { min-height: 44px; }
.gallery-download-dialog { width: min(calc(100% - var(--sp-6)), 420px); }
.gallery-download-choices { display: grid; gap: var(--sp-3); }
.gallery-download-choice { display: grid; gap: var(--sp-1); min-width: 0; }
.gallery-download-option { justify-self: stretch; min-height: 44px; }
.gallery-download-dialog .gallery-section__title { margin-top: var(--sp-2); }
@media (max-width: 700px) {
  .gallery-download-options { grid-template-columns: 1fr; }
  .gallery-download-dialog, .gallery-settings-dialog { width: calc(100% - var(--sp-4)); max-width: none; }
}

/* R22/R30/R38: labelled templates, touch targets, and modeless options. */
.lf-template-chooser { display:flex; gap:8px; overflow-x:auto; padding:8px 0; }
.lf-template-card { flex:0 0 150px; min-height:72px; display:flex; flex-direction:column; white-space:normal; }
.lf-template-card small { font-weight:400; }
.lf-template-options { display:flex; gap:16px; align-items:center; flex-wrap:wrap; }
.lf-template-options label { display:flex; align-items:center; gap:8px; }
.lf-hold-bar { position:absolute; top:50%; height:8px; border-radius:4px; background:var(--lf-tint); pointer-events:none; }
#camera-path-timeline { position:relative; }
#camera-path-keys.has-overflow { mask-image:linear-gradient(to right,#000 94%,transparent); }
.lf-view-differs { position:relative; box-shadow:0 0 0 2px var(--warning, #b7791f); }
.lf-view-differs::before { content:''; position:absolute; top:5px; right:5px; width:7px; height:7px; border-radius:50%; background:var(--warning, #b7791f); }
#camera-path-more { display:none; }
#camera-path-more-menu { position:absolute; z-index:12; bottom:100%; right:0; max-height:60vh; overflow:auto; background:var(--color-surface); border:1px solid var(--color-border); padding:8px; }
#camera-path-more-menu button { display:flex; min-height:44px; width:100%; }
@media(max-width:719px) {
  .lf-track-editor [aria-label="Track authoring"] > .lf-track-editor__group:not(:first-child),
  .lf-track-editor [aria-label="Track authoring"] > .lf-track-editor__settings,
  #camera-path-duplicate-key, #camera-path-redo, #camera-path-hold { display:none; }
  #camera-path-more { display:flex; }
}
@media(max-width:719px) and (pointer:coarse) {
  #camera-path-add-key,#camera-path-delete-key,#camera-path-undo,#camera-path-more { flex-direction:column; width:auto; }
  #camera-path-add-key::after { content:'Add / Update'; }
  #camera-path-delete-key::after { content:'Delete'; }
  #camera-path-undo::after { content:'Undo'; }
  #camera-path-more::after { content:'More'; }
}
.gallery-inline-editor { width:100%; min-width:0; border:1px solid var(--color-border); border-radius:8px; padding:12px; background:var(--color-surface); }
.gallery-inline-editor button { min-height:44px; }
.gallery-inline-editor .gallery-dialog__body { padding:0; }
.gallery-inline-editor .gallery-dialog__footer { flex-wrap:wrap; padding:8px 0 0; gap:8px; }

/* R43: fixed card slots; hover signals navigation without adding controls. */
.gallery-card { position:relative; }
.gallery-card__link { display:block; color:inherit; text-decoration:none; transition:transform .15s; }
.gallery-card__link:hover { transform:translateY(-2px); }
.gallery-card__link:hover h2 { text-decoration:underline; }
.gallery-card__link:focus-visible { outline:2px solid var(--color-primary); outline-offset:2px; }
.gallery-card__link .gallery-card__image { aspect-ratio:16/10; }
.gallery-card > .gallery-card__actions { position:absolute; right:8px; bottom:8px; }
.gallery-card__link .gallery-card__footer { padding-right:44px; }
/* The cover action is a separate link above the cover, never nested in the scene link. */
.gallery-card__cover-action { position:absolute; z-index:2; top:0; left:0; width:100%; aspect-ratio:16/10; display:grid; place-items:center; box-sizing:border-box; padding-top:64px; pointer-events:none; }
.gallery-grid:not([data-layout=list]) .gallery-card__add-cover { color:var(--gallery-cover-ink); }
.gallery-page .gallery-card__add-cover { pointer-events:auto; position:relative; min-height:44px; white-space:nowrap; }
.gallery-card:has(.gallery-card__cover-action) .gallery-card__placeholder { padding-bottom:44px; box-sizing:border-box; }
.gallery-card__meta { display:flex; flex-direction:column; gap:var(--sp-3); min-width:0; }
.gallery-card__visibility { order:-1; align-self:flex-start; }
.gallery-card__heading { align-items:flex-start; flex-direction:column; }
.gallery-card .gallery-menu button,.gallery-card .gallery-menu a { min-height:44px; }

/* Scene list: the whole-card link owns the content grid; the menu stays outside it. */
.gallery-grid[data-layout=list] { grid-template-columns:minmax(0,1fr); gap:var(--sp-3); }
.gallery-grid[data-layout=list] .gallery-card[data-scene-id] { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:var(--sp-3); padding:0 var(--sp-3) 0 0; }
.gallery-grid[data-layout=list] .gallery-card__link { display:grid; grid-column:1; grid-row:1; grid-template-columns:96px minmax(0,1fr) auto auto auto auto; align-items:center; gap:var(--sp-3); padding:var(--sp-3); min-width:0; }
.gallery-grid[data-layout=list] .gallery-card__link:hover { transform:none; text-decoration:none; }
.gallery-grid[data-layout=list] .gallery-card[data-scene-id]:hover { box-shadow:none; }
@media (min-width:901px) {
  .gallery-grid[data-layout=list] .gallery-card__link :is(.gallery-card__body,.gallery-card__heading,.gallery-card__meta,.gallery-card__footer,.gallery-card__footer > p) { display:contents; }
}
.gallery-grid[data-layout=list] .gallery-card__image { grid-column:1; grid-row:1; width:96px; height:60px; aspect-ratio:auto; border-radius:var(--r-2); }
.gallery-grid[data-layout=list] .gallery-card__placeholder { aspect-ratio:auto; padding:0; }
.gallery-grid[data-layout=list] .gallery-card__placeholder small { display:none; }
.gallery-grid[data-layout=list] .gallery-card__link h2 { grid-column:2; grid-row:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gallery-grid[data-layout=list] .gallery-card__list-format { display:inline-flex; grid-column:3; grid-row:1; }
.gallery-grid[data-layout=list] .gallery-card__size { grid-column:4; grid-row:1; white-space:nowrap; }
.gallery-grid[data-layout=list] .gallery-card__date { grid-column:5; grid-row:1; white-space:nowrap; }
.gallery-grid[data-layout=list] .gallery-card__visibility { grid-column:6; grid-row:1; order:initial; align-self:center; white-space:nowrap; }
.gallery-grid[data-layout=list] .gallery-card__format { display:none; }
.gallery-grid[data-layout=list] .gallery-card__size::before, .gallery-grid[data-layout=list] .gallery-card__date::before, .gallery-grid[data-layout=list] .gallery-card__visibility::before { content:'· '; white-space:pre; }
.gallery-grid[data-layout=list] .gallery-card > .gallery-card__actions { position:static; grid-column:2; grid-row:1; width:44px; justify-self:end; flex-wrap:nowrap; }
.gallery-grid[data-layout=list] .gallery-scene__owner { grid-column:2; grid-row:1; align-self:end; min-width:0; flex-wrap:nowrap; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.gallery-grid[data-layout=list] .gallery-scene__owner > span:last-child { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.gallery-grid[data-layout=list] .gallery-card:has(.gallery-scene__owner) h2 { align-self:start; }
.gallery-grid[data-layout=list] .gallery-card__cover-action { display:contents; }
.gallery-grid[data-layout=list] .gallery-card__add-cover { grid-column:1; grid-row:1; align-self:end; justify-self:start; margin:0 0 var(--sp-3) calc(96px + 2 * var(--sp-3)); z-index:2; padding:0 var(--sp-2); font-size:var(--type-12); }
.gallery-grid[data-layout=list] .gallery-card:has(.gallery-card__add-cover) h2 { margin-bottom:44px; }
.gallery-grid[data-layout=list] .gallery-menu [role=menu], .gallery-grid[data-layout=list] .gallery-menu [role=menu][data-placement=above] { position:fixed; top:var(--gallery-menu-top); left:var(--gallery-menu-left); bottom:auto; right:auto; }
@media (max-width:900px) {
  /* Width alone selects the mobile layout; only metadata wrappers stay flattened. */
  .gallery-grid[data-layout=list] .gallery-card__link :is(.gallery-card__footer,.gallery-card__footer > p) { display:contents; }
  .gallery-grid[data-layout=list] .gallery-card[data-scene-id] { grid-template-columns:minmax(0,1fr) 44px; }
  .gallery-grid[data-layout=list] .gallery-card__link { grid-template-columns:64px minmax(0,1fr); grid-template-rows:auto; gap:8px; }
  .gallery-grid[data-layout=list] .gallery-card__image { grid-row:1; width:64px; height:60px; }
  /* Outrank desktop flattening. Content must size its row even beside a fixed-height poster; the title cannot flex-shrink away on resize. */
  .gallery-grid[data-layout=list] .gallery-card[data-scene-id] .gallery-card__link > .gallery-card__body { display:flex; flex-direction:column; grid-column:2; grid-row:1; width:100%; min-width:0; min-height:min-content; align-self:start; gap:4px; padding:0; }
  .gallery-grid[data-layout=list] .gallery-card__link > .gallery-card__body > .gallery-card__heading { display:block; flex:none; width:100%; min-width:0; min-height:var(--lh-24); }
  .gallery-grid[data-layout=list] .gallery-card__link > .gallery-card__body > .gallery-card__heading > h2 { display:block; visibility:visible; width:100%; min-width:0; min-height:var(--lh-24); margin:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .gallery-grid[data-layout=list] .gallery-card__link > .gallery-card__body > .gallery-card__meta { display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; gap:4px 8px; min-width:0; max-width:100%; white-space:normal; font-size:var(--type-12); line-height:var(--lh-20); }
  .gallery-grid[data-layout=list] .gallery-card__meta :is(.gallery-card__list-format,.gallery-card__size,.gallery-card__date,.gallery-card__visibility) { min-width:0; max-width:100%; overflow:hidden; text-overflow:ellipsis; }
  .gallery-grid[data-layout=list] .gallery-card__visibility { display:inline-flex; }
  .gallery-grid[data-layout=list] .gallery-card__link .gallery-card__footer > p { font-size:inherit; }
  .gallery-grid[data-layout=list] .gallery-card__actions { align-self:center; }
  /* Reserve the last content row for the independent cover link, without nesting links. */
  .gallery-grid[data-layout=list] .gallery-card:has(.gallery-card__add-cover) .gallery-card__body::after { content:''; height:44px; flex:none; }
  .gallery-grid[data-layout=list] .gallery-card__add-cover { margin:0 0 var(--sp-3) 84px; }
}
@media(max-width:600px) {
  .gallery-grid[data-layout=list] .gallery-card[data-scene-id] { gap:4px; padding-right:4px; }
  .gallery-grid[data-layout=list] .gallery-card__link { padding:4px 8px; }
  .gallery-grid[data-layout=list] .gallery-card__add-cover { margin:0 0 4px 80px; }
  .gallery-grid[data-layout=list] .gallery-card__size::before, .gallery-grid[data-layout=list] .gallery-card__date::before, .gallery-grid[data-layout=list] .gallery-card__visibility::before { content:none; }
}

.gallery-focus-tooltip { position:fixed; z-index:10000; max-width:calc(100vw - 16px); padding:8px 12px; border:1px solid var(--color-border); border-radius:6px; background:var(--color-surface); color:var(--color-heading); box-shadow:var(--shadow-card); }
.gallery-focus-tooltip kbd { border:1px solid currentColor; border-radius:4px; padding:1px 4px; margin-left:8px; }
@media(max-width:719px) {
 .lf-track-editor [aria-label="Track authoring"] > .lf-track-editor__settings:has(#camera-path-settings-panel:not([hidden])) { display:block; position:absolute; right:8px; }
 .lf-track-editor [aria-label="Track authoring"] > .lf-track-editor__settings > button { display:none; }
}

.gallery-viewpoint--editing, .gallery-viewpoint:has(.gallery-inline-editor:not([hidden])) { grid-column:1 / -1; }
.gallery-viewpoint--editing > img { width:100%; max-height:180px; object-fit:cover; }

/* R28/R38: compact owner rows distinguish navigation from editing. */
.gallery-highlight-row { display:flex; align-items:center; gap:8px; min-width:0; }
.gallery-highlight-row__select { flex:1; min-width:0; min-height:44px; justify-content:flex-start; text-align:left; overflow-wrap:anywhere; }
.gallery-highlight-row .button--icon { flex:0 0 44px; width:44px; height:44px; }
#highlight-empty .gallery-icon { vertical-align:middle; }