/* Forms */
.edit-form { max-width: var(--cms-form-max-width); }
.form-stack { display: grid; gap: var(--cms-form-stack-gap); }
.form-section__title {
  margin: 0; padding: var(--cms-form-section-title-padding); border-bottom: 0;
  color: var(--cms-form-section-title-color, var(--cms-section-title-color, var(--color-text)));
  font-family: var(--font-condensed); font-size: var(--cms-font-size-md);
  font-weight: 700; letter-spacing: var(--cms-form-section-title-letter-spacing); line-height: 1; text-transform: uppercase;
}
.form-section__description { margin-top: .4rem; }
.form-grid {
  display: grid; grid-template-columns: var(--cms-form-grid-columns);
  gap: var(--cms-form-grid-gap); padding: var(--cms-form-grid-padding);
}
.cms-form-grid {
  display: grid; grid-template-columns: var(--cms-form-grid-columns);
  gap: var(--cms-form-grid-gap);
}
.cms-form-card {
  padding: var(--cms-form-card-padding); border: 1px solid var(--cms-card-border-subtle);
  border-radius: var(--radius-md); background: var(--cms-card-muted-bg);
}
.cms-form-row { display: grid; gap: var(--cms-form-row-gap); }
.cms-form-panel {
  display: grid; gap: var(--cms-form-panel-gap); padding: var(--cms-form-panel-padding);
  border: 1px solid var(--cms-card-border-subtle); border-radius: var(--radius-md);
  background: var(--cms-card-muted-bg);
}
.cms-form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cms-form-action-gap); }
.cms-density-compact {
  --cms-form-grid-gap: var(--cms-space-3);
  --cms-form-grid-padding: .55rem var(--cms-space-3) var(--cms-space-3);
  --cms-field-padding: var(--cms-field-padding-compact);
}
.field { position: relative; min-width: 0; grid-column: 1 / -1; }
.field--half { grid-column: span 1; }
.field--full { grid-column: 1 / -1; }
.field-label-row, .field-heading { min-width: 0; display: flex; align-items: center; gap: var(--cms-field-label-gap); margin-bottom: var(--cms-field-label-margin); }
.field-label-row { min-height: var(--cms-field-label-row-height); }
.field-label-row .help-popover, .field-heading .help-popover { flex: none; margin-left: 0; }
.field-label-row .help-popover__panel, .field-heading .help-popover__panel { left: -.35rem; right: auto; }
.field-label-actions,
.cms-field-actions {
  margin-left: auto; display: inline-flex; align-items: center; justify-content: flex-end; gap: var(--cms-field-label-gap);
  min-width: 0;
}
.field > label, .field-label-row > label, .field-heading > span {
  min-width: 0; display: block; color: var(--cms-field-label-color); font-size: var(--cms-field-label-font-size); font-weight: var(--cms-field-label-font-weight);
  line-height: 1.25; overflow-wrap: anywhere;
}
.field--program-source {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: var(--cms-field-label-gap);
}
.field--program-source .field-label-row,
.field--program-source .field-help,
.field--program-source .field-error {
  grid-column: 1 / -1;
}
.field--program-source select { min-width: 0; }
.field--program-source .field-inline-action {
  height: var(--cms-field-control-height); min-height: var(--cms-field-control-height); padding-inline: var(--cms-field-inline-action-padding); white-space: nowrap;
}
.field-help { margin: var(--cms-field-help-margin); color: var(--cms-field-help-color); font-size: var(--cms-font-size-sm); }
.field-counter {
  display: block; margin-top: var(--cms-field-counter-margin); color: var(--cms-field-help-color);
  font-family: var(--font-condensed); font-size: var(--cms-font-size-2xs); letter-spacing: .05em; text-align: right;
}
.field-counter.is-near-limit { color: var(--color-muted); }
.field-counter.is-over-limit { color: var(--color-danger); }
.required-mark { color: var(--color-accent); }
input[type="text"], input[type="url"], input[type="email"], input[type="number"], input[type="datetime-local"], input[type="date"], input[type="time"], input[type="password"], input[type="search"], select, textarea {
  box-sizing: border-box; width: 100%; min-height: var(--cms-field-control-height); padding: var(--cms-field-padding);
  border: 1px solid var(--cms-field-border); border-radius: var(--radius-sm);
  background: var(--cms-field-bg); color: var(--color-text); font-size: var(--cms-font-size-md);
  transition: border var(--motion-control), box-shadow var(--motion-control), background var(--motion-control);
}
input[type="text"], input[type="url"], input[type="email"], input[type="number"], input[type="datetime-local"], input[type="date"], input[type="time"], input[type="password"], input[type="search"], select {
  height: var(--cms-field-control-height);
}
input[type="text"]:hover, input[type="url"]:hover, input[type="email"]:hover, input[type="number"]:hover, input[type="datetime-local"]:hover, input[type="date"]:hover, input[type="time"]:hover, input[type="password"]:hover, input[type="search"]:hover, select:hover, textarea:hover {
  border-color: var(--cms-field-hover-border);
}
textarea { min-height: var(--cms-field-textarea-min-height); resize: vertical; }
.datetime-control { display: flex; align-items: stretch; gap: 0; }
.datetime-control:focus-within {
  border-radius: var(--radius-sm); box-shadow: var(--cms-focus-ring);
}
.datetime-control:hover input[type="date"],
.datetime-control:hover input[type="time"],
.datetime-control:focus-within input[type="date"],
.datetime-control:focus-within input[type="time"] {
  border-color: var(--cms-field-hover-border);
}
.datetime-control:focus-within input[type="date"],
.datetime-control:focus-within input[type="time"] {
  background: var(--cms-field-focus-bg); border-color: var(--cms-field-focus-border);
}
.datetime-control input[type="date"] {
  flex: 1 1 auto; min-width: 0; border-top-right-radius: 0; border-bottom-right-radius: 0;
}
.datetime-control input[type="time"] {
  flex: 0 0 var(--cms-field-datetime-time-width); width: var(--cms-field-datetime-time-width); margin-left: -1px; border-top-left-radius: 0; border-bottom-left-radius: 0;
}
.datetime-control input[type="date"]:hover + input[type="time"],
.datetime-control input[type="date"]:focus + input[type="time"] {
  border-left-color: var(--cms-field-hover-border);
}
/* An unfilled date/time still shows its native "dd/mm/yyyy" hint: mute it so a
   filled field reads as a value, not as a format reminder. See fields.js. */
.datetime-control input.is-unset { color: var(--color-faint); }
.datetime-control__clear {
  width: var(--cms-object-list-delete-width); min-height: var(--cms-field-control-height); margin-left: var(--cms-field-label-gap); display: grid; place-items: center; flex: 0 0 auto;
  padding: 0; border: 1px solid transparent; border-radius: var(--radius-sm); background: transparent;
  color: var(--color-faint); cursor: pointer; opacity: .52;
  transition: opacity var(--motion-fast), color var(--motion-fast), background var(--motion-fast), border-color var(--motion-fast);
}
.datetime-control__clear:hover, .datetime-control__clear:focus-visible {
  border-color: var(--color-border-strong); background: var(--cms-bg-field-hover); color: var(--color-text); opacity: 1;
}
.datetime-control__clear:disabled {
  opacity: .28; cursor: default; pointer-events: none;
}
.datetime-control__clear[hidden] { display: none; }
input::placeholder, textarea::placeholder { color: var(--color-faint); }
input:focus, select:focus, textarea:focus {
  outline: 0; border-color: var(--cms-field-focus-border); background: var(--cms-field-focus-bg);
  box-shadow: var(--cms-focus-ring);
}
input[type="url"]:not(:focus):not(:placeholder-shown):invalid {
  border-color: var(--color-danger); box-shadow: 0 0 0 2px var(--color-danger-soft);
}
.field.is-invalid input,
.field.is-invalid select,
.field.is-invalid textarea,
.field.is-invalid .image-preview,
.field.is-invalid .object-list {
  border-color: var(--cms-field-invalid-border);
}
.field-error {
  display: block; margin-top: var(--cms-field-error-margin); color: var(--color-danger); font-size: var(--cms-font-size-xs); line-height: 1.35;
}
.search-control input, .search-control input:focus {
  min-height: 0; padding: 0; border: 0; border-radius: 0;
  background: transparent; box-shadow: none;
}
select {
  height: var(--cms-field-control-height); padding-top: 0; padding-right: var(--cms-field-select-padding-right); padding-bottom: 0;
  appearance: none; -webkit-appearance: none; color-scheme: dark;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--color-muted) 50%),
    linear-gradient(135deg, var(--color-muted) 50%, transparent 50%);
  background-position: calc(100% - 1rem) 50%, calc(100% - .7rem) 50%;
  background-size: .32rem .32rem, .32rem .32rem; background-repeat: no-repeat;
}
.check-control { display: inline-flex; align-items: center; gap: var(--cms-toggle-gap); color: var(--color-text); cursor: pointer; font-size: var(--cms-font-size-sm); line-height: 1.2; }
.check-control input { width: 1rem; height: 1rem; accent-color: var(--color-accent); }
.field-language-options { display: flex; flex-wrap: wrap; gap: .65rem 1rem; min-height: var(--cms-field-control-height); align-items: center; }
.field--check {
  align-self: end; min-height: var(--cms-field-control-height); display: flex; flex-direction: row; flex-wrap: wrap;
  align-content: center; align-items: center; justify-content: flex-start; gap: .25rem var(--cms-toggle-gap);
}
.field--check .toggle-switch { min-height: var(--cms-field-control-height); align-items: center; }
.field--check .help-popover { align-self: center; margin-left: .05rem; }
.field--check .field-error { flex-basis: 100%; }
.image-preview {
  display: grid; grid-template-columns: var(--cms-image-field-thumb-size) minmax(0, 1fr); gap: var(--cms-image-field-gap); align-items: start;
  padding: var(--cms-image-field-padding); border: 1px solid var(--cms-field-border); background: var(--cms-field-bg);
}
.image-preview__thumb {
  position: relative; width: var(--cms-image-field-thumb-size); height: var(--cms-image-field-thumb-size); aspect-ratio: 1;
  display: grid; place-items: center; overflow: hidden;
  border: 1px solid var(--color-border); background: var(--color-canvas);
}
/* Keep replaced images out of Grid sizing: intrinsic portrait height would otherwise escape the thumb and make focus cropping ineffective. */
.image-preview__thumb img {
  position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-width: 100%; max-height: 100%;
  object-fit: cover; object-position: var(--focus-x, 50%) var(--focus-y, 50%);
}
.image-preview--svg .image-preview__thumb {
  background: #f7f4ec;
}
.image-preview--svg .image-preview__thumb img {
  box-sizing: border-box; padding: .45rem; object-fit: contain; object-position: 50% 50%;
}
.image-preview__placeholder { display: grid; place-items: center; width: 100%; height: 100%; color: var(--color-faint); }
.image-preview__meta { min-width: 0; display: flex; align-items: center; align-content: start; flex-wrap: wrap; gap: .5rem .58rem; }
.image-preview__meta strong, .image-preview__meta small { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.image-preview__meta strong { flex: 1 1 100%; }
.image-preview__meta small { color: var(--color-muted); }
.image-preview__actions { display: flex; flex: 1 1 auto; flex-wrap: wrap; gap: var(--cms-image-field-actions-gap); align-items: center; }
.object-list__field--image .image-preview {
  grid-template-columns: var(--cms-image-field-compact-thumb-size) minmax(0, 1fr); gap: var(--cms-image-field-compact-gap); padding: var(--cms-image-field-compact-padding);
}
.object-list__field--image .image-preview__thumb { width: var(--cms-image-field-compact-thumb-size); height: var(--cms-image-field-compact-thumb-size); }
.object-list__field--image .image-preview__meta { gap: .34rem; }
.object-list__field--image .image-preview__actions { gap: .35rem; }
.image-action-button {
  min-height: var(--cms-image-action-height); min-width: 0; padding: var(--cms-image-action-padding); gap: .38rem;
  font-size: var(--cms-font-size-xs); line-height: 1;
}
.image-action-button[hidden] { display: none; }
.image-focus-status { display: none; }
.image-focus-button,
.file-action-panel button.file-action-button.js-open-image-focus {
  position: relative;
}
.image-focus-button::after,
.file-action-panel button.file-action-button.js-open-image-focus::after {
  content: ""; width: .42rem; height: .42rem; flex: 0 0 auto; border: 1px solid currentColor; border-radius: 999px;
  background: transparent; opacity: .48;
}
.image-focus-button[data-focus-mode="custom"],
.file-action-panel button.file-action-button.js-open-image-focus[data-focus-mode="custom"] {
  border-color: var(--cms-border-accent);
  background: var(--color-accent-soft); color: var(--color-accent);
}
.image-focus-button[data-focus-mode="custom"]::after,
.file-action-panel button.file-action-button.js-open-image-focus[data-focus-mode="custom"]::after {
  border-color: var(--color-accent); background: var(--color-accent); opacity: 1;
  box-shadow: 0 0 0 3px var(--color-accent-soft);
}
.image-preview--empty .image-preview__thumb { border-style: dashed; }
.image-preview--missing {
  border-color: var(--cms-border-danger); background: var(--color-danger-soft);
}
.image-preview--missing .image-preview__placeholder { color: var(--color-danger); }
.image-preview--missing .image-focus-status { color: var(--color-danger); }
.images-field { display: grid; gap: .75rem; }
.images-field__grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr)); gap: .7rem;
}
.images-field__item {
  position: relative; min-width: 0; margin: 0; overflow: hidden;
  border: 1px solid var(--color-border); background: var(--color-field);
}
.images-field__item.is-missing { border-color: color-mix(in srgb, var(--color-danger) 60%, var(--color-border)); }
.images-field__thumb {
  display: grid; place-items: center; width: 100%; aspect-ratio: 4 / 3; overflow: hidden;
  background: var(--color-surface-alt); cursor: grab;
}
.images-field__thumb:active { cursor: grabbing; }
.images-field__thumb img { width: 100%; height: 100%; object-fit: cover; }
.images-field__item--svg .images-field__thumb {
  background: #f7f4ec;
}
.images-field__item--svg .images-field__thumb img {
  box-sizing: border-box; padding: .45rem; object-fit: contain;
}
.images-field__placeholder { color: var(--color-faint); }
.images-field__item figcaption {
  overflow: hidden; padding: .48rem .55rem; color: var(--color-muted);
  font-size: var(--cms-font-size-xs); text-overflow: ellipsis; white-space: nowrap;
}
.images-field__item .icon-button {
  position: absolute; top: .35rem; right: .35rem; width: 2rem; height: 2rem;
  background: rgba(0, 0, 0, .72); color: #fff; opacity: 0;
}
.images-field__item:hover .icon-button,
.images-field__item .icon-button:focus-visible { opacity: 1; }
.images-field__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; }
.images-field__count, .images-field__empty { color: var(--color-muted); font-size: var(--cms-font-size-sm); }
.file-preview {
  grid-template-columns: var(--cms-image-field-file-thumb-size) minmax(0, 1fr); gap: .7rem; padding: .65rem;
}
.file-preview .image-preview__thumb { width: var(--cms-image-field-file-thumb-size); height: var(--cms-image-field-file-thumb-size); }
.file-preview:not(.image-preview--empty):not(.image-preview--missing) .image-preview__thumb {
  border-color: var(--cms-file-placeholder-border, color-mix(in srgb, var(--color-faint) 82%, transparent));
  background: var(--color-faint);
}
.file-preview:not(.image-preview--empty):not(.image-preview--missing) .image-preview__placeholder {
  background: var(--color-faint); color: var(--cms-color-inverse);
}
.file-preview .image-preview__meta { gap: .38rem; }
.file-preview .image-preview__actions { gap: .4rem; }
.image-field-actions { display: none; }
.file-control {
  min-height: 6rem; display: flex; align-items: center; justify-content: center; gap: .7rem; padding: var(--cms-form-panel-padding);
  border: 1px dashed var(--color-border-strong); color: var(--color-accent); cursor: pointer; font-size: var(--cms-font-size-sm);
  text-align: left; transition: border var(--motion-control), background var(--motion-control);
}
.image-upload-button.file-control {
  min-height: var(--cms-image-action-height); display: inline-flex; padding: var(--cms-image-action-padding); border-style: dashed;
  color: var(--color-text); font-size: var(--cms-font-size-xs); line-height: 1; text-align: center;
}
.file-upload-button.file-control {
  min-height: var(--cms-image-action-height); display: inline-flex; padding: var(--cms-image-action-padding); border-style: dashed;
  color: var(--color-text); font-size: var(--cms-font-size-xs); line-height: 1; text-align: center;
}
.image-upload-button.file-control:hover, .image-upload-button.file-control.is-dragging,
.file-upload-button.file-control:hover, .file-upload-button.file-control.is-dragging {
  color: var(--color-accent);
}
.file-control:hover, .file-control.is-dragging { border-color: var(--color-accent); background: var(--color-accent-soft); }
.file-control input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; }
.file-control__text { display: flex; flex-direction: column; }
.file-control__text strong { color: var(--color-accent); font-weight: 500; }
.file-control__text small { color: var(--color-faint); font-size: var(--cms-font-size-xs); }
.file-pick-action {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; gap: .35rem;
  padding: .3rem; border: 1px dashed var(--color-border-strong); border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--color-surface-alt) 72%, transparent);
  transition: border var(--motion-control), background var(--motion-control), box-shadow var(--motion-control);
}
.file-pick-action:has(.file-pick-action__drop:focus-within), .file-pick-action:has(.file-pick-action__drop:hover),
.file-pick-action:has(.file-pick-action__drop.is-dragging) {
  border-color: var(--color-accent); background: var(--color-accent-soft);
}
.file-pick-action:has(.file-pick-action__drop:focus-within) { box-shadow: var(--cms-focus-ring); }
.file-pick-action__drop {
  min-width: 0; min-height: 2.35rem; display: flex; align-items: center; gap: .55rem;
  padding: .35rem .55rem; border-radius: var(--radius-sm); color: var(--color-muted); cursor: pointer;
}
.file-pick-action__drop:hover, .file-pick-action__drop.is-dragging { color: var(--color-text); }
.file-pick-action__drop > .icon { flex: none; color: var(--color-muted); }
.file-pick-action__label { min-width: 0; overflow: hidden; font-size: var(--cms-font-size-xs); font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.file-pick-action.has-selection .file-pick-action__label { color: var(--color-text); }
.file-pick-action__drop input[type="file"] { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; }
.file-pick-action .button { border-radius: var(--radius-sm); white-space: nowrap; }
.file-upload-status {
  min-width: 0; display: grid; gap: .55rem; padding: .7rem;
  border: 1px solid var(--color-border); border-radius: var(--radius-sm);
  background: var(--color-surface-alt); color: var(--color-muted); font-size: var(--cms-font-size-xs);
}
.file-upload-status[hidden] { display: none; }
.file-upload-status.is-error { border-color: color-mix(in srgb, var(--color-danger) 58%, var(--color-border)); }
.file-upload-status__summary { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.file-upload-status__summary strong { min-width: 0; color: var(--color-text); font-size: var(--cms-font-size-sm); }
.file-upload-status.is-error .file-upload-status__summary strong { color: var(--color-danger); }
.file-upload-status__progress { width: 100%; height: .35rem; overflow: hidden; border: 0; border-radius: 999px; accent-color: var(--color-accent); }
.file-upload-status__list { max-height: 12rem; display: grid; gap: .35rem; margin: 0; padding: 0; overflow-y: auto; list-style: none; }
.file-upload-status__item {
  min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(7rem, auto); align-items: center; gap: .65rem;
  padding: .42rem .5rem; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--cms-bg-panel);
}
.file-upload-status__item::before {
  content: ""; width: .45rem; height: .45rem; grid-column: 1; grid-row: 1; align-self: center;
  border: 1px solid var(--color-faint); border-radius: 50%; background: transparent;
}
.file-upload-status__name {
  min-width: 0; grid-column: 1; grid-row: 1; padding-left: .85rem; overflow: hidden;
  color: var(--color-text); font-weight: 650; text-overflow: ellipsis; white-space: nowrap;
}
.file-upload-status__result { min-width: 0; grid-column: 2; grid-row: 1; display: grid; justify-items: end; gap: .08rem; text-align: right; }
.file-upload-status__result strong { color: var(--color-muted); font-size: var(--cms-font-size-xs); }
.file-upload-status__result small { max-width: 18rem; overflow: hidden; color: var(--color-faint); text-overflow: ellipsis; white-space: nowrap; }
.file-upload-status__item.is-uploaded::before { border-color: var(--color-success); background: var(--color-success); }
.file-upload-status__item.is-warning::before { border-color: var(--color-accent); background: var(--color-accent); }
.file-upload-status__item.is-failed::before { border-color: var(--color-danger); background: var(--color-danger); }
.file-upload-status__item.is-failed .file-upload-status__result strong { color: var(--color-danger); }
.file-upload-status__item.is-warning .file-upload-status__result strong { color: var(--color-accent); }
.file-upload-status__actions { display: flex; justify-content: flex-end; }
.file-upload-status__actions[hidden] { display: none; }
@media (max-width: 680px) {
  .file-upload-status__item { grid-template-columns: minmax(0, 1fr); gap: .18rem; }
  .file-upload-status__result { grid-column: 1; grid-row: 2; justify-items: start; padding-left: .85rem; text-align: left; }
  .file-upload-status__result small { max-width: 100%; }
  .file-upload-status__actions .button { width: 100%; }
}
.object-list {
  display: grid; gap: var(--cms-object-list-gap); margin-bottom: var(--cms-object-list-margin-bottom);
  container-type: inline-size;
}
.object-list-tool-button { margin-left: auto; min-height: var(--cms-image-action-height); padding: .32rem .62rem; font-size: var(--cms-font-size-xs); }
.object-list-tool-panel {
  display: flex; flex-wrap: wrap; align-items: end; gap: var(--cms-object-list-tool-gap);
  margin: -.1rem 0 .85rem; padding: var(--cms-object-list-tool-padding); border: 1px solid var(--color-border);
  background: var(--cms-field-bg);
  opacity: 1; transform: none; transform-origin: top center;
  transition: opacity var(--motion-fast), transform var(--motion-control);
}
.object-list-tool-panel[hidden] { display: none; }
.object-list-tool-panel.is-opening, .object-list-tool-panel.is-closing {
  opacity: 0; transform: translateY(calc(-1 * var(--cms-motion-shift-xs)));
}
.object-list-tool-panel.is-closing { pointer-events: none; transition: opacity var(--motion-exit), transform var(--motion-exit); }
@starting-style {
  .object-list-tool-panel:not([hidden]) { opacity: 0; transform: translateY(calc(-1 * var(--cms-motion-shift-xs))); }
}
.object-list-tool-panel__amount {
  min-width: min(12rem, 100%); display: grid; gap: .25rem;
}
.object-list-tool-panel__amount span {
  color: var(--color-faint); font-size: var(--cms-font-size-2xs);
}
.object-list-tool-panel__amount input { min-height: 2.4rem; padding-block: .45rem; }
.object-list-tool-panel .button { min-height: 2.4rem; padding: .45rem .7rem; font-size: var(--cms-font-size-sm); }
.object-list__row { display: grid; grid-template-columns: var(--cms-object-list-grip-width) repeat(2, minmax(0, 1fr)) var(--cms-object-list-delete-width); align-items: end; gap: var(--cms-object-list-row-gap); }
.object-list__row[data-cols="3"] { grid-template-columns: var(--cms-object-list-grip-width) repeat(3, minmax(0, 1fr)) var(--cms-object-list-delete-width); }
.object-list__row[data-cols="4"] { grid-template-columns: var(--cms-object-list-grip-width) repeat(4, minmax(0, 1fr)) var(--cms-object-list-delete-width); }
.object-list__grip {
  display: flex; align-items: center; justify-content: center; height: var(--cms-field-control-height);
  color: var(--color-faint); cursor: grab; transition: color var(--motion-fast), background var(--motion-fast);
}
.object-list__grip .icon { width: 1.65rem; height: 1.65rem; stroke-width: 2.2; }
.object-list__grip:hover { background: var(--color-accent-soft); color: var(--color-accent); }
.object-list__field span { display: block; margin-bottom: .25rem; color: var(--color-faint); font-size: var(--cms-font-size-xs); }
/* Column headers sit above the rows and take the row's own grid, so the labels
   line up with the controls they name. */
.object-list__head {
  display: grid; align-items: end; gap: var(--cms-object-list-row-gap);
  grid-template-columns: var(--cms-object-list-grip-width) repeat(2, minmax(0, 1fr)) var(--cms-object-list-delete-width);
}
.object-list__head[data-cols="3"] { grid-template-columns: var(--cms-object-list-grip-width) repeat(3, minmax(0, 1fr)) var(--cms-object-list-delete-width); }
.object-list__head[data-cols="4"] { grid-template-columns: var(--cms-object-list-grip-width) repeat(4, minmax(0, 1fr)) var(--cms-object-list-delete-width); }
.object-list__head > span { min-width: 0; color: var(--color-faint); font-size: var(--cms-font-size-xs); }
/* Nothing to head when the list is empty. */
.object-list__head:only-child { display: none; }
/* Platform detected from a row's URL. Dashed while nothing is recognised yet,
   solid once the address resolves to a platform, and in the danger colour when
   it resolves to none -- that row will not save. */
.object-list__platform {
  justify-self: end; max-width: 12rem; overflow: hidden;
  padding: .22rem .48rem; border: 1px dashed var(--color-border-strong);
  color: var(--color-faint); font-size: var(--cms-font-size-xs); line-height: 1.2;
  text-overflow: ellipsis; white-space: nowrap;
}
.object-list__row.is-platform-recognized .object-list__platform {
  border-style: solid; border-color: var(--cms-border-success); color: var(--color-success);
}
.object-list__row.is-platform-unrecognized .object-list__platform {
  border-style: solid; border-color: var(--cms-border-danger); color: var(--color-danger);
}
/* A URL and its detected platform: no label to type, so the row is one line. */
.object-list__row.object-list__row--social-links {
  grid-template-columns: 2.35rem minmax(0, 1fr) minmax(8rem, auto) 2.35rem;
  grid-template-areas: "grip url platform delete";
  align-items: center; gap: .46rem .65rem; padding: .44rem .45rem .44rem .32rem;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--cms-bg-field) 86%, transparent);
}
.object-list__row--social-links > .object-list__grip {
  grid-area: grip; align-self: stretch; height: auto;
  min-height: var(--cms-field-control-height); border-right: 1px solid var(--color-border);
}
.object-list__row--social-links [data-fk="url"] { grid-area: url; }
.object-list__row--social-links .object-list__platform { grid-area: platform; }
.object-list__row--social-links .object-list__delete { grid-area: delete; }
.object-list__head--social-links {
  grid-template-columns: 2.35rem minmax(0, 1fr) minmax(8rem, auto) 2.35rem;
  grid-template-areas: "grip url platform delete";
  gap: .46rem .65rem; padding-inline: calc(.32rem + 1px) calc(.45rem + 1px);
}
.object-list__head--social-links > .object-list__head-grip { grid-area: grip; }
.object-list__head--social-links [data-fk="url"] { grid-area: url; }
@container (max-width: 38rem) {
  .object-list__row.object-list__row--social-links {
    grid-template-columns: var(--cms-touch-target) minmax(0, 1fr) var(--cms-touch-target);
    grid-template-areas: "grip url delete" "grip platform .";
    align-items: start; gap: .48rem .55rem; padding: .5rem;
  }
  .object-list__head--social-links { display: none; }
  .object-list__row--social-links > .object-list__grip { min-height: 100%; }
  .object-list__row--social-links .object-list__platform { justify-self: start; }
}
/* The header states each column, so the in-row labels stop repeating it down
   the page. Hidden visually rather than removed, so every control keeps its
   accessible name -- text inputs also carry the label as their placeholder. */
.object-list__row > .object-list__field > span:first-child {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}
.object-list__field--check .check-control { min-height: 2.58rem; }
.object-list__field--check .check-control span { margin: 0; color: var(--color-text); font-size: var(--cms-font-size-sm); }
.object-list__delete {
  width: var(--cms-object-list-delete-width); height: var(--cms-field-control-height); display: grid; place-items: center; padding: 0;
  border: 0; background: transparent; color: var(--color-faint); cursor: pointer;
  transition: background var(--motion-fast), color var(--motion-fast);
}
.object-list__delete .icon { width: 1.12rem; height: 1.12rem; stroke-width: 2.2; }
.object-list__delete:hover { color: var(--color-danger); }

@container (max-width: 38rem) {
  .object-list__row,
  .object-list__row[data-cols="3"],
  .object-list__row[data-cols="4"] {
    grid-template-columns: 2.45rem minmax(0, 1fr) var(--cms-object-list-delete-width);
    align-items: start; padding-bottom: var(--space-3); border-bottom: 1px solid var(--color-border);
  }
  /* Stacked, the rows no longer line up in columns, so a header above them
     would name nothing. It goes, and each row states its own labels again. */
  .object-list__head { display: none; }
  .object-list__row > .object-list__field > span:first-child {
    position: static; width: auto; height: auto; margin: 0 0 .25rem;
    overflow: visible; clip-path: none;
  }

  .object-list__grip .icon { width: 1.78rem; height: 1.78rem; }
  .object-list__field { grid-column: 2; }
  .object-list__delete { grid-column: 3; grid-row: 1; }
}

/* ── Generic reference combobox used by reference fields and module enhancements ── */
.combo { position: relative; }
.combo > select { display: none; }            /* native <select> replaced by the filter input */
.combo__input {
  width: 100%; min-height: var(--cms-field-control-height); padding: .45rem .7rem;
  border: 1px solid var(--cms-field-border); border-radius: var(--radius-sm);
  background: transparent; color: var(--color-text); font: inherit;
}
.combo__input:focus { outline: none; border-color: var(--cms-field-focus-border); box-shadow: var(--cms-focus-ring); }
.combo__menu {
  position: absolute; z-index: 30; top: calc(100% + 4px); left: 0; right: 0;
  max-height: 17rem; overflow-y: auto; padding: .25rem;
  border-radius: var(--radius-sm); transform-origin: top center;
}
.combo__item {
  display: block; width: 100%; text-align: left; padding: .42rem .55rem;
  border: 0; border-radius: var(--radius-sm); background: transparent; color: var(--color-text);
  font: inherit; cursor: pointer;
  transition: background var(--motion-fast), color var(--motion-fast), outline-color var(--motion-fast);
}
.combo__item:hover,
.combo__item.is-active { background: var(--cms-bg-hover-strong); }
.combo__item.is-active { outline: 2px solid var(--color-accent); outline-offset: -2px; }
.combo__item.is-current { background: var(--color-accent-soft); color: var(--color-accent); }
.combo__item--none { color: var(--color-faint); }
.combo__item--add {
  margin-top: .18rem; border: 1px dashed color-mix(in srgb, var(--color-accent) 48%, transparent);
  color: var(--color-accent);
}
.combo__item--add:hover,
.combo__item--add.is-active { background: var(--color-accent-soft); }
.combo__empty { padding: .42rem .55rem; color: var(--color-faint); font-size: var(--cms-font-size-sm); }

.reference-create-dialog {
  --cms-dialog-backdrop-bg: rgba(0, 0, 0, .56);
  width: min(44rem, calc(100vw - 2rem)); height: min(46rem, calc(100dvh - 2rem)); padding: 0;
  border: 1px solid var(--color-border-strong); border-radius: var(--radius-md);
  background: var(--color-surface); color: var(--color-text); box-shadow: var(--shadow-panel);
}
.reference-create-dialog__panel { display: grid; grid-template-rows: auto minmax(0, 1fr); height: 100%; min-height: 0; }
.reference-create-dialog__head {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: .8rem .92rem; border-bottom: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface-raised) 86%, transparent);
}
.reference-create-dialog__head .eyebrow { margin: 0 0 .12rem; }
.reference-create-dialog__head strong {
  display: block; color: var(--color-text); font-size: var(--cms-font-size-md); font-weight: 700;
}
.reference-create-dialog__frame {
  width: 100%; height: 100%; min-height: 0; border: 0; background: var(--color-surface);
}
.form-action-bar {
  display: flex; align-items: center; gap: var(--cms-form-action-gap);
  background: var(--cms-form-action-bg);
  border-top: 1px solid var(--cms-form-action-border);
}
.form-action-bar--sticky {
  position: fixed; right: 0; bottom: 0; left: var(--cms-sidebar-offset); z-index: 24;
  min-height: calc(var(--cms-form-action-bar-height) + env(safe-area-inset-bottom));
  display: block; margin: 0; padding: 0;
  background: color-mix(in srgb, var(--cms-form-action-bg) 88%, transparent);
  backdrop-filter: blur(14px); box-shadow: var(--cms-shadow-footer); transition: left var(--motion-drawer);
}
.form-action-bar__inner {
  width: min(100%, var(--content-width)); min-height: calc(var(--cms-form-action-bar-height) + env(safe-area-inset-bottom));
  display: flex; align-items: center; gap: var(--cms-form-action-gap); margin: 0 auto;
  padding: .55rem var(--cms-form-action-inline-padding) calc(.55rem + env(safe-area-inset-bottom));
}
body.cms-form-page .content-wrap {
  padding-bottom: calc(var(--cms-form-action-bar-height) + var(--space-4) + env(safe-area-inset-bottom));
}
.save-state {
  min-height: 2.25rem; display: inline-flex; align-items: center; gap: .45rem; padding: 0 .55rem;
  color: var(--color-faint); font-size: var(--cms-font-size-xs); font-weight: 650; letter-spacing: .04em; text-transform: uppercase;
  transition: color var(--motion-fast);
}
.save-state__dot {
  width: .5rem; height: .5rem; border-radius: 999px; background: var(--color-muted);
  box-shadow: var(--cms-focus-ring-muted);
  transition: border-color var(--motion-fast), background var(--motion-fast), box-shadow var(--motion-fast);
}
.save-state.is-new { display: none; }
.save-state.is-unsaved { color: var(--color-accent); }
.save-state.is-unsaved .save-state__dot {
  background: var(--color-accent); box-shadow: 0 0 0 3px var(--color-accent-soft);
}
.save-state.is-saving { color: var(--color-muted); }
.save-state.is-saving .save-state__dot {
  background: transparent; border: 1px solid currentColor; box-shadow: none;
}
.save-state.is-error { color: var(--color-danger); }
.save-state.is-error .save-state__dot { background: var(--color-danger); box-shadow: 0 0 0 3px var(--cms-bg-danger-hover); }
.form-actions__return,
.form-actions__cancel { margin-left: auto; }
.form-actions__return ~ .form-actions__cancel { margin-left: 0; }
.form-actions__more { display: none; }
.form-actions__more--object { display: block; }
.form-actions__more.action-menu { grid-column: auto; }
.form-actions__more > .icon-button { width: var(--cms-button-height); height: var(--cms-button-height); }
.form-actions__more .form-actions__mobile-only { display: none; }
.form-actions__more .action-menu__panel {
  top: auto; bottom: calc(100% + .45rem); right: 0;
  --cms-popover-closed-transform: translateY(var(--cms-motion-shift-xs)) scale(.985);
  transform-origin: bottom right;
}

@media (max-width: 900px) {
  .form-action-bar--sticky { left: 0; }
  .form-action-bar__inner { --cms-form-action-inline-padding: var(--space-3); }
}
.form-history {
  display: flex; justify-content: flex-start; padding: var(--cms-form-history-padding); margin-top: var(--cms-form-history-margin-top);
}
.form-history .aside-link {
  width: fit-content; min-height: 2.35rem; display: inline-flex; align-items: center; gap: .48rem;
  padding: 0 .25rem; color: var(--color-muted); font-size: var(--cms-font-size-sm);
}
.form-history .aside-link:hover { color: var(--color-text); }
.form-history .aside-link .icon { width: .92rem; height: .92rem; color: var(--color-faint); }
.form-readonly-fieldset {
  min-width: 0; margin: 0; padding: 0; border: 0;
}
.form-readonly-fieldset:disabled {
  opacity: .72;
}

@container (max-width: 40rem) {
  .form-grid,
  .cms-form-grid {
    grid-template-columns: 1fr;
  }

  .form-grid {
    padding: var(--cms-form-grid-padding-mobile);
  }

  .field--half {
    grid-column: 1 / -1;
  }
}

.aside-link { display: inline-flex; align-items: center; gap: .5rem; padding: .2rem .1rem; color: var(--color-muted); font-size: var(--cms-font-size-sm); text-decoration: none; transition: color var(--motion-fast); }
.aside-link:hover { color: var(--color-accent); }
.sync-panel { display: grid; gap: .65rem; }
.sync-meta { display: grid; gap: .15rem; }
.sync-meta span {
  color: var(--color-faint); font-family: var(--font-condensed); font-size: var(--cms-font-size-2xs); font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
}
.sync-meta strong {
  overflow: hidden; color: var(--color-text); font-size: var(--cms-font-size-sm); font-weight: 500; text-overflow: ellipsis; white-space: nowrap;
}
.sync-actions { display: grid; gap: .5rem; margin-top: .2rem; }
.sync-actions form { margin: 0; }
label.toggle-switch { min-width: 0; display: inline-flex; align-items: center; gap: var(--cms-toggle-gap); color: var(--color-text); cursor: pointer; line-height: 1.2; }
.toggle-switch input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.toggle-switch__track { position: relative; flex: none; align-self: center; display: inline-flex; width: var(--cms-toggle-width); height: var(--cms-toggle-height); border-radius: var(--cms-toggle-radius); background: var(--cms-toggle-bg); box-shadow: inset 0 0 0 1px var(--cms-toggle-border); transition: background var(--motion-control), box-shadow var(--motion-control); }
.toggle-switch__track::after { content: ""; position: absolute; top: var(--cms-toggle-knob-offset); left: var(--cms-toggle-knob-offset); width: var(--cms-toggle-knob-size); height: var(--cms-toggle-knob-size); border-radius: 50%; background: var(--color-muted); transition: transform var(--motion-control), background var(--motion-control); }
.toggle-switch:hover .toggle-switch__track { background: var(--cms-toggle-hover-bg); box-shadow: inset 0 0 0 1px var(--color-accent); }
.toggle-switch input:checked + .toggle-switch__track { background: var(--color-accent-soft); box-shadow: inset 0 0 0 1px var(--color-accent); }
.toggle-switch input:checked + .toggle-switch__track::after { transform: translateX(var(--cms-toggle-knob-shift)); background: var(--color-accent); }
.toggle-switch input:focus-visible + .toggle-switch__track { box-shadow: inset 0 0 0 1px var(--color-accent), 0 0 0 2px var(--color-accent-soft); }
.toggle-switch__label { min-width: 0; display: inline-block; color: var(--color-text); font-size: var(--cms-toggle-label-size); line-height: 1.2; }
.toggle-switch--field { min-height: var(--cms-field-control-height); color: var(--color-text); }
.toggle-switch--field .toggle-switch__label { color: var(--color-text); }
/* Translatable fields */
.field--i18n { container-type: inline-size; }
.field--i18n > .lang-tabs {
  display: grid; grid-template-columns: minmax(7rem, 1fr) auto; align-items: end; column-gap: .45rem;
}
.field--i18n > .lang-tabs > .field-label-row { min-width: 0; grid-column: 1; margin-bottom: var(--cms-field-label-margin); }
.field--i18n > .lang-tabs > .lang-tabs__nav {
  grid-column: 2; display: inline-flex; flex-wrap: nowrap; gap: .12rem; justify-self: end; margin: 0 0 var(--cms-field-label-margin);
}
.field--i18n > .lang-tabs > .lang-tabs__panels { grid-column: 1 / -1; min-width: 0; }
.lang-tab { display: inline-flex; align-items: center; gap: var(--cms-lang-tab-gap); padding: var(--cms-lang-tab-padding); border: 1px solid var(--cms-lang-tab-border); background: var(--cms-lang-tab-bg); color: var(--cms-lang-tab-color); cursor: pointer; font-family: var(--cms-lang-tab-font-family); font-size: var(--cms-font-size-xs); font-stretch: var(--cms-lang-tab-font-stretch); font-weight: 600; letter-spacing: 0; transition: border-color var(--motion-fast), background var(--motion-fast), color var(--motion-fast), box-shadow var(--motion-fast); }
.lang-tab:hover, .lang-tab:focus-visible {
  outline: 0; border-color: var(--cms-field-hover-border); background: var(--cms-lang-tab-hover-bg); color: var(--color-text);
}
.lang-tab:focus-visible { box-shadow: var(--cms-focus-ring); }
/* Fill state: hollow dot + dashed border = empty (needs translation); solid dot = has content. */
.lang-tab__dot { width: var(--cms-lang-tab-dot-size); height: var(--cms-lang-tab-dot-size); border-radius: 50%; flex: none; background: transparent; box-shadow: inset 0 0 0 1px var(--color-muted); transform: translateY(var(--cms-lang-tab-dot-offset-y)); transition: background var(--motion-fast), box-shadow var(--motion-fast); }
.lang-tab.is-filled .lang-tab__dot { background: var(--color-accent); box-shadow: none; }
.lang-tab.is-empty { border-style: dashed; }
.lang-tab.is-active { border-color: var(--color-accent); background: var(--cms-lang-tab-active-bg); color: var(--color-accent); }
.lang-tab.is-active.is-filled .lang-tab__dot { background: var(--color-accent); }
.lang-tab--shared { width: var(--cms-lang-tab-shared-size); min-width: var(--cms-lang-tab-shared-size); justify-content: center; margin-left: .18rem; padding-inline: 0; border-style: dashed; color: var(--color-faint); }
.lang-tab--shared .lang-tab__shared-icon { display: inline-flex; align-items: center; justify-content: center; }
.lang-tab--shared .lang-tab__shared-icon .icon { width: .82rem; height: .82rem; stroke-width: 2.15; }
.lang-tab--shared .lang-tab__shared-check { display: none; width: .64rem; height: .4rem; border-left: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-.07rem) rotate(-45deg); }
.lang-tab--shared.is-active { border-style: solid; border-color: var(--color-success); background: color-mix(in srgb, var(--color-success) 12%, transparent); color: var(--color-success); }
.lang-tab--shared.is-active .lang-tab__shared-icon { display: none; }
.lang-tab--shared.is-active .lang-tab__shared-check { display: inline-block; }
.lang-tabs.is-shared .lang-tab[data-lang]:not(.is-default) { display: none; }
.lang-panel { display: none; }
.lang-panel.is-active { display: block; }
/* Inline language tabs inside an object-list cell (compact; reuses the markup above). */
.object-list__row:has(.object-list__field--i18n) { align-items: start; }
.lang-tabs--inline .lang-tabs__nav { gap: .15rem; margin: 0 0 .28rem; }
.lang-tabs--inline .lang-tab { padding: var(--cms-lang-tab-inline-padding); font-size: var(--cms-font-size-2xs); gap: var(--cms-lang-tab-inline-gap); }
.lang-tabs--inline .lang-tab--shared { width: var(--cms-lang-tab-inline-shared-size); min-width: var(--cms-lang-tab-inline-shared-size); margin-left: .12rem; }
/* Win over `.object-list__field span` (which would otherwise blockify the dot). */
.object-list__field .lang-tab__dot { display: inline-block; margin: 0; width: .34rem; height: .34rem; }
.object-list__field .lang-tab__shared-icon { display: inline-flex; margin: 0; }
.object-list__field .lang-tab__shared-check { margin: 0; width: .52rem; height: .32rem; }
.lang-tabs--inline .lang-panel input { width: 100%; box-sizing: border-box; }

@media (pointer: coarse) {
  /* Keep the touch tabs tappable without ballooning far past the desktop size. */
  :root { --cms-lang-tab-touch-min-height: 2.1rem; }
  .field-label-row { min-height: var(--cms-lang-tab-touch-min-height); }
  .lang-tab { min-height: var(--cms-lang-tab-touch-min-height); }
  /* iOS sizes native date/time controls from their content, so an empty field ends up
     shorter than a filled one. Drop the native appearance so the explicit height wins. */
  input[type="date"], input[type="time"], input[type="datetime-local"] {
    -webkit-appearance: none; appearance: none;
  }
}

@container (max-width: 18rem) {
  .field--i18n > .lang-tabs { grid-template-columns: minmax(0, 1fr); }
  .field--i18n > .lang-tabs > .field-label-row,
  .field--i18n > .lang-tabs > .lang-tabs__nav,
  .field--i18n > .lang-tabs > .lang-tabs__panels { grid-column: 1; }
  .field--i18n > .lang-tabs > .lang-tabs__nav {
    justify-self: start; flex-wrap: wrap; margin: -.12rem 0 .45rem;
  }
}

@media (max-width: 680px) {
  :root {
    --cms-image-action-height: var(--cms-touch-target);
    --cms-object-list-delete-width: var(--cms-touch-target);
  }
  .reference-create-dialog {
    width: calc(100vw - .7rem); height: calc(100dvh - .7rem);
    max-width: none; max-height: none; border-radius: var(--radius-sm);
  }
  .reference-create-dialog__head { padding: .62rem .68rem; }
  .object-list-tool-panel__amount input,
  .object-list-tool-panel .button { min-height: var(--cms-touch-target); }
  .combo__item { min-height: var(--cms-touch-target); }
  .form-history .aside-link { min-height: var(--cms-touch-target); }
  .image-preview__meta strong,
  .image-preview__meta small {
    overflow: visible; overflow-wrap: anywhere; text-overflow: clip; white-space: normal;
  }
  .form-actions .form-action-bar__inner { flex-wrap: nowrap; gap: .4rem; }
  .form-actions { --cms-button-height: var(--cms-touch-target); }
  .form-actions__save {
    border-color: var(--cms-border-accent); background: var(--color-accent); color: var(--cms-color-on-accent);
  }
  .form-actions__save:hover { border-color: var(--color-accent-hover); background: var(--color-accent-hover); }
  .form-actions__return,
  .form-actions__cancel { display: none; }
  .form-actions .save-state { flex: 0 0 auto; padding-inline: .35rem; }
  .form-actions__more { display: block; flex: 0 0 auto; margin-left: auto; }
  .form-actions__more .form-actions__mobile-only { display: flex; }
  .form-actions__more .action-menu__panel { width: 11rem; }
}

/* Form meta panel (admin polish U5/U6) */
.aside-meta { display: grid; gap: var(--space-3); justify-items: start; }

/* Edit-form review: problems first, with the real site block preview kept in a modal. */
.review-preview-button {
  width: 100%; justify-content: center;
}
.review-checks { margin-top: 0; padding-top: 0; border-top: 0; }
.review-preview-button + .review-checks { margin-top: var(--space-4); padding-top: var(--space-3); border-top: 1px solid var(--color-border); }
.review-checks h3 { margin: 0 0 .7rem; font-size: var(--cms-font-size-sm); }
.review-checks__list { display: grid; gap: .35rem; }
.review-check {
  width: 100%; min-height: 2rem; display: flex; align-items: flex-start; gap: .55rem;
  margin: 0; padding: .35rem 0; border: 0; background: transparent; color: var(--color-muted);
  font: inherit; font-size: var(--cms-font-size-xs); line-height: 1.4; text-align: left;
}
button.review-check { cursor: pointer; }
button.review-check:hover { color: var(--color-text); }
button.review-check:disabled { cursor: default; }
button.review-check:focus-visible { outline: 0; border-radius: var(--radius-sm); box-shadow: var(--cms-focus-ring); }
.review-check > span:first-child {
  flex: 0 0 auto; width: .52rem; height: .52rem; margin-top: .28rem; border-radius: 50%; background: var(--color-faint);
}
.review-check--ready { color: var(--color-text); }
.review-check--ready > span:first-child { background: var(--color-success); }
.review-check--warning > span:first-child { background: var(--color-accent); }
.review-check--error { color: var(--color-danger); }
.review-check--error > span:first-child { background: var(--color-danger); }
.review-check--loading { color: var(--color-faint); }

.page-settings-form, .page-settings-list { display: grid; gap: var(--space-4); }
.page-settings-row { padding: var(--space-4); }
.page-settings-row__header, .page-settings-row__footer { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
.page-settings-row__header h2 { margin: 0 0 .2rem; font-size: var(--cms-font-size-lg); }
.page-settings-row__header code { color: var(--color-muted); overflow-wrap: anywhere; }
.page-settings-row__controls, .page-settings-labels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); margin-top: var(--space-4); }
.toggle-row { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-3); min-height: var(--cms-touch-target); padding: var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-md); cursor: pointer; }
.toggle-row > input { margin-top: .2rem; }
.toggle-row > span { display: grid; gap: .25rem; }
.toggle-row strong, .toggle-row small { display: block; }
.toggle-row small { color: var(--color-muted); font-size: var(--cms-font-size-sm); line-height: 1.4; }
.page-settings-label { display: grid; gap: .35rem; }
.page-settings-label > span { color: var(--color-muted); font-size: var(--cms-font-size-xs); font-weight: 600; }
.page-settings-row__footer { margin-top: var(--space-4); padding-top: var(--space-3); border-top: 1px solid var(--color-border); }
.page-settings-row__footer .button-row { display: flex; flex-wrap: nowrap; }
.page-settings-row__footer .button { white-space: nowrap; }
.page-settings-history-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3) var(--space-4); }
.page-settings-history-row small { display: block; margin-top: .2rem; color: var(--color-muted); }
@media (max-width: 680px) {
  .page-settings-row__header, .page-settings-row__footer { align-items: flex-start; flex-direction: column; }
  .page-settings-row__controls, .page-settings-labels { grid-template-columns: 1fr; }
  .page-settings-row__footer .button-row { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .page-settings-row__footer .button { min-height: var(--cms-touch-target); }
}