:root {
  --autumn-ui-scale: 1;
  --autumn-ui-root-font-size: 16px;
  --autumn-ui-text-xs: 11px;
  --autumn-ui-text-sm: 13px;
  --autumn-ui-text-md: 15px;
  --autumn-ui-text-lg: 18px;
  --autumn-ui-control-height: 40px;
  --autumn-ui-card-padding: 18px;
  --autumn-ui-gap: 14px;
  --autumn-ui-radius: 14px;
  --autumn-ui-focus-width: 3px;
  --autumn-ui-hit-target: 44px;
  --autumn-ui-font-family: Poppins, "Noto Sans", "Noto Sans Arabic", sans-serif;
  --autumn-accent-primary: #ef5a30;
  --autumn-accent-primary-hover: #c7442b;
  --autumn-accent-primary-soft: #fde7df;
  --autumn-accent-secondary: #e79a3b;
  --autumn-accent-tertiary: #de5860;
  --autumn-accent-on-primary: #ffffff;
  --autumn-interactive-gradient: linear-gradient(135deg, #ef5a30, #e79a3b 56%, #de5860);
  --autumn-surface: #fff9f5;
  --autumn-surface-elevated: #ffffff;
  --autumn-canvas: #f7e6df;
  --autumn-sidebar-surface: #fff7f2;
  --autumn-header-surface: #fffaf7;
  --autumn-control-surface: #ffffff;
  --autumn-hover-surface: #fde7df;
  --autumn-selected-surface: #f9d6ca;
  --autumn-text: #552536;
  --autumn-text-muted: #8c6974;
  --autumn-border: #e4cfc9;
  --autumn-focus: #f69778;
  --autumn-success: #109b81;
  --autumn-warning: #f59e0b;
  --autumn-danger: #ef4444;
  --autumn-danger-on: #ffffff;
  --autumn-info: #0ea5e9;
  --autumn-shadow-color: rgba(85, 37, 54, .16);
  --autumn-appearance-background-image: url("/assets/design-templates/autumn-background-approved.png?v=20260818-dashboard-approved");
  --autumn-appearance-overlay-opacity: .72;
  --autumn-appearance-background-overlay: rgba(255, 249, 245, .72);

  /* Autumn Premium V1 shared component contract. Geometry is theme-invariant. */
  --premium-space-0: 0;
  --premium-space-1: 4px;
  --premium-space-2: 8px;
  --premium-space-3: 12px;
  --premium-space-4: 16px;
  --premium-space-5: 20px;
  --premium-space-6: 24px;
  --premium-space-8: 32px;
  --premium-space-10: 40px;
  --premium-space-12: 48px;
  --premium-space-16: 64px;
  --premium-control-height-sm: 36px;
  --premium-control-height: 42px;
  --premium-control-height-lg: 54px;
  --premium-icon-button-size: 40px;
  --premium-border-width: 1px;
  --premium-radius-sm: 6px;
  --premium-radius-control: 8px;
  --premium-radius-card: 10px;
  --premium-radius-panel: 12px;
  --premium-radius-dialog: 16px;
  --premium-radius-round: 999px;
  --premium-font-latin: "Poppins", "Noto Sans", sans-serif;
  --premium-font-arabic: "Noto Sans Arabic", "Noto Sans", sans-serif;
  --premium-font-technical: "Poppins", "Noto Sans", sans-serif;
  --premium-brand-accent: #ef4f0b;
  --premium-brand-accent-hover: #d94408;
  --premium-brand-accent-soft: #fff0e8;
  --premium-surface-canvas: #fbfaf8;
  --premium-surface-base: #fffdfa;
  --premium-surface-subtle: #f7f3ef;
  --premium-surface-selected: #fff0e8;
  --premium-surface-elevated: #ffffff;
  --premium-surface-scrim: rgba(38, 28, 28, .62);
  --premium-text-primary: #2b1b1d;
  --premium-text-secondary: #6f6262;
  --premium-text-muted: #8e8481;
  --premium-text-on-accent: #ffffff;
  --premium-border-subtle: #eee5df;
  --premium-border-default: #e4d9d2;
  --premium-focus-ring: rgba(239, 79, 11, .22);
  --premium-status-warning: #b97819;
  --premium-status-warning-soft: #fff6e7;
  --premium-status-danger: #cf493e;
  --premium-status-danger-soft: #fff0ee;
  --premium-shadow-colour: rgba(43, 27, 29, .20);
}

html[data-autumn-appearance="true"] {
  font-size: var(--autumn-ui-root-font-size);
}

html[data-autumn-appearance="true"] body {
  color: var(--autumn-text);
  background-color: var(--autumn-canvas);
  background-image: var(--autumn-canvas-gradient, none);
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
  font-family: var(--autumn-ui-font-family);
}

/* Background photos belong to the authenticated workspace, not sign-in. */
html[data-autumn-appearance="true"] body:has(#app[style*="display: block"]) {
  background-image: linear-gradient(var(--autumn-appearance-background-overlay), var(--autumn-appearance-background-overlay)), var(--autumn-appearance-background-image);
}

html[data-autumn-appearance="true"] :where(button, input, select, textarea) {
  font-family: inherit;
}

html[data-autumn-appearance="true"] :where(button, a, input, select, textarea):focus-visible {
  outline: var(--autumn-ui-focus-width) solid var(--autumn-focus);
  outline-offset: 2px;
}

.autumn-appearance-studio,
.autumn-appearance-studio * {
  box-sizing: border-box;
}

.autumn-appearance-studio {
  display: grid;
  color-scheme: light;
  gap: var(--autumn-ui-gap);
  max-inline-size: 1480px;
  margin-inline: auto;
  padding: var(--autumn-ui-card-padding);
  overflow: clip;
  border: 0;
  border-radius: 0;
  color: var(--autumn-text);
  background: transparent;
  box-shadow: none;
  font: 500 var(--autumn-ui-text-sm)/1.5 var(--autumn-ui-font-family);
}

.autumn-appearance-studio__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--autumn-ui-gap);
  min-inline-size: 0;
}

.autumn-appearance-studio__actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: calc(12px * var(--autumn-ui-scale));
  min-inline-size: 0;
  padding-block: calc(10px * var(--autumn-ui-scale)) calc(2px * var(--autumn-ui-scale));
  border: 0;
  background: transparent;
  direction: ltr;
}

.autumn-appearance-studio__commit-actions {
  display: flex;
  align-items: center;
  gap: calc(8px * var(--autumn-ui-scale));
}

.autumn-appearance-studio__heading > div,
.autumn-appearance-card header,
.autumn-appearance-field,
.autumn-appearance-upload {
  min-inline-size: 0;
}

.autumn-appearance-studio :where(h2, h3, p, span, small, strong, button, label, output) {
  overflow-wrap: anywhere;
}

.autumn-appearance-studio__heading h2,
.autumn-appearance-card h3 {
  margin: 0;
  color: var(--autumn-text);
  font-weight: 800;
  letter-spacing: -.02em;
}

.autumn-appearance-studio__heading h2 {
  font-size: calc(var(--autumn-ui-text-lg) * 1.45);
}

.autumn-appearance-studio__heading p,
.autumn-appearance-card header p {
  margin: 4px 0 0;
  color: var(--autumn-text-muted);
}

.autumn-appearance-studio__status {
  min-inline-size: min(260px, 38%);
  color: var(--autumn-text-muted);
  text-align: end;
}

.autumn-appearance-studio__status[data-tone="success"] {
  color: var(--autumn-success);
}

.autumn-appearance-studio__status[data-tone="error"] {
  color: var(--autumn-danger);
}

.autumn-appearance-studio__layout {
  display: grid;
  container: autumn-settings-layout / inline-size;
  grid-template-columns: minmax(0, 1fr);
  grid-auto-rows: max-content;
  align-content: start;
  flex: 1 1 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  scrollbar-color: var(--autumn-text-muted) transparent;
  padding-inline-end: 4px;
  gap: calc(var(--autumn-ui-gap) * 2);
  min-block-size: 0;
}

.autumn-appearance-studio__controls {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, max(calc(320px * var(--autumn-ui-scale)), calc((100% - var(--autumn-ui-gap) * 2) / 2))), 1fr));
  align-items: start;
  gap: calc(var(--autumn-ui-gap) * 2);
  min-inline-size: 0;
}

.autumn-appearance-card {
  display: grid;
  align-content: start;
  gap: calc(var(--autumn-ui-gap) * .8);
  min-inline-size: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.autumn-appearance-card h3 {
  font-size: var(--autumn-ui-text-lg);
}

[data-autumn-settings-extras] .settings-card-title {
  display: flex;
  align-items: center;
  gap: calc(10px * var(--autumn-ui-scale));
  margin-block-end: calc(12px * var(--autumn-ui-scale));
}

[data-autumn-settings-extras] .settings-card-title :is(h2, h3) { margin: 0; }
[data-autumn-settings-extras] .settings-card-icon { display: inline-grid; place-items: center; flex: 0 0 32px; inline-size: calc(32px * var(--autumn-ui-scale)); block-size: calc(32px * var(--autumn-ui-scale)); border-radius: calc(8px * var(--autumn-ui-scale)); }
[data-autumn-settings-extras] .settings-security-list { display: grid; gap: 0; }
[data-autumn-settings-extras] .settings-security-item { display: grid; grid-template-columns: calc(22px * var(--autumn-ui-scale)) minmax(0, 1fr); align-items: start; gap: calc(10px * var(--autumn-ui-scale)); padding-block: calc(12px * var(--autumn-ui-scale)); border: 0; background: transparent; box-shadow: none; }
[data-autumn-settings-extras] .settings-security-item > div { display: grid; min-inline-size: 0; gap: calc(3px * var(--autumn-ui-scale)); }
[data-autumn-settings-extras] .settings-security-item strong { color: var(--autumn-text); font-size: var(--autumn-ui-text-sm); }
[data-autumn-settings-extras] .settings-security-item small { color: var(--autumn-text-muted); font-size: var(--autumn-ui-text-xs); }
[data-autumn-settings-extras] .settings-security-status { display: flex; grid-column: 2; justify-self: start; align-items: center; gap: calc(8px * var(--autumn-ui-scale)); color: var(--autumn-text); font-size: var(--autumn-ui-text-sm); }
[data-autumn-settings-extras] .settings-security-duration { display: flex; justify-self: start; align-items: center; flex-wrap: wrap; gap: calc(8px * var(--autumn-ui-scale)); max-inline-size: 100%; color: var(--autumn-text); font-size: var(--autumn-ui-text-sm); }
[data-autumn-settings-extras] .settings-security-duration input[type="number"] { --autumn-settings-input-width: calc(100px * var(--autumn-ui-scale)); max-inline-size: 100%; min-inline-size: 0; }
[data-autumn-settings-extras] :is(.settings-card-icon, .settings-security-item) svg { inline-size: calc(20px * var(--autumn-ui-scale)); block-size: calc(20px * var(--autumn-ui-scale)); flex: 0 0 20px; }
[data-autumn-settings-extras] :is(.settings-card-icon, .settings-security-item) :is(svg, svg *) { fill: none !important; stroke: currentColor !important; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

[data-autumn-settings-extras] > .settings-security-card {
  grid-column: auto;
  min-inline-size: 0;
  min-block-size: min-content;
  block-size: auto;
  padding: var(--autumn-ui-gap) 0 0;
  border-block-start: 1px solid var(--autumn-border);
}

[data-autumn-settings-extras] {
  display: grid;
  grid-template-columns: minmax(0, 2.13fr) minmax(0, 1fr);
  gap: calc(var(--autumn-ui-gap) * 2);
  min-inline-size: 0;
  align-items: start;
}

.autumn-appearance-card--background .autumn-appearance-upload {
  min-block-size: var(--autumn-ui-hit-target);
}

.autumn-appearance-scale-control {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) calc(88px * var(--autumn-ui-scale));
  align-items: center;
  gap: calc(12px * var(--autumn-ui-scale));
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .autumn-appearance-scale-control input[type="number"] {
  box-sizing: border-box;
  inline-size: 100%;
  min-inline-size: 0;
  height: calc(38px * var(--autumn-ui-scale)) !important;
  min-block-size: calc(38px * var(--autumn-ui-scale)) !important;
  padding: 0 calc(8px * var(--autumn-ui-scale));
  border: 1px solid var(--autumn-border);
  border-radius: calc(10px * var(--autumn-ui-scale));
  background: var(--autumn-control-surface);
  color: var(--autumn-text);
  font: 500 var(--autumn-ui-text-sm)/1.4 var(--autumn-ui-font-family) !important;
}

.autumn-appearance-fields-two {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--autumn-ui-gap);
}

.autumn-appearance-timezone-action {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px 12px;
  min-inline-size: 0;
}

.autumn-appearance-timezone-action small {
  flex: 1 1 260px;
  min-inline-size: 0;
  color: var(--autumn-text-muted);
  overflow-wrap: anywhere;
}

.autumn-appearance-field,
.autumn-appearance-upload {
  display: grid;
  gap: 6px;
  color: var(--autumn-text);
  font-size: var(--autumn-ui-text-xs);
  font-weight: 750;
}

.autumn-appearance-field > span,
.autumn-appearance-upload > span {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
}

.autumn-appearance-field small,
.autumn-appearance-upload small {
  color: var(--autumn-text-muted);
  font-weight: 500;
}

.autumn-appearance-field :where(select, input[type="color"]),
.autumn-appearance-upload {
  inline-size: 100%;
  min-block-size: var(--autumn-ui-control-height);
  border: 1px solid var(--autumn-border);
  border-radius: calc(var(--autumn-ui-radius) * .65);
  color: var(--autumn-text);
  background: var(--autumn-surface-elevated);
}

.autumn-appearance-field select {
  padding-inline: 12px 34px;
  font-size: var(--autumn-ui-text-sm);
}

.autumn-appearance-field input[type="color"] {
  padding: 4px;
  cursor: pointer;
}

.autumn-appearance-field input[type="range"] {
  inline-size: 100%;
  min-block-size: var(--autumn-ui-hit-target);
  accent-color: var(--autumn-accent-primary);
  cursor: pointer;
}

.autumn-appearance-upload {
  position: relative;
  align-content: center;
  min-block-size: calc(var(--autumn-ui-control-height) * 1.65);
  padding-block: 10px;
  padding-inline: 14px;
  border-style: dashed;
  cursor: pointer;
}

.autumn-appearance-upload input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}

.autumn-appearance-upload:focus-within,
.autumn-appearance-segments label:focus-within span {
  outline: var(--autumn-ui-focus-width) solid var(--autumn-focus);
  outline-offset: 2px;
}

.autumn-appearance-segments {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, max-content));
  justify-content: start;
  gap: calc(8px * var(--autumn-ui-scale));
  min-inline-size: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.autumn-appearance-segments label {
  position: relative;
  min-inline-size: 0;
  cursor: pointer;
}

.autumn-appearance-segments input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}

.autumn-appearance-segments span {
  display: grid;
  min-block-size: var(--autumn-ui-control-height);
  place-items: center;
  padding-inline: 8px;
  border: 1px solid var(--autumn-border);
  border-radius: calc(var(--autumn-ui-radius) * .65);
  color: var(--autumn-text-muted);
  background: var(--autumn-surface);
  font-weight: 750;
  text-align: center;
}

.autumn-appearance-segments input:checked + span {
  border-color: var(--autumn-accent-primary);
  color: var(--autumn-text-muted);
  background: var(--autumn-accent-primary-soft);
  box-shadow: inset 0 0 0 1px var(--autumn-accent-primary);
}

.autumn-appearance-scale-marks {
  display: flex;
  justify-content: space-between;
  gap: 4px;
  color: var(--autumn-text-muted);
  font-size: var(--autumn-ui-text-xs);
}

.autumn-appearance-palette {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  min-block-size: var(--autumn-ui-hit-target);
}

.autumn-appearance-palette button {
  inline-size: var(--autumn-ui-hit-target);
  block-size: var(--autumn-ui-hit-target);
  padding: 4px;
  border: 3px solid var(--autumn-surface-elevated);
  border-radius: 50%;
  background: var(--autumn-photo-color);
  box-shadow: 0 0 0 1px var(--autumn-border), 0 5px 12px color-mix(in srgb, var(--autumn-shadow-color), transparent 24%);
  cursor: pointer;
}

.autumn-adaptive-identity {
  display: grid;
  gap: calc(var(--autumn-ui-gap) * .72);
  min-inline-size: 0;
  padding: calc(var(--autumn-ui-gap) * .5) 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.autumn-adaptive-identity > header,
.autumn-adaptive-identity__contrast {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px 14px;
  min-inline-size: 0;
}

.autumn-adaptive-identity > header > div {
  flex: 1 1 auto;
  min-inline-size: 0;
}

.autumn-adaptive-identity__actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  align-items: center;
  gap: calc(8px * var(--autumn-ui-scale));
  min-inline-size: 0;
}

.autumn-adaptive-identity h4,
.autumn-adaptive-identity p {
  margin: 0;
}

.autumn-adaptive-identity h4 {
  color: var(--autumn-text);
  font-size: var(--autumn-ui-text-md);
  font-weight: 800;
}

.autumn-adaptive-identity p,
.autumn-adaptive-identity output,
.autumn-adaptive-identity small {
  color: var(--autumn-text-muted);
}

.autumn-adaptive-identity output[data-tone="success"] {
  color: var(--autumn-success);
}

.autumn-adaptive-identity output[data-tone="error"] {
  color: var(--autumn-danger);
}

.autumn-adaptive-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1 1 280px;
  min-inline-size: 0;
  min-block-size: var(--autumn-ui-hit-target);
  cursor: pointer;
}

.autumn-adaptive-toggle input {
  inline-size: 21px;
  block-size: 21px;
  flex: 0 0 auto;
  accent-color: var(--autumn-accent-primary);
}

.autumn-adaptive-toggle span {
  display: grid;
  min-inline-size: 0;
}

.autumn-adaptive-influence legend {
  grid-column: 1 / -1;
  padding: 0;
  color: var(--autumn-text-muted);
  font-size: var(--autumn-ui-text-xs);
  font-weight: 750;
}

.autumn-adaptive-identity__swatches {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  min-block-size: 32px;
}

.autumn-adaptive-identity__swatches > span {
  inline-size: 44px;
  block-size: 28px;
  border: 2px solid var(--autumn-surface-elevated);
  border-radius: calc(var(--autumn-ui-radius) * .52);
  background: var(--autumn-identity-color);
  box-shadow: 0 0 0 1px var(--autumn-border);
}

.autumn-adaptive-identity__metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.autumn-adaptive-identity__metrics > span {
  display: grid;
  gap: 2px;
  min-inline-size: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--autumn-text-muted);
  background: transparent;
  font-size: var(--autumn-ui-text-xs);
}

.autumn-adaptive-identity__metrics strong {
  color: var(--autumn-text);
  font-size: var(--autumn-ui-text-sm);
}

.autumn-adaptive-identity__contrast {
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--autumn-text);
  background: transparent;
}

.autumn-adaptive-identity__contrast.is-pass strong {
  color: var(--autumn-success);
}

.autumn-adaptive-identity__contrast.is-fail strong {
  color: var(--autumn-danger);
}

.autumn-adaptive-identity [hidden],
.autumn-appearance-palette[hidden] {
  display: none !important;
}

.autumn-appearance-primary,
.autumn-appearance-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-block-size: var(--autumn-ui-hit-target);
  min-inline-size: 112px;
  max-inline-size: 100%;
  padding-block: 8px;
  padding-inline: 16px;
  border-radius: calc(var(--autumn-ui-radius) * .7);
  font-size: var(--autumn-ui-text-sm);
  font-weight: 800;
  line-height: 1.25;
  white-space: normal;
  text-align: center;
  cursor: pointer;
}

.autumn-appearance-primary {
  border: 1px solid color-mix(in srgb, var(--autumn-accent-primary), var(--autumn-surface-elevated) 25%);
  color: var(--autumn-accent-on-primary);
  background: var(--autumn-interactive-gradient);
  box-shadow: 0 9px 20px color-mix(in srgb, var(--autumn-accent-primary), transparent 72%);
}

.autumn-appearance-secondary {
  border: 1px solid var(--autumn-border);
  color: var(--autumn-text);
  background: var(--autumn-surface-elevated);
}

.autumn-appearance-studio button:disabled {
  cursor: wait;
  opacity: .62;
}

.autumn-appearance-dialog,
.autumn-appearance-menu,
.autumn-appearance-studio [role="dialog"],
.autumn-appearance-studio [role="menu"] {
  max-inline-size: min(94vw, 720px);
  min-inline-size: 0;
  overflow-wrap: anywhere;
}

.autumn-visually-hidden {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

html[dir="rtl"][data-autumn-appearance="true"] .autumn-appearance-studio {
  font-family: var(--autumn-ui-font-family);
}

html[dir="rtl"] :is(
  .ds-approved-design-studio .ds-approved-canvas,
  .ds-approved-stage,
  .ds-approved-canvas,
  .design-studio-canvas,
  #design-studio-canvas,
  #design-studio-inline-text,
  .player-preview,
  .samsung-player-preview,
  .android-player-preview,
  .screen-live-preview,
  .timeline,
  .fallback-timeline,
  .dashboard-timeline,
  .approved-week-canvas,
  [data-player-preview],
  [data-design-canvas]
) {
  direction: ltr;
  unicode-bidi: isolate;
}

/* Admin-shell integration. These rules deliberately stop at the Admin UI;
   canvas/player content keeps its own typography, colors and geometry. */
html[data-autumn-appearance="true"] body #app,
html[data-autumn-appearance="true"] body #app :where(button, input, select, textarea):not(#design-studio-inline-text):not(:where(.ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *)) {
  font-family: var(--autumn-ui-font-family) !important;
}

/* Some approved page passes declare Poppins directly after this stylesheet.
   Keep those Admin UI containers on the selected local stack; Design canvas
   content remains isolated with its own coordinates and layer typography. */
html[data-autumn-appearance="true"] body #app#app.shell #view#view :is(
  .dashboard-shell,
  .approved-users-page,
  .approved-users-table-card,
  .ds-approved-design-studio,
  .settings-appearance-page.settings-advanced-page,
  .settings-advanced-grid,
  .settings-appearance-card.settings-advanced-card
) {
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body #app#app.shell #view#view :is(
  .dashboard-shell,
  .approved-users-page,
  .approved-users-table-card,
  .ds-approved-design-studio,
  .settings-appearance-page.settings-advanced-page,
  .settings-advanced-grid,
  .settings-appearance-card.settings-advanced-card
) :where(*):not(.ds-approved-stage):not(.ds-approved-stage *):not(#design-studio-canvas):not(#design-studio-canvas *):not(#design-studio-inline-text) {
  font-family: inherit !important;
}

html[data-autumn-appearance="true"] body #app.shell {
  --autumn-sidebar-inline-size: calc(240px * var(--autumn-ui-scale));
  color: var(--autumn-text) !important;
}

html[data-autumn-appearance="true"] body #app.shell > main,
html[data-autumn-appearance="true"] body #app.shell > main > .page {
  color: var(--autumn-text) !important;
  background: var(--autumn-page-surface, transparent) !important;
}

@media (min-width: 801px) {
  html[data-autumn-appearance="true"] body #app.shell:not(.premium-v1-shell) > aside.side {
    box-sizing: border-box !important;
    inline-size: var(--autumn-sidebar-inline-size) !important;
    min-inline-size: var(--autumn-sidebar-inline-size) !important;
    max-inline-size: var(--autumn-sidebar-inline-size) !important;
    padding: calc(20px * var(--autumn-ui-scale)) calc(14px * var(--autumn-ui-scale)) calc(214px * var(--autumn-ui-scale)) !important;
    border-color: color-mix(in srgb, var(--autumn-border), transparent 12%) !important;
    background: color-mix(in srgb, var(--autumn-sidebar-surface), transparent 4%) !important;
    box-shadow: 8px 0 32px color-mix(in srgb, var(--autumn-shadow-color), transparent 20%) !important;
  }

  html[dir="ltr"][data-autumn-appearance="true"] body #app.shell > main {
    margin-inline-start: var(--autumn-sidebar-inline-size) !important;
    margin-inline-end: 0 !important;
  }

  html[dir="rtl"][data-autumn-appearance="true"] body #app.shell:not(.premium-v1-shell) > aside.side {
    inset: 0 0 0 auto !important;
    border-right: 0 !important;
    border-left: 1px solid var(--autumn-border) !important;
    box-shadow: -8px 0 32px color-mix(in srgb, var(--autumn-shadow-color), transparent 20%) !important;
  }

  html[dir="rtl"][data-autumn-appearance="true"] body #app.shell > main,
  html[dir="rtl"][data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily) #app > main {
    margin-left: 0 !important;
    margin-right: var(--autumn-sidebar-inline-size) !important;
  }

  /* The approved shell pass uses a two-ID selector and physical left offsets.
     Mirror that exact desktop geometry at higher specificity for RTL. */
  html[dir="rtl"][data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app.shell > aside.side {
    inset: 14px 14px 14px auto !important;
    box-shadow: -8px 0 32px color-mix(in srgb, var(--autumn-shadow-color), transparent 20%) !important;
  }

  /* The approved shell also keeps a fixed physical left gutter in LTR. Its
     older width calculation subtracts only the 240px sidebar, while the
     actual gutter is 272px; use auto width so live RTL -> LTR previews do
     not add that 32px difference to the document width. */
  html[dir="ltr"][data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app.shell > main {
    width: auto !important;
    min-width: 0 !important;
    margin-left: 272px !important;
    margin-right: 0 !important;
  }

  html[dir="rtl"][data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app.shell > main {
    width: auto !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 272px !important;
  }

  html[data-autumn-appearance="true"] body #app.shell > main > .page:not(:has(> .autumn-premium-users)) {
    padding: 0 calc(22px * var(--autumn-ui-scale)) calc(32px * var(--autumn-ui-scale)) !important;
  }
}

@media (min-width: 801px) and (max-width: 1450px) {
  html[dir="ltr"][data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app.shell > main {
    margin-left: 260px !important;
    margin-right: 0 !important;
  }

  html[dir="rtl"][data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app.shell > main {
    margin-left: 0 !important;
    margin-right: 260px !important;
  }
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app.shell > aside.side {
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app.shell > aside.side :where(*) {
  font-family: inherit !important;
}

/* Approved shell styles set a late !important font shorthand on each nav
   button. Apply the active local Admin font directly with higher specificity
   while preserving that shorthand's weight, size and line height. */
html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app.shell > aside.side > nav.nav > button {
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body #app .top {
  min-block-size: calc(68px * var(--autumn-ui-scale)) !important;
  padding: calc(15px * var(--autumn-ui-scale)) calc(28px * var(--autumn-ui-scale)) !important;
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background: color-mix(in srgb, var(--autumn-header-surface), transparent 5%) !important;
}

html[data-autumn-appearance="true"] body #app .nav {
  gap: calc(7px * var(--autumn-ui-scale)) !important;
}

html[data-autumn-appearance="true"] body #app .nav button {
  min-block-size: calc(48px * var(--autumn-ui-scale)) !important;
  padding: calc(10px * var(--autumn-ui-scale)) calc(13px * var(--autumn-ui-scale)) !important;
  border-radius: var(--autumn-ui-radius) !important;
  color: var(--autumn-text-muted) !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: var(--autumn-ui-text-sm) !important;
}

html[data-autumn-appearance="true"] body #app .nav button.active {
  color: var(--autumn-accent-primary) !important;
  background: transparent !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--autumn-accent-primary), transparent 28%) !important;
}

html[data-autumn-appearance="true"] body #app .nav button.active:focus-visible {
  outline: 0 !important;
}

html[dir="rtl"][data-autumn-appearance="true"] body #app .nav button {
  text-align: right !important;
}

html[dir="rtl"][data-autumn-appearance="true"] body #app .nav button.active {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--autumn-accent-primary), transparent 28%) !important;
}

html[data-autumn-appearance="true"] body #app :where(.panel, [role="dialog"] > section, [role="menu"]):not(:where(.autumn-saas-settings, .autumn-saas-settings *, .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)),
html[data-autumn-appearance="true"] body #app :is([class*="card"]):not([class*="template"]):not([class^="ds-"]):not([class*=" ds-"]):not(:where(.autumn-saas-settings, .autumn-saas-settings *, .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: color-mix(in srgb, var(--autumn-surface-elevated), transparent 5%) !important;
}

html[data-autumn-appearance="true"] body #app :where(h1, h2, h3, h4, strong):not(:where(.ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)) {
  color: var(--autumn-text);
}

html[data-autumn-appearance="true"] body #app :where(p, small, .empty):not(:where(.ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)) {
  color: var(--autumn-text-muted);
}

html[data-autumn-appearance="true"] body #app :where(button, input, select, textarea):not(#design-studio-inline-text):not(:where(.autumn-system-logs, .autumn-system-logs *, .approved-standalone-schedules *, .approved-standalone-daily *, .autumn-premium-users *, .ds-approved-design-studio *, .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)) {
  min-block-size: var(--autumn-ui-control-height);
  border-radius: calc(var(--autumn-ui-radius) * .72) !important;
  font-size: var(--autumn-ui-text-sm) !important;
}

html[data-autumn-appearance="true"] body #app :where(input, select, textarea):not(#design-studio-inline-text):not(:where(.autumn-system-logs, .autumn-system-logs *, .approved-standalone-schedules *, .approved-standalone-daily *, .ds-approved-design-studio *, .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background: color-mix(in srgb, var(--autumn-control-surface), transparent 2%) !important;
}

html[data-autumn-appearance="true"] body #app button:not(.dashboard-list-row):not(.nav button):not(.danger):not(.autumn-appearance-secondary):not([class*="template"]):not(:where(.autumn-system-logs, .autumn-system-logs *, .approved-standalone-schedules *, .approved-standalone-daily *, .autumn-premium-users *, .ds-approved-design-studio *, .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)) {
  border-color: color-mix(in srgb, var(--autumn-accent-primary), var(--autumn-surface-elevated) 25%) !important;
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-interactive-gradient) !important;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--autumn-accent-primary), transparent 76%) !important;
}

html[data-autumn-appearance="true"] body #app button.danger:not(:where(.autumn-system-logs, .autumn-system-logs *, .approved-standalone-schedules *, .approved-standalone-daily *, .ds-approved-design-studio *, .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)) {
  color: var(--autumn-danger-on) !important;
  background: linear-gradient(135deg, var(--autumn-danger), color-mix(in srgb, var(--autumn-danger), var(--autumn-text) 35%)) !important;
}

html[data-autumn-appearance="true"] body #app :where(table, th, td):not(:where(.autumn-system-logs, .autumn-system-logs *, .approved-standalone-schedules *, .approved-standalone-daily *, .autumn-premium-users *, .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)) {
  border-color: var(--autumn-border) !important;
}

html[data-autumn-appearance="true"] body #app :where(th, td):not(:where(.autumn-system-logs, .autumn-system-logs *, .approved-standalone-schedules *, .approved-standalone-daily *, .autumn-premium-users *, .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)) {
  padding: calc(11px * var(--autumn-ui-scale)) calc(12px * var(--autumn-ui-scale)) !important;
  font-size: var(--autumn-ui-text-sm) !important;
}

html[dir="rtl"][data-autumn-appearance="true"] body #app :where(th, td, .section-head, [role="dialog"], [role="menu"]) {
  text-align: right;
}

.autumn-saas-settings {
  display: grid;
  gap: var(--autumn-ui-gap);
  min-block-size: calc(100vh - 32px);
  padding: var(--autumn-ui-card-padding);
  overflow: hidden;
  border: 1px solid var(--autumn-border);
  border-radius: calc(var(--autumn-ui-radius) + 5px);
  background: color-mix(in srgb, var(--autumn-surface), transparent 12%);
  box-shadow: 0 18px 46px color-mix(in srgb, var(--autumn-text), transparent 88%);
}

.autumn-saas-settings__heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: var(--autumn-ui-gap);
}

.autumn-saas-settings__heading h1,
.autumn-saas-settings__heading p {
  margin: 0;
}

.autumn-saas-settings__heading h1 {
  font-size: calc(var(--autumn-ui-text-lg) * 1.75);
}

.autumn-saas-settings__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 5px;
  border: 1px solid var(--autumn-border);
  border-radius: var(--autumn-ui-radius);
  background: color-mix(in srgb, var(--autumn-surface-elevated), transparent 8%);
}

.autumn-saas-settings__tabs button {
  flex: 0 1 calc(132px * var(--autumn-ui-scale));
  min-inline-size: 0;
  max-inline-size: 100%;
  overflow-wrap: anywhere;
  white-space: normal;
}

.autumn-saas-settings__tabs button:not(.active) {
  border-color: transparent !important;
  color: var(--autumn-text-muted) !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[dir="rtl"] :is(
  [data-technical],
  [data-technical-type="email"],
  [data-technical-type="ip"],
  [data-technical-type="screenId"],
  [data-technical-type="deviceToken"],
  [data-technical-type="url"],
  [data-technical-type="hash"],
  .email-address,
  .ip-address,
  .screen-id,
  .device-token,
  .url-value,
  .hash-value,
  .autumn-technical-value,
  input[type="email"],
  input[type="url"]
) {
  direction: ltr;
  unicode-bidi: isolate;
  text-align: start;
}

/* Admin-wide Appearance propagation. Keep this section after the legacy page
   integrations: app.js injects several older skins at runtime, so the admin
   scope and the token aliases below deliberately have stronger specificity. */
html[data-autumn-appearance="true"] {
  --autumn-appearance-content-overlay: color-mix(in srgb, var(--autumn-surface-elevated), transparent 12%);
  --autumn-panel: var(--autumn-appearance-content-overlay);
  --autumn-panel-strong: var(--autumn-appearance-content-overlay);
  --autumn-panel-border: var(--autumn-border);
  --autumn-muted: var(--autumn-text-muted);
  --autumn-accent: var(--autumn-accent-primary);
  --autumn-plum: var(--autumn-text);
  --autumn-shadow: 0 16px 38px color-mix(in srgb, var(--autumn-text), transparent 88%);
  --autumn-ui-accent: var(--autumn-accent-primary);
  --autumn-ui-accent-deep: var(--autumn-accent-primary-hover);
  --autumn-ui-accent-soft: var(--autumn-accent-primary-soft);
  --autumn-button-text: var(--autumn-text);
  --autumn-button-border: var(--autumn-border);
  --autumn-button-bg: color-mix(in srgb, var(--autumn-appearance-content-overlay), var(--autumn-accent-primary-soft) 12%);
  --autumn-button-shadow: 0 7px 17px color-mix(in srgb, var(--autumn-text), transparent 90%);
  --autumn-success-soft: color-mix(in srgb, var(--autumn-appearance-content-overlay), var(--autumn-success) 13%);
  --autumn-warning-soft: color-mix(in srgb, var(--autumn-appearance-content-overlay), var(--autumn-warning) 15%);
  --autumn-danger-soft: color-mix(in srgb, var(--autumn-appearance-content-overlay), var(--autumn-danger) 13%);
  --autumn-info-soft: color-mix(in srgb, var(--autumn-appearance-content-overlay), var(--autumn-info) 13%);
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) {
  color: var(--autumn-text) !important;
  background-color: var(--autumn-canvas) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) > #autumn-app-backdrop#autumn-app-backdrop,
html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #autumn-app-backdrop#autumn-app-backdrop {
  background-color: var(--autumn-canvas) !important;
  background-image:
    linear-gradient(var(--autumn-appearance-background-overlay), var(--autumn-appearance-background-overlay)),
    var(--autumn-appearance-background-image) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell > main,
html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell > main > .page,
html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell #view#view#view {
  color: var(--autumn-text) !important;
  background-color: var(--autumn-page-surface, transparent) !important;
  background-image: none !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell > aside.side,
html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell > aside.side * {
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell #view#view#view :is(
  .dashboard-shell,
  .approved-screens-page,
  .approved-screen-schedule,
  .approved-standalone-schedules,
  .approved-standalone-daily,
  .approved-users-page,
  .autumn-saas-settings,
  .settings-appearance-page
),
html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell #view#view#view :is(
  .dashboard-shell,
  .approved-screens-page,
  .approved-screen-schedule,
  .approved-standalone-schedules,
  .approved-standalone-daily,
  .approved-users-page,
  .autumn-saas-settings,
  .settings-appearance-page
) :where(*):not(.ds-approved-stage):not(.ds-approved-stage *):not(#design-studio-canvas):not(#design-studio-canvas *):not(#design-studio-inline-text):not([data-design-canvas]):not([data-design-canvas] *):not([data-player-preview] *):not(.player-preview *):not(.ds-template-composite):not(.ds-template-composite *):not(.ds-approved-template-placeholder):not(.ds-approved-template-placeholder *):not(.ds-template-real-preview):not(.ds-template-real-preview *):not(.ds-hotel-template-preview):not(.ds-hotel-template-preview *):not(.ds-template-loading-preview) {
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell #view#view#view .ds-approved-design-studio,
html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell #view#view#view .ds-approved-design-studio :not(.ds-approved-stage):not(.ds-approved-stage *):not(#design-studio-canvas):not(#design-studio-inline-text) {
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell #view#view#view :is(
  .dashboard-shell,
  .approved-screens-page,
  .approved-screen-schedule,
  .approved-standalone-schedules,
  .approved-standalone-daily,
  .approved-users-page,
  .autumn-saas-settings,
  .settings-appearance-page
) {
  color: var(--autumn-text) !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell #view#view#view :is(
  .dashboard-shell,
  .approved-screens-page,
  .approved-screen-schedule,
  .approved-standalone-schedules,
  .approved-standalone-daily,
  .approved-users-page,
  .autumn-saas-settings,
  .settings-appearance-page
) :is(.panel, article, [class$="-card"], [class*="-card "], [class*=" table"], [class$="-table"]):not([class*="template"]):not(:where(.autumn-saas-settings, .autumn-saas-settings *, .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-appearance-content-overlay) !important;
  background-image: none !important;
  box-shadow: var(--autumn-shadow) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell #view#view#view :is(
  .dashboard-shell,
  .approved-screens-page,
  .approved-screen-schedule,
  .approved-standalone-schedules,
  .approved-standalone-daily,
  .approved-users-page,
  .autumn-saas-settings,
  .settings-appearance-page
) :is(h1, h2, h3, h4, h5, strong, label):not(:where(.ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)) {
  color: var(--autumn-text) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell #view#view#view :is(
  .dashboard-shell,
  .approved-screens-page,
  .approved-screen-schedule,
  .approved-standalone-schedules,
  .approved-standalone-daily,
  .approved-users-page,
  .autumn-saas-settings,
  .settings-appearance-page
) :is(p, small, time, .empty, [class*="muted"], [class*="subtitle"], [class*="description"]):not(:where(.ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)) {
  color: var(--autumn-text-muted) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell #view#view#view :is(
  .dashboard-shell,
  .approved-screens-page,
  .approved-screen-schedule,
  .approved-users-page,
  .autumn-saas-settings,
  .settings-appearance-page
) :is(input, select, textarea):not(:where(.ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)),
html[data-autumn-appearance="true"] body :is([role="dialog"]:not(.autumn-permission-editor), [role="menu"], .dashboard-alarm-modal, .autumn-organizer-modal) :is(input, select, textarea) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-appearance-content-overlay) !important;
  background-image: none !important;
  caret-color: var(--autumn-accent-primary) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell #view#view#view :is(
  .dashboard-shell,
  .approved-screens-page,
  .approved-screen-schedule,
  .approved-users-page,
  .autumn-saas-settings,
  .settings-appearance-page
) button:not(.dashboard-list-row):not(.danger):not([aria-selected="true"]):not([aria-pressed="true"]):not(.active):not(.selected):not(:where(.ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)),
html[data-autumn-appearance="true"] body :is([role="dialog"]:not(.autumn-permission-editor), [role="menu"], .dashboard-alarm-modal, .autumn-organizer-modal) button:not(.danger):not(.active) {
  border-color: var(--autumn-button-border) !important;
  color: var(--autumn-button-text) !important;
  background: var(--autumn-button-bg) !important;
  box-shadow: var(--autumn-button-shadow) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell #view#view#view :is(
  .dashboard-shell,
  .approved-screens-page,
  .approved-screen-schedule,
  .approved-users-page,
  .autumn-saas-settings,
  .settings-appearance-page
) :is(button.active, button.selected, button[aria-selected="true"], button[aria-pressed="true"], .approved-create-schedule, .approved-invite-user, .identity-add, .autumn-appearance-primary):not(:where(.ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)) {
  border-color: var(--autumn-accent-primary) !important;
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-interactive-gradient) !important;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--autumn-accent-primary), transparent 76%) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell #view#view#view table:not(:where(.autumn-system-logs, .autumn-system-logs *, .approved-standalone-schedules *, .approved-standalone-daily *, .autumn-premium-users *)) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-appearance-content-overlay) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell #view#view#view :is(thead, th):not(:where(.autumn-system-logs, .autumn-system-logs *, .approved-standalone-schedules *, .approved-standalone-daily *, .autumn-premium-users *)) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text-muted) !important;
  background: color-mix(in srgb, var(--autumn-appearance-content-overlay), var(--autumn-accent-primary-soft) 10%) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell #view#view#view :is(tbody, tr, td):not(:where(.autumn-system-logs, .autumn-system-logs *, .approved-standalone-schedules *, .approved-standalone-daily *, .autumn-premium-users *)) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app.shell #view#view#view tbody tr:hover:not(:where(.autumn-system-logs, .autumn-system-logs *, .approved-standalone-schedules *, .approved-standalone-daily *, .autumn-premium-users *)) {
  background: var(--autumn-accent-primary-soft) !important;
}

html[data-autumn-appearance="true"] body :is(
  [role="dialog"]:not(.autumn-permission-editor),
  .dashboard-alarm-modal,
  .autumn-organizer-modal,
  .corrected-clock-modal,
  .time-editor-modal,
  .floor-cloud-modal,
  .playlist-name-modal,
  .autumn-daily-template-dialog
) {
  color: var(--autumn-text) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body :is(
  [role="dialog"]:not(.autumn-permission-editor),
  .dashboard-alarm-modal,
  .autumn-organizer-modal,
  .corrected-clock-modal,
  .time-editor-modal,
  .floor-cloud-modal,
  .playlist-name-modal,
  .autumn-daily-template-dialog
) :is(section, article, form, [class*="dialog"], [class*="modal"]):not([class*="preview"]):not([class*="canvas"]) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-appearance-content-overlay) !important;
  background-image: none !important;
  box-shadow: var(--autumn-shadow) !important;
}

html[data-autumn-appearance="true"] body :is(
  [role="menu"],
  .screen-row-popover,
  .approved-user-action-menu-portal,
  .approved-organizer-menu,
  .ds-tool-menu > div,
  .dashboard-profile-panel
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-appearance-content-overlay) !important;
  background-image: none !important;
  box-shadow: var(--autumn-shadow) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body :is(
  [role="menu"],
  .screen-row-popover,
  .approved-user-action-menu-portal,
  .approved-organizer-menu,
  .ds-tool-menu > div,
  .dashboard-profile-panel
) :is(button, [role="menuitem"]):hover {
  color: var(--autumn-accent-primary-hover) !important;
  background: var(--autumn-accent-primary-soft) !important;
}

html[data-autumn-appearance="true"] body :is(
  [role="status"],
  [aria-live="polite"].toast,
  [aria-live="assertive"],
  .toast,
  .notification,
  .snackbar,
  .flash-message
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-appearance-content-overlay) !important;
  background-image: none !important;
  box-shadow: var(--autumn-shadow) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

/* Adaptive Admin Chrome coverage. Every color in this layer is semantic and
   runtime-driven; Design/Player content is excluded below and in each broad
   selector above. */
html[data-autumn-appearance="true"] body #app :is(
  .approved-schedule-toolbar,
  .approved-standalone-daily-toolbar,
  .approved-users-toolbar,
  .approved-calendar-legend,
  .approved-mini-calendar,
  .dashboard-card-head,
  .screen-detail-tabs,
  .approved-schedule-context-tabs
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-header-surface) !important;
}

html[data-autumn-appearance="true"] body #app :is(
  .approved-organizer-dropdown,
  .approved-organizer-select-shell,
  .approved-content-picker,
  .approved-picker-scroll,
  .approved-users-table-wrap,
  .screen-detail-body,
  .dashboard-list,
  .dashboard-screen-pulse-list,
  .settings-advanced-grid
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-appearance-content-overlay) !important;
}

html[data-autumn-appearance="true"] body #app :is(
  .approved-view-switch button,
  .approved-schedule-context-tabs button,
  .screen-detail-tabs button,
  .settings-tabs button,
  .autumn-saas-settings__tabs button
).active,
html[data-autumn-appearance="true"] body #app :is(.calendar-day, .approved-mini-days button, .approved-mini-calendar button).selected,
html[data-autumn-appearance="true"] body #app :is(.calendar-day, .approved-mini-days button, .approved-mini-calendar button).today {
  border-color: var(--autumn-accent-primary) !important;
  color: var(--autumn-accent-primary-hover) !important;
  background: var(--autumn-selected-surface) !important;
  box-shadow: inset 0 0 0 1px var(--autumn-accent-primary) !important;
}

html[data-autumn-appearance="true"] body #app :is(
  .dashboard-status.online,
  .dashboard-health-simple-row.online,
  .dashboard-screen-pulse-row.online,
  .pairing-status.connected,
  .approved-detail-status.active,
  .approved-user-status.active,
  .approved-two-factor.enabled
) {
  border-color: var(--autumn-success) !important;
  color: var(--autumn-success) !important;
  background: var(--autumn-success-soft) !important;
}

html[data-autumn-appearance="true"] body #app :is(
  .dashboard-status.offline,
  .dashboard-health-simple-row.offline,
  .dashboard-screen-pulse-row.offline,
  .approved-schedule-state.error,
  .approved-users-error,
  .approved-user-status.disabled
) {
  border-color: var(--autumn-danger) !important;
  color: var(--autumn-danger) !important;
  background: var(--autumn-danger-soft) !important;
}

html[data-autumn-appearance="true"] body #app :is(
  .approved-schedule-state.loading,
  .approved-content-upload-status,
  .ds-save-state.saving,
  .dashboard-notification-item.warning
) {
  border-color: var(--autumn-warning) !important;
  color: var(--autumn-warning) !important;
  background: var(--autumn-warning-soft) !important;
}

html[data-autumn-appearance="true"] body #app :is(
  .runtime-mirror-header,
  .dashboard-notification-item.info,
  .ds-publish-state
) {
  border-color: var(--autumn-info) !important;
  color: var(--autumn-info) !important;
  background: var(--autumn-info-soft) !important;
}

/* Preview frames are Admin chrome, while their media pixels remain untouched. */
html[data-autumn-appearance="true"] body #app :is(
  .timeslot-preview,
  .screen-details-preview,
  .runtime-preview-canvas,
  .runtime-mirror-preview
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-appearance-content-overlay) !important;
  background-image: var(--autumn-canvas-gradient) !important;
  box-shadow: var(--autumn-shadow) !important;
}

html[data-autumn-appearance="true"] body :is(
  .screen-options-modal,
  .cloud-push-modal
) {
  color: var(--autumn-text) !important;
  background: color-mix(in srgb, var(--autumn-text), transparent 48%) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body :is(.screen-options-card, .cloud-push-card) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-surface-gradient) !important;
  box-shadow: var(--autumn-shadow) !important;
}

html[data-autumn-appearance="true"] body .screen-options-card > header,
html[data-autumn-appearance="true"] body .cloud-push-card {
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-interactive-gradient) !important;
}

html[data-autumn-appearance="true"] body :is(.screen-options-body, .screen-option-field) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-appearance-content-overlay) !important;
}

html[data-autumn-appearance="true"] body .screen-option-field select {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-control-surface) !important;
}

html[data-autumn-appearance="true"] body #app :is(button, [role="button"], a):not(:where(.ds-approved-design-studio *, .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)):hover {
  border-color: var(--autumn-accent-primary) !important;
}

html[data-autumn-appearance="true"] body #app :is(tbody tr, .dashboard-list-row, .approved-organizer-option):not(:where(.ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *, .player-preview *, .ds-template-composite *, .ds-approved-template-placeholder *, .ds-template-real-preview *, .ds-hotel-template-preview *)):hover {
  background-color: var(--autumn-hover-surface) !important;
}

/* Remaining dynamically rendered Admin chrome. The permission editor has a
   single static Premium V1 authority below and is intentionally absent here. */
html[data-autumn-appearance="true"] body #app :is(
  .screens-filter-popover,
  .runtime-mirror-facts
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-appearance-content-overlay) !important;
  background-image: none !important;
  box-shadow: var(--autumn-shadow) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body #app :is(
  .screens-extra-filters > summary,
  .screens-filter-popover label,
  .runtime-support h4,
  .runtime-support-advanced summary,
  .runtime-mirror-error strong,
  .runtime-mirror-facts :is(dt, dd),
  .runtime-mirror-preview > footer strong
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: transparent !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body #app :is(
  .runtime-support small,
  .runtime-support > p,
  .runtime-mirror-preview > footer,
  .runtime-mirror-facts dt
) {
  color: var(--autumn-text-muted) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body #app :is(
  .screens-filter-popover select,
  .runtime-support input
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-control-surface) !important;
  box-shadow: none !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body #app :is(
  .screens-extra-filters > summary,
  .screens-clear-filters,
  .screens-filter-popover .screens-clear-filters,
  .runtime-support button
) {
  border-color: var(--autumn-button-border) !important;
  color: var(--autumn-button-text) !important;
  background: var(--autumn-button-bg) !important;
  box-shadow: var(--autumn-button-shadow) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body #app :is(
  .screens-extra-filters > summary:hover,
  .screens-extra-filters > summary[aria-expanded="true"],
  .screens-filter-popover .screens-clear-filters:hover
) {
  border-color: var(--autumn-accent-primary) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-selected-surface) !important;
  box-shadow: inset 0 0 0 1px var(--autumn-accent-primary), var(--autumn-button-shadow) !important;
}

html[data-autumn-appearance="true"] body #app .runtime-mirror-facts dd.ready {
  border-color: var(--autumn-success) !important;
  color: var(--autumn-success) !important;
  background: var(--autumn-success-soft) !important;
}

html[data-autumn-appearance="true"] body #app :is(
  .runtime-mirror-error,
  .approved-users-error
) {
  border-color: var(--autumn-danger) !important;
  color: var(--autumn-danger) !important;
  background: var(--autumn-danger-soft) !important;
}

/* --------------------------------------------------------------------------
   Autumn Premium V1 — canonical permission editor

   This is the only visual authority for Invite New User / Edit User,
   permissions, and resource scope. Behaviour and data remain in app.js.
   -------------------------------------------------------------------------- */

body:has(> .autumn-permission-editor-layer) {
  overflow: hidden;
}

.autumn-permission-editor-layer,
.autumn-permission-editor-layer * {
  box-sizing: border-box;
}

.autumn-permission-editor-layer {
  position: fixed;
  z-index: 260;
  inset: 0;
  display: grid;
  place-items: center;
  min-inline-size: 0;
  padding: clamp(var(--premium-space-2), 1.5vw, var(--premium-space-6));
  overflow: hidden;
  background: var(--premium-surface-scrim);
  font-family: var(--premium-font-latin);
  overscroll-behavior: contain;
}

.autumn-permission-editor-layer .autumn-permission-editor {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  inline-size: min(100%, 1680px);
  max-inline-size: 100%;
  block-size: min(94vh, 980px);
  max-block-size: 94vh;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: var(--premium-border-width) solid var(--premium-border-default);
  border-radius: var(--premium-radius-dialog);
  color: var(--premium-text-primary);
  background: var(--premium-surface-elevated);
  box-shadow: 0 24px 64px var(--premium-shadow-colour);
  font: 400 15px/1.55 var(--premium-font-latin);
}

@supports (height: 100dvh) {
  .autumn-permission-editor-layer .autumn-permission-editor {
    block-size: min(94dvh, 980px);
    max-block-size: 94dvh;
  }
}

.autumn-permission-editor-layer .autumn-permission-editor:dir(rtl) {
  font-family: var(--premium-font-arabic);
}

.autumn-permission-editor > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--premium-space-4);
  min-inline-size: 0;
  padding-block: var(--premium-space-4);
  padding-inline: var(--premium-space-6);
  border-block-end: var(--premium-border-width) solid var(--premium-border-subtle);
  background: var(--premium-surface-base);
}

.autumn-permission-editor > header > div {
  display: flex;
  align-items: center;
  gap: var(--premium-space-3);
  min-inline-size: 0;
}

.autumn-permission-editor > header > div > div {
  min-inline-size: 0;
}

.autumn-permission-editor > header .autumn-leaf-brand.is-compact {
  display: block;
  flex: 0 0 48px;
  inline-size: 48px;
  block-size: 48px;
  object-fit: contain;
  filter: none;
}

.autumn-permission-editor > header small {
  display: block;
  margin: 0;
  color: var(--premium-brand-accent);
  font: 700 12px/1.45 var(--premium-font-latin);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.autumn-permission-editor > header h2 {
  margin: 0;
  color: var(--premium-text-primary);
  font: 700 28px/1.2 var(--premium-font-latin);
  letter-spacing: -.02em;
}

.autumn-permission-editor > header p {
  margin: var(--premium-space-1) 0 0;
  color: var(--premium-text-secondary);
  font: 400 12px/1.45 var(--premium-font-latin);
}

.autumn-permission-editor:dir(rtl) > header :is(small, h2, p) {
  font-family: var(--premium-font-arabic);
  letter-spacing: 0;
  text-transform: none;
}

.autumn-permission-editor > header > button {
  display: grid;
  place-items: center;
  flex: 0 0 var(--premium-icon-button-size);
  inline-size: var(--premium-icon-button-size);
  block-size: var(--premium-icon-button-size);
  margin: 0;
  padding: 0;
  border: var(--premium-border-width) solid var(--premium-border-default);
  border-radius: var(--premium-radius-control);
  color: var(--premium-text-secondary);
  background: var(--premium-surface-elevated);
  box-shadow: none;
  font: 500 22px/1 var(--premium-font-latin);
  cursor: pointer;
}

.autumn-permission-editor > header > button:hover {
  border-color: var(--premium-brand-accent);
  color: var(--premium-brand-accent-hover);
  background: var(--premium-brand-accent-soft);
}

.autumn-permission-editor :is(button, input, select, textarea):focus-visible {
  outline: 2px solid var(--premium-focus-ring);
  outline-offset: 2px;
}

.autumn-permission-editor > main {
  display: grid;
  grid-template-areas:
    "account preset"
    "matrix resources"
    "errors resources";
  grid-template-columns: minmax(0, 1.48fr) minmax(360px, 1fr);
  grid-template-rows: auto auto minmax(0, auto);
  align-content: start;
  min-inline-size: 0;
  min-block-size: 0;
  margin: 0;
  padding-block: var(--premium-space-4) var(--premium-space-5);
  padding-inline: var(--premium-space-6);
  overflow-x: hidden;
  overflow-y: auto;
  background: var(--premium-surface-elevated);
  scrollbar-gutter: stable;
  overscroll-behavior: contain;
}

.autumn-permission-editor > main > * {
  min-inline-size: 0;
}

.autumn-permission-editor .phase3-account-grid {
  grid-area: account;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  gap: var(--premium-space-2) var(--premium-space-5);
  padding-block-end: var(--premium-space-4);
  padding-inline-end: var(--premium-space-5);
  border-block-end: var(--premium-border-width) solid var(--premium-border-subtle);
}

.autumn-permission-editor :is(.field-label, .phase3-preset label) {
  display: grid;
  align-content: start;
  gap: var(--premium-space-1);
  min-inline-size: 0;
  margin: 0;
  color: var(--premium-text-primary);
  font: 600 13px/1.45 var(--premium-font-latin);
}

.autumn-permission-editor:dir(rtl) :is(.field-label, .phase3-preset label) {
  font-family: var(--premium-font-arabic);
}

.autumn-permission-editor :is(
  .field-label input:not([type="hidden"]):not([type="checkbox"]),
  .field-label select,
  .phase3-preset select
) {
  display: block;
  inline-size: 100%;
  min-inline-size: 0;
  block-size: var(--premium-control-height);
  margin: 0;
  padding-block: 0;
  padding-inline: var(--premium-space-3);
  border: var(--premium-border-width) solid var(--premium-border-default);
  border-radius: var(--premium-radius-control);
  color: var(--premium-text-primary);
  background: var(--premium-surface-elevated);
  box-shadow: none;
  font: 400 13px/1.45 var(--premium-font-latin);
}

.autumn-permission-editor:dir(rtl) :is(
  .field-label input:not([type="hidden"]):not([type="checkbox"]),
  .field-label select,
  .phase3-preset select
) {
  font-family: var(--premium-font-arabic);
}

.autumn-permission-editor :is(input, select, textarea)::placeholder {
  color: var(--premium-text-muted);
  opacity: 1;
}

.autumn-permission-editor :is(
  .field-label input:not([type="hidden"]):not([type="checkbox"]),
  .field-label select,
  .phase3-preset select
):focus {
  border-color: var(--premium-brand-accent);
  outline: 0;
  box-shadow: 0 0 0 2px var(--premium-focus-ring);
}

.autumn-permission-editor :is(input, select, textarea):disabled {
  color: var(--premium-text-muted);
  background: var(--premium-surface-subtle);
  cursor: not-allowed;
  opacity: .64;
}

.autumn-permission-editor .phase3-preset {
  grid-area: preset;
  display: grid;
  grid-template-columns: minmax(190px, 260px) minmax(0, 1fr);
  align-self: start;
  align-content: start;
  align-items: end;
  gap: var(--premium-space-4);
  min-inline-size: 0;
  margin: 0;
  padding-block-end: var(--premium-space-4);
  padding-inline-start: var(--premium-space-5);
  border: 0;
  border-block-end: var(--premium-border-width) solid var(--premium-border-subtle);
  border-inline-start: var(--premium-border-width) solid var(--premium-border-subtle);
  border-radius: 0;
  color: var(--premium-text-primary);
  background: transparent;
  box-shadow: none;
}

.autumn-permission-editor .phase3-preset p {
  min-inline-size: 0;
  margin: 0 0 var(--premium-space-2);
  color: var(--premium-text-secondary);
  font: 400 12px/1.45 var(--premium-font-latin);
  overflow-wrap: anywhere;
}

.autumn-permission-editor:dir(rtl) .phase3-preset p {
  font-family: var(--premium-font-arabic);
}

.autumn-permission-editor .phase3-matrix {
  grid-area: matrix;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  min-inline-size: 0;
  padding-block-start: var(--premium-space-3);
  padding-inline-end: var(--premium-space-5);
}

.autumn-permission-editor .phase3-permission-card {
  min-inline-size: 0;
  margin: 0;
  padding-block: 0 var(--premium-space-2);
  padding-inline: 0 var(--premium-space-4);
  overflow: visible;
  border: 0;
  border-radius: 0;
  color: var(--premium-text-primary);
  background: transparent;
  box-shadow: none;
}

.autumn-permission-editor .phase3-permission-card:nth-child(even) {
  padding-inline: var(--premium-space-4) 0;
  border-inline-start: var(--premium-border-width) solid var(--premium-border-subtle);
}

.autumn-permission-editor .phase3-permission-card:nth-child(n + 3) {
  padding-block-start: var(--premium-space-2);
  border-block-start: var(--premium-border-width) solid var(--premium-border-subtle);
}

.autumn-permission-editor .phase3-permission-card > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--premium-space-2);
  min-block-size: var(--premium-control-height-sm);
  padding-block-end: var(--premium-space-1);
  border-block-end: var(--premium-border-width) solid var(--premium-border-subtle);
  background: transparent;
}

.autumn-permission-editor .phase3-permission-card h3 {
  min-inline-size: 0;
  margin: 0;
  color: var(--premium-text-primary);
  font: 700 12px/1.45 var(--premium-font-latin);
  letter-spacing: .04em;
  overflow-wrap: anywhere;
}

.autumn-permission-editor:dir(rtl) .phase3-permission-card h3 {
  font-family: var(--premium-font-arabic);
  letter-spacing: 0;
}

.autumn-permission-editor .phase3-permission-card header button {
  flex: 0 0 auto;
  min-inline-size: 0;
  block-size: var(--premium-control-height-sm);
  margin: 0;
  padding-block: 0;
  padding-inline: var(--premium-space-3);
  border: var(--premium-border-width) solid var(--premium-border-default);
  border-radius: var(--premium-radius-control);
  color: var(--premium-text-secondary);
  background: var(--premium-surface-elevated);
  box-shadow: none;
  font: 600 12px/1 var(--premium-font-latin);
  cursor: pointer;
}

.autumn-permission-editor:dir(rtl) .phase3-permission-card header button {
  font-family: var(--premium-font-arabic);
}

.autumn-permission-editor .phase3-permission-card header button:hover {
  border-color: var(--premium-brand-accent);
  color: var(--premium-brand-accent-hover);
  background: var(--premium-brand-accent-soft);
}

.autumn-permission-editor .phase3-permission-card header button:is(:disabled, [aria-disabled="true"]) {
  border-color: var(--premium-border-subtle);
  color: var(--premium-text-muted);
  background: var(--premium-surface-subtle);
  box-shadow: none;
  cursor: not-allowed;
  opacity: .68;
}

.autumn-permission-editor .phase3-permission-card > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 var(--premium-space-2);
  min-inline-size: 0;
  padding-block-start: var(--premium-space-1);
}

.autumn-permission-editor .phase3-permission-row {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  gap: var(--premium-space-2);
  min-inline-size: 0;
  min-block-size: 44px;
  margin: 0;
  padding-block: var(--premium-space-1);
  padding-inline: var(--premium-space-1);
  border-radius: var(--premium-radius-sm);
  color: var(--premium-text-primary);
  background: transparent;
  cursor: pointer;
}

.autumn-permission-editor .phase3-permission-row:hover {
  background: var(--premium-surface-subtle);
}

.autumn-permission-editor .phase3-permission-row:has(input:checked) {
  background: color-mix(in srgb, var(--premium-surface-selected), transparent 46%);
}

.autumn-permission-editor .phase3-permission-row.is-dependency-locked {
  color: var(--premium-text-secondary);
  background: color-mix(in srgb, var(--premium-surface-subtle), var(--premium-surface-elevated) 34%);
  cursor: not-allowed;
}

.autumn-permission-editor .phase3-permission-row.is-dependency-locked:hover,
.autumn-permission-editor .phase3-permission-row.is-dependency-locked:has(input:checked) {
  background: color-mix(in srgb, var(--premium-surface-subtle), var(--premium-surface-elevated) 34%);
}

.autumn-permission-editor .phase3-permission-row.is-dependency-locked input {
  cursor: not-allowed;
}

.autumn-permission-editor .phase3-permission-row > span {
  display: grid;
  gap: 1px;
  min-inline-size: 0;
}

.autumn-permission-editor .phase3-permission-row strong {
  min-inline-size: 0;
  color: var(--premium-text-primary);
  font: 600 13px/1.35 var(--premium-font-latin);
  overflow-wrap: anywhere;
}

.autumn-permission-editor:dir(rtl) .phase3-permission-row strong {
  font-family: var(--premium-font-arabic);
}

.autumn-permission-editor .phase3-permission-row.sensitive strong {
  color: var(--premium-status-warning);
}

.autumn-permission-editor .phase3-permission-row.is-dependency-locked strong {
  color: var(--premium-text-secondary);
}

.autumn-permission-editor :is(
  [data-technical],
  .phase3-dependencies li,
  input[type="email"],
  #user-username,
  #user-password
) {
  direction: ltr;
  font-family: var(--premium-font-technical);
  unicode-bidi: isolate;
}

.autumn-permission-editor .phase3-permission-row small {
  min-inline-size: 0;
  color: var(--premium-text-muted);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.autumn-permission-editor .phase3-permission-row .phase3-permission-lock {
  display: block;
  min-inline-size: 0;
  margin-block-start: 2px;
  color: var(--premium-text-secondary);
  direction: inherit;
  font: 500 12px/1.4 var(--premium-font-latin);
  text-align: start;
  unicode-bidi: plaintext;
  overflow-wrap: anywhere;
}

.autumn-permission-editor .phase3-permission-row > .phase3-permission-lock {
  grid-column: 2;
}

.autumn-permission-editor:dir(rtl) .phase3-permission-row .phase3-permission-lock {
  font-family: var(--premium-font-arabic);
}

.autumn-permission-editor :is(
  input[type="checkbox"],
  .phase3-permission-row input[type="checkbox"],
  .phase3-resource-check input[type="checkbox"]
) {
  appearance: none;
  display: inline-grid;
  place-content: center;
  flex: 0 0 18px;
  inline-size: 18px;
  block-size: 18px;
  margin: 0;
  padding: 0;
  border: var(--premium-border-width) solid var(--premium-border-default);
  border-radius: 4px;
  color: var(--premium-text-on-accent);
  background-color: var(--premium-surface-elevated);
  background-image: none;
  box-shadow: none;
  cursor: pointer;
}

.autumn-permission-editor :is(
  input[type="checkbox"],
  .phase3-permission-row input[type="checkbox"],
  .phase3-resource-check input[type="checkbox"]
):checked {
  border-color: var(--premium-brand-accent);
  background-color: var(--premium-brand-accent);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.25 8.15 6.4 11.2 12.75 4.8' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 14px 14px;
}

.autumn-permission-editor :is(
  input[type="checkbox"],
  .phase3-permission-row input[type="checkbox"],
  .phase3-resource-check input[type="checkbox"]
):disabled {
  cursor: not-allowed;
  opacity: .48;
}

.autumn-permission-editor #phase3-resource-host {
  grid-area: resources;
  min-inline-size: 0;
  padding-block-start: var(--premium-space-3);
  padding-inline-start: var(--premium-space-5);
  border-inline-start: var(--premium-border-width) solid var(--premium-border-subtle);
}

.autumn-permission-editor .phase3-resource-access {
  min-inline-size: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--premium-text-primary);
  background: transparent;
  box-shadow: none;
}

.autumn-permission-editor .phase3-resource-access > header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: var(--premium-space-3);
  min-inline-size: 0;
  margin-block-end: var(--premium-space-2);
}

.autumn-permission-editor .phase3-resource-access > header > div {
  min-inline-size: 0;
}

.autumn-permission-editor .phase3-resource-access > header small {
  display: block;
  margin: 0;
  color: var(--premium-brand-accent);
  font: 700 12px/1.45 var(--premium-font-latin);
  letter-spacing: .04em;
}

.autumn-permission-editor .phase3-resource-access > header h3 {
  margin: 1px 0 0;
  color: var(--premium-text-primary);
  font: 600 16px/1.35 var(--premium-font-latin);
}

.autumn-permission-editor:dir(rtl) .phase3-resource-access > header :is(small, h3) {
  font-family: var(--premium-font-arabic);
  letter-spacing: 0;
}

.autumn-permission-editor .phase3-resource-access > header b {
  flex: 0 1 auto;
  max-inline-size: 48%;
  padding-block: var(--premium-space-1);
  padding-inline: var(--premium-space-2);
  border-radius: var(--premium-radius-sm);
  color: var(--premium-brand-accent-hover);
  background: var(--premium-brand-accent-soft);
  font: 600 12px/1.45 var(--premium-font-latin);
  text-align: start;
  overflow-wrap: anywhere;
}

.autumn-permission-editor:dir(rtl) .phase3-resource-access > header b {
  font-family: var(--premium-font-arabic);
}

.autumn-permission-editor .phase3-resource-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: var(--premium-space-2);
  min-inline-size: 0;
}

@media (min-width: 641px) {
  .autumn-permission-editor .phase3-resource-grid > article:nth-child(3):last-child {
    grid-column: 1 / -1;
  }
}

.autumn-permission-editor .phase3-resource-grid > article {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  align-content: start;
  min-inline-size: 0;
  min-block-size: 190px;
  margin: 0;
  padding: var(--premium-space-3);
  overflow: hidden;
  border: var(--premium-border-width) solid var(--premium-border-subtle);
  border-radius: var(--premium-radius-card);
  color: var(--premium-text-primary);
  background: var(--premium-surface-base);
  box-shadow: none;
}

.autumn-permission-editor .phase3-resource-grid > article.is-dependency-locked {
  grid-template-rows: auto auto minmax(0, 1fr);
  border-color: var(--premium-border-default);
  color: var(--premium-text-secondary);
  background: color-mix(in srgb, var(--premium-surface-subtle), var(--premium-surface-elevated) 34%);
  cursor: not-allowed;
}

.autumn-permission-editor .phase3-resource-grid h4 {
  min-inline-size: 0;
  margin: 0;
  color: var(--premium-text-primary);
  font: 600 13px/1.45 var(--premium-font-latin);
  overflow-wrap: anywhere;
}

.autumn-permission-editor:dir(rtl) .phase3-resource-grid h4 {
  font-family: var(--premium-font-arabic);
}

.autumn-permission-editor .phase3-resource-grid > article.is-dependency-locked h4 {
  color: var(--premium-text-secondary);
}

.autumn-permission-editor .phase3-resource-lock {
  min-inline-size: 0;
  margin: var(--premium-space-1) 0 0;
  color: var(--premium-text-secondary);
  direction: inherit;
  font: 500 12px/1.4 var(--premium-font-latin);
  text-align: start;
  unicode-bidi: plaintext;
  overflow-wrap: anywhere;
}

.autumn-permission-editor:dir(rtl) .phase3-resource-lock {
  font-family: var(--premium-font-arabic);
}

.autumn-permission-editor .phase3-resource-grid > article.is-dependency-locked > div {
  grid-row: 3;
}

.autumn-permission-editor .phase3-resource-grid article > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  gap: 0;
  min-inline-size: 0;
  max-block-size: 206px;
  margin-block-start: var(--premium-space-2);
  padding-block-start: var(--premium-space-1);
  overflow-x: hidden;
  overflow-y: auto;
  border-block-start: var(--premium-border-width) solid var(--premium-border-subtle);
  scrollbar-gutter: stable;
  overscroll-behavior: contain;
}

.autumn-permission-editor .phase3-resource-check {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  gap: var(--premium-space-2);
  min-inline-size: 0;
  min-block-size: 36px;
  margin: 0;
  padding-block: var(--premium-space-1);
  padding-inline: var(--premium-space-1);
  border: 0;
  border-radius: var(--premium-radius-sm);
  color: var(--premium-text-primary);
  background: transparent;
  box-shadow: none;
  cursor: pointer;
}

.autumn-permission-editor .phase3-resource-check:hover {
  background: var(--premium-surface-subtle);
}

.autumn-permission-editor .phase3-resource-check:has(input:checked) {
  background: color-mix(in srgb, var(--premium-surface-selected), transparent 46%);
}

.autumn-permission-editor .phase3-resource-grid > article.is-dependency-locked .phase3-resource-check,
.autumn-permission-editor .phase3-resource-grid > article.is-dependency-locked .phase3-resource-check:hover,
.autumn-permission-editor .phase3-resource-grid > article.is-dependency-locked .phase3-resource-check:has(input:checked) {
  color: var(--premium-text-secondary);
  background: transparent;
  cursor: not-allowed;
}

.autumn-permission-editor .phase3-resource-grid > article.is-dependency-locked .phase3-resource-check strong {
  color: var(--premium-text-secondary);
}

.autumn-permission-editor .phase3-resource-grid > article.is-dependency-locked .phase3-resource-check input {
  cursor: not-allowed;
}

.autumn-permission-editor .phase3-resource-check > span {
  display: grid;
  gap: 0;
  min-inline-size: 0;
}

.autumn-permission-editor .phase3-resource-check strong {
  min-inline-size: 0;
  color: var(--premium-text-primary);
  font: 600 12px/1.35 var(--premium-font-latin);
  overflow-wrap: anywhere;
}

.autumn-permission-editor .phase3-resource-check small {
  min-inline-size: 0;
  color: var(--premium-text-muted);
  font: 400 12px/1.35 var(--premium-font-latin);
  overflow-wrap: anywhere;
}

.autumn-permission-editor:dir(rtl) .phase3-resource-check :is(strong, small) {
  font-family: var(--premium-font-arabic);
}

.autumn-permission-editor .phase3-empty-resource {
  margin: var(--premium-space-2) 0 0;
  color: var(--premium-text-muted);
  font: 400 12px/1.45 var(--premium-font-latin);
}

.autumn-permission-editor:dir(rtl) .phase3-empty-resource {
  font-family: var(--premium-font-arabic);
}

.autumn-permission-editor #phase3-dependency-errors {
  grid-area: errors;
  min-inline-size: 0;
  padding-inline-end: var(--premium-space-5);
}

.autumn-permission-editor .phase3-dependencies {
  margin-block-start: var(--premium-space-3);
  padding: var(--premium-space-3);
  border: var(--premium-border-width) solid color-mix(in srgb, var(--premium-status-warning), transparent 54%);
  border-radius: var(--premium-radius-control);
  color: var(--premium-status-warning);
  background: var(--premium-status-warning-soft);
  box-shadow: none;
}

.autumn-permission-editor .phase3-dependencies strong {
  font: 600 13px/1.45 var(--premium-font-latin);
}

.autumn-permission-editor .phase3-dependencies ul {
  margin-block: var(--premium-space-2) 0;
  margin-inline: 0;
  padding-inline-start: var(--premium-space-5);
  font: 400 12px/1.45 var(--premium-font-technical);
}

.autumn-permission-editor > main > .approved-users-loading,
.autumn-permission-editor > main > .approved-users-error {
  grid-area: 1 / 1 / -1 / -1;
  align-self: center;
  justify-self: stretch;
  min-inline-size: 0;
  min-block-size: 260px;
}

.autumn-permission-editor > main > .approved-users-loading {
  display: grid;
  place-items: center;
  align-content: center;
  gap: var(--premium-space-3);
  color: var(--premium-text-secondary);
  text-align: center;
}

.autumn-permission-editor > main > .approved-users-loading > span {
  inline-size: 28px;
  block-size: 28px;
  border: 3px solid var(--premium-border-subtle);
  border-block-start-color: var(--premium-brand-accent);
  border-radius: var(--premium-radius-round);
  animation: premiumPermissionSpin .8s linear infinite;
}

.autumn-permission-editor > main > .approved-users-error {
  align-content: center;
  padding: var(--premium-space-6);
  border: var(--premium-border-width) solid color-mix(in srgb, var(--premium-status-danger), transparent 54%);
  border-radius: var(--premium-radius-control);
  color: var(--premium-status-danger);
  background: var(--premium-status-danger-soft);
  text-align: center;
}

.autumn-permission-editor > main > .approved-users-error h2 {
  margin: 0;
  color: inherit;
  font: 600 20px/1.3 var(--premium-font-latin);
}

.autumn-permission-editor > main > .approved-users-error p {
  margin: var(--premium-space-2) 0 0;
  color: inherit;
  font-size: 12px;
}

.autumn-permission-editor > footer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--premium-space-3);
  min-inline-size: 0;
  padding-block: var(--premium-space-3);
  padding-inline: var(--premium-space-6);
  border-block-start: var(--premium-border-width) solid var(--premium-border-subtle);
  background: var(--premium-surface-base);
}

.autumn-permission-editor > footer button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-inline-size: 132px;
  block-size: var(--premium-control-height);
  margin: 0;
  padding-block: 0;
  padding-inline: var(--premium-space-5);
  border: var(--premium-border-width) solid var(--premium-border-default);
  border-radius: var(--premium-radius-control);
  box-shadow: none;
  font: 600 13px/1 var(--premium-font-latin);
  cursor: pointer;
}

.autumn-permission-editor:dir(rtl) > footer button {
  font-family: var(--premium-font-arabic);
}

.autumn-permission-editor > footer .approved-user-cancel {
  color: var(--premium-text-primary);
  background: var(--premium-surface-elevated);
}

.autumn-permission-editor > footer .approved-user-cancel:hover {
  border-color: var(--premium-brand-accent);
  color: var(--premium-brand-accent-hover);
  background: var(--premium-brand-accent-soft);
}

.autumn-permission-editor > footer .phase3-save-user {
  border-color: var(--premium-brand-accent);
  color: var(--premium-text-on-accent);
  background: var(--premium-brand-accent);
}

.autumn-permission-editor > footer .phase3-save-user:hover:not(:disabled) {
  border-color: var(--premium-brand-accent-hover);
  background: var(--premium-brand-accent-hover);
}

.autumn-permission-editor > footer button:disabled {
  cursor: not-allowed;
  opacity: .52;
}

@keyframes premiumPermissionSpin {
  to { transform: rotate(1turn); }
}

@media (max-width: 1100px) {
  .autumn-permission-editor > main {
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 1fr);
  }

  .autumn-permission-editor .phase3-permission-card > div {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 980px) {
  .autumn-permission-editor-layer {
    padding: var(--premium-space-3);
  }

  .autumn-permission-editor-layer .autumn-permission-editor {
    inline-size: 100%;
    max-inline-size: 100%;
  }

  .autumn-permission-editor > main {
    grid-template-areas:
      "account"
      "preset"
      "matrix"
      "resources"
      "errors";
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: repeat(5, max-content);
  }

  .autumn-permission-editor :is(
    .phase3-account-grid,
    .phase3-matrix,
    #phase3-dependency-errors
  ) {
    padding-inline-end: 0;
  }

  .autumn-permission-editor :is(.phase3-preset, #phase3-resource-host) {
    padding-inline-start: 0;
    border-inline-start: 0;
  }

  .autumn-permission-editor .phase3-preset {
    padding-block-start: var(--premium-space-3);
  }
}

@media (max-width: 640px) {
  .autumn-permission-editor-layer {
    padding: var(--premium-space-2);
  }

  .autumn-permission-editor-layer .autumn-permission-editor {
    inline-size: 100%;
    block-size: calc(100vh - 16px);
    max-block-size: calc(100vh - 16px);
  }

  @supports (height: 100dvh) {
    .autumn-permission-editor-layer .autumn-permission-editor {
      block-size: calc(100dvh - 16px);
      max-block-size: calc(100dvh - 16px);
    }
  }

  .autumn-permission-editor > header {
    padding-block: var(--premium-space-3);
    padding-inline: var(--premium-space-4);
  }

  .autumn-permission-editor > header .autumn-leaf-brand.is-compact {
    flex-basis: 44px;
    inline-size: 44px;
    block-size: 44px;
  }

  .autumn-permission-editor > header h2 {
    font-size: 24px;
  }

  .autumn-permission-editor > main {
    padding-block: var(--premium-space-3) var(--premium-space-4);
    padding-inline: var(--premium-space-4);
  }

  .autumn-permission-editor .phase3-account-grid,
  .autumn-permission-editor .phase3-preset,
  .autumn-permission-editor .phase3-matrix,
  .autumn-permission-editor .phase3-resource-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .autumn-permission-editor .phase3-permission-card {
    padding-inline: 0;
  }

  .autumn-permission-editor .phase3-permission-card:nth-child(even) {
    padding-inline: 0;
    border-inline-start: 0;
  }

  .autumn-permission-editor .phase3-permission-card:nth-child(n + 2) {
    padding-block-start: var(--premium-space-2);
    border-block-start: var(--premium-border-width) solid var(--premium-border-subtle);
  }

  .autumn-permission-editor > footer {
    gap: var(--premium-space-2);
    padding-block: var(--premium-space-2);
    padding-inline: var(--premium-space-4);
  }

  .autumn-permission-editor > footer button {
    flex: 1 1 0;
    min-inline-size: 0;
    padding-inline: var(--premium-space-3);
  }
}

@media (max-width: 520px) {
  .autumn-permission-editor .phase3-permission-card > div {
    grid-template-columns: minmax(0, 1fr);
  }

  .autumn-permission-editor .phase3-resource-access > header {
    display: grid;
  }

  .autumn-permission-editor .phase3-resource-access > header b {
    max-inline-size: 100%;
  }
}

@media (max-width: 420px) {
  .autumn-permission-editor > header {
    gap: var(--premium-space-2);
    padding-inline: var(--premium-space-3);
  }

  .autumn-permission-editor > header > div {
    gap: var(--premium-space-2);
  }

  .autumn-permission-editor > header .autumn-leaf-brand.is-compact {
    flex-basis: 40px;
    inline-size: 40px;
    block-size: 40px;
  }

  .autumn-permission-editor > header h2 {
    font-size: 22px;
  }

  .autumn-permission-editor > header p {
    font-size: 12px;
  }

  .autumn-permission-editor > main {
    padding-inline: var(--premium-space-3);
  }

  .autumn-permission-editor > footer {
    padding-inline: var(--premium-space-3);
  }
}

@media (prefers-reduced-motion: reduce) {
  .autumn-permission-editor > main > .approved-users-loading > span {
    animation-duration: 1.6s;
  }
}

html[data-autumn-appearance="true"] body #app .screens-extra-filters > summary svg {
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-interactive-gradient) !important;
}

html[data-autumn-appearance="true"] body #app .runtime-mirror-facts > div {
  border-color: var(--autumn-border) !important;
}

html[data-autumn-appearance="true"] body #app :is(
  .runtime-mirror-header .offline,
  .runtime-mirror-facts dd.offline,
  .runtime-mirror-facts dd.failed
) {
  color: var(--autumn-danger) !important;
  background: var(--autumn-danger-soft) !important;
}

html[data-autumn-appearance="true"] body #app :is(
  .runtime-mirror-header .warning,
  .runtime-mirror-facts dd.warning
) {
  color: var(--autumn-warning) !important;
  background: var(--autumn-warning-soft) !important;
}

/* Dashboard identity lock.
   app.js still ships several late-injected legacy Autumn declarations with
   hard-coded warm colours. These selectors intentionally outrank that legacy
   layer so an adaptive identity reaches the complete Admin chrome instead of
   stopping at the page backdrop. Status colours remain semantic. */
html[data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side .brand .approved-brand-lockup strong {
  color: var(--autumn-accent-primary) !important;
  background: var(--autumn-interactive-gradient) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app#app.shell :is(button, a, input, select, textarea, [tabindex]):focus-visible:not(.nav button.active) {
  outline: var(--autumn-ui-focus-width) solid var(--autumn-focus) !important;
  outline-offset: 2px !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app#app.shell :is(#title, .top h1, .top strong) {
  color: var(--autumn-accent-primary) !important;
  background: var(--autumn-interactive-gradient) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side {
  border-color: color-mix(in srgb, var(--autumn-border), transparent 12%) !important;
  color: var(--autumn-text) !important;
  background-color: color-mix(in srgb, var(--autumn-sidebar-surface), transparent 5%) !important;
  background-image: linear-gradient(180deg,
    color-mix(in srgb, var(--autumn-sidebar-surface), var(--autumn-surface-elevated) 22%),
    color-mix(in srgb, var(--autumn-sidebar-surface), var(--autumn-canvas) 16%)) !important;
  box-shadow: 0 0 34px color-mix(in srgb, var(--autumn-shadow-color), transparent 28%) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side > nav.nav > button {
  border-color: transparent !important;
  color: var(--autumn-text-muted) !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side > nav.nav > button::before {
  color: inherit !important;
  background-color: currentColor !important;
  background-image: none !important;
  -webkit-mask-image: var(--nav-icon) !important;
  mask-image: var(--nav-icon) !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-size: contain !important;
  mask-size: contain !important;
  filter: none !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side > nav.nav > button:hover {
  border-color: color-mix(in srgb, var(--autumn-accent-primary), transparent 78%) !important;
  color: var(--autumn-accent-primary-hover) !important;
  background: var(--autumn-hover-surface) !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side > nav.nav > button.active {
  border-color: color-mix(in srgb, var(--autumn-accent-primary), transparent 66%) !important;
  color: var(--autumn-accent-primary) !important;
  background: linear-gradient(110deg,
    var(--autumn-selected-surface),
    color-mix(in srgb, var(--autumn-control-surface), var(--autumn-accent-primary-soft) 34%)) !important;
  box-shadow: inset 3px 0 var(--autumn-accent-primary),
    0 9px 20px color-mix(in srgb, var(--autumn-accent-primary), transparent 86%) !important;
}

html[dir="rtl"][data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side > nav.nav > button.active {
  box-shadow: inset -3px 0 var(--autumn-accent-primary),
    0 9px 20px color-mix(in srgb, var(--autumn-accent-primary), transparent 86%) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side > .dashboard-profile-wrap > .dashboard-profile-button {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background: color-mix(in srgb, var(--autumn-appearance-content-overlay), var(--autumn-accent-primary-soft) 8%) !important;
  box-shadow: 0 9px 22px color-mix(in srgb, var(--autumn-shadow-color), transparent 35%),
    inset 0 1px var(--autumn-surface-elevated) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side > .dashboard-profile-wrap #dashboard-profile-initials {
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-interactive-gradient) !important;
  box-shadow: 0 7px 16px color-mix(in srgb, var(--autumn-accent-primary), transparent 72%) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) :is(.dashboard-profile-panel, .dashboard-profile-summary) > span:first-child {
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-interactive-gradient) !important;
  box-shadow: 0 7px 16px color-mix(in srgb, var(--autumn-accent-primary), transparent 72%) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) .dashboard-header-logout {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-button-bg) !important;
  box-shadow: var(--autumn-button-shadow) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side > .dashboard-profile-wrap .dashboard-profile-copy strong {
  color: var(--autumn-text) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side > .dashboard-profile-wrap .dashboard-profile-copy small {
  color: var(--autumn-text-muted) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side > .dashboard-profile-wrap {
  display: grid !important;
  grid-template-rows: auto auto !important;
  gap: 8px !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side > .dashboard-profile-wrap > .dashboard-sidebar-logout {
  justify-content: flex-start !important;
  width: 100% !important;
  min-height: var(--autumn-ui-hit-target) !important;
  height: var(--autumn-ui-hit-target) !important;
  margin: 0 !important;
  padding-inline: 12px !important;
  border: 1px solid var(--autumn-border) !important;
  border-radius: calc(var(--autumn-ui-radius) * .82) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-button-bg) !important;
  box-shadow: var(--autumn-button-shadow) !important;
  font: 600 var(--autumn-ui-text-sm)/1.2 var(--autumn-ui-font-family) !important;
  text-align: start !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side > .dashboard-profile-wrap > .dashboard-sidebar-logout svg {
  inline-size: 18px !important;
  block-size: 18px !important;
  fill: none !important;
  stroke: var(--autumn-accent-primary-hover) !important;
  stroke-width: 1.8 !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side > .dashboard-profile-wrap > .dashboard-sidebar-logout:hover {
  border-color: var(--autumn-accent-primary) !important;
  color: var(--autumn-accent-primary-hover) !important;
  background: var(--autumn-hover-surface) !important;
  box-shadow: var(--autumn-button-shadow) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side > .dashboard-profile-wrap > .dashboard-sidebar-logout:active {
  background: var(--autumn-selected-surface) !important;
}

html[dir="rtl"][data-autumn-appearance="true"] body:has(#app.shell:not(.premium-v1-shell)[style*="display: block"]) #app#app#app#app.shell > aside.side > .dashboard-profile-wrap > .dashboard-sidebar-logout svg {
  scale: -1 1 !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-glass-card {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-appearance-content-overlay) !important;
  background-image: linear-gradient(145deg,
    color-mix(in srgb, var(--autumn-surface-elevated), transparent 8%),
    color-mix(in srgb, var(--autumn-surface), var(--autumn-accent-primary-soft) 8%)) !important;
  box-shadow: var(--autumn-shadow), inset 0 1px color-mix(in srgb, var(--autumn-surface-elevated), transparent 12%) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view :is(
  .dashboard-card-head,
  .dashboard-list-row,
  .dashboard-screen-pulse-list,
  .dashboard-screen-pulse-row
) {
  border-color: var(--autumn-border) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-upcoming-card .dashboard-list {
  scrollbar-color: var(--autumn-text-muted) transparent;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-list-row {
  position: relative !important;
  box-sizing: border-box !important;
  block-size: auto !important;
  min-block-size: 0 !important;
  max-block-size: none !important;
  padding: 12px 14px !important;
  border: 0 !important;
  border-block-end: 1px solid var(--autumn-border) !important;
  border-radius: 0 !important;
  color: var(--autumn-text) !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: start !important;
  transform: none !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-schedule-row {
  grid-template-columns: 40px minmax(0, 1fr) max-content !important;
  grid-template-rows: auto auto !important;
  gap: 8px 12px !important;
  align-items: center !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-schedule-row > .dashboard-row-copy { grid-column: 2 / -1; grid-row: 1; }
html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-schedule-row > .dashboard-schedule-icon { grid-column: 1; grid-row: 1; align-self: start; }
html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-schedule-row > time { grid-column: 2; grid-row: 2; color: var(--autumn-text-muted) !important; font-size: var(--autumn-ui-text-xs) !important; }
html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-schedule-row > .dashboard-schedule-state { grid-column: 3; grid-row: 2; display: inline-flex !important; font-size: var(--autumn-ui-text-xs) !important; }
html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-schedule-row > .dashboard-timeline { grid-column: 1; grid-row: 2; min-height: 0 !important; min-block-size: 20px !important; }

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-row-copy :is(strong, small) {
  min-inline-size: 0;
  overflow: visible !important;
  white-space: normal !important;
  overflow-wrap: anywhere;
  text-overflow: clip !important;
  color: var(--autumn-text) !important;
  font-size: var(--autumn-ui-text-sm) !important;
  line-height: 1.45 !important;
}
html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-row-copy small { color: var(--autumn-text-muted) !important; }

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view :is(.dashboard-card-head button, .dashboard-header-logout) {
  box-sizing: border-box !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  min-block-size: 38px !important;
  padding: 0 12px !important;
  border: 1px solid var(--autumn-border) !important;
  border-radius: 10px !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-control-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
  font: 700 13px/13px var(--autumn-ui-font-family) !important;
  transform: none !important;
}
html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view :is(.dashboard-card-head button, .dashboard-header-logout):hover:not(:disabled) {
  color: var(--autumn-accent-primary-hover) !important;
  background: var(--autumn-hover-surface) !important;
  border-color: var(--autumn-accent-primary) !important;
}
html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view :is(.dashboard-card-head button, .dashboard-header-logout, .dashboard-list-row):focus-visible {
  outline: var(--autumn-ui-focus-width) solid var(--autumn-focus) !important;
  outline-offset: -2px !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-list-row:hover {
  color: var(--autumn-text) !important;
  background: var(--autumn-hover-surface) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-timeline::before {
  background: linear-gradient(var(--autumn-accent-primary), var(--autumn-accent-secondary), var(--autumn-accent-tertiary)) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-schedule-row:nth-child(3n+1) :is(.dashboard-schedule-icon, .dashboard-timeline i) {
  border-color: color-mix(in srgb, var(--autumn-accent-primary), transparent 68%) !important;
  color: var(--autumn-accent-primary) !important;
  background: var(--autumn-accent-primary-soft) !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--autumn-accent-primary), transparent 80%) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-schedule-row:nth-child(3n+2) :is(.dashboard-schedule-icon, .dashboard-timeline i) {
  border-color: color-mix(in srgb, var(--autumn-accent-secondary), transparent 68%) !important;
  color: var(--autumn-accent-secondary) !important;
  background: color-mix(in srgb, var(--autumn-control-surface), var(--autumn-accent-secondary) 14%) !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--autumn-accent-secondary), transparent 80%) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-schedule-row:nth-child(3n) :is(.dashboard-schedule-icon, .dashboard-timeline i) {
  border-color: color-mix(in srgb, var(--autumn-accent-tertiary), transparent 68%) !important;
  color: var(--autumn-accent-tertiary) !important;
  background: color-mix(in srgb, var(--autumn-control-surface), var(--autumn-accent-tertiary) 14%) !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--autumn-accent-tertiary), transparent 80%) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-schedule-row:nth-child(3n+1) .dashboard-timeline i {
  border-color: var(--autumn-surface-elevated) !important;
  background: var(--autumn-accent-primary) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--autumn-accent-primary), transparent 72%) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-schedule-row:nth-child(3n+2) .dashboard-timeline i {
  border-color: var(--autumn-surface-elevated) !important;
  background: var(--autumn-accent-secondary) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--autumn-accent-secondary), transparent 72%) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-schedule-row:nth-child(3n) .dashboard-timeline i {
  border-color: var(--autumn-surface-elevated) !important;
  background: var(--autumn-accent-tertiary) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--autumn-accent-tertiary), transparent 72%) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-schedule-state:not(.active) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text-muted) !important;
  background: var(--autumn-control-surface) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-schedule-state.active {
  border-color: var(--autumn-success) !important;
  color: var(--autumn-success) !important;
  background: var(--autumn-success-soft) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-health-ring {
  background: conic-gradient(
    var(--autumn-accent-primary) 0%,
    var(--autumn-accent-secondary) calc(var(--health) * 1%),
    var(--autumn-accent-primary-soft) 0
  ) !important;
  box-shadow: 0 15px 30px color-mix(in srgb, var(--autumn-accent-primary), transparent 78%) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-health-ring::before {
  background: var(--autumn-surface-elevated) !important;
  box-shadow: inset 0 2px 11px color-mix(in srgb, var(--autumn-shadow-color), transparent 52%) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-health-simple-row {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background: color-mix(in srgb, var(--autumn-control-surface), transparent 12%) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-health-simple-row.online :is(strong, span, b) {
  color: var(--autumn-success) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-health-simple-row.offline :is(strong, span, b) {
  color: var(--autumn-danger) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-screen-pulse-list {
  background-color: color-mix(in srgb, var(--autumn-surface), transparent 14%) !important;
  background-image: repeating-linear-gradient(90deg,
    transparent 0,
    transparent 39px,
    color-mix(in srgb, var(--autumn-accent-primary), transparent 94%) 40px) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-screen-pulse-number {
  color: var(--autumn-accent-primary) !important;
  background: var(--autumn-accent-primary-soft) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-screen-pulse-row.offline .dashboard-screen-pulse-base {
  stroke: color-mix(in srgb, var(--autumn-danger), var(--autumn-text-muted) 58%) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-screen-pulse-row.online .dashboard-screen-pulse-base {
  stroke: color-mix(in srgb, var(--autumn-success), var(--autumn-surface) 36%) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-screen-pulse-row.online .dashboard-screen-pulse-trace {
  stroke: var(--autumn-success) !important;
  filter: drop-shadow(0 0 5px color-mix(in srgb, var(--autumn-success), transparent 58%)) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app#app.shell #view#view#view#view .screen-details-panel {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-appearance-content-overlay) !important;
  background-image: linear-gradient(145deg,
    color-mix(in srgb, var(--autumn-surface-elevated), transparent 8%),
    color-mix(in srgb, var(--autumn-surface), var(--autumn-accent-primary-soft) 8%)) !important;
  box-shadow: var(--autumn-shadow) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app#app.shell #view#view#view#view .screen-details-preview {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text-muted) !important;
  background-color: color-mix(in srgb, var(--autumn-surface), transparent 10%) !important;
  background-image: linear-gradient(145deg,
    color-mix(in srgb, var(--autumn-control-surface), transparent 8%),
    color-mix(in srgb, var(--autumn-canvas), var(--autumn-accent-primary-soft) 8%)) !important;
}

/* Final Admin cascade lock.
   The legacy application creates additional <style> elements at runtime. A
   fourth ID repetition deliberately outranks those retained skins without
   touching Canvas, template pixels, Player previews or screen media. */
html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]):not(:has(.approved-standalone-daily)) #app#app#app#app.shell #view#view#view#view :is(
  h1, h2, h3, h4, h5, strong, label, legend, dt, dd
):not(:where(
  .ds-approved-design-studio *,
  .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *,
  .player-preview *, .ds-template-composite *,
  .ds-approved-template-placeholder *, .ds-template-real-preview *,
  .ds-hotel-template-preview *, .ds-template-loading-preview *
)) {
  color: var(--autumn-text) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app#app.shell #view#view#view#view :is(
  p, small, time, .empty, [class*="muted"], [class*="subtitle"],
  [class*="description"], [class*="hint"], [class*="helper"]
):not(:where(
  .ds-approved-design-studio *,
  .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *,
  .player-preview *, .ds-template-composite *,
  .ds-approved-template-placeholder *, .ds-template-real-preview *,
  .ds-hotel-template-preview *, .ds-template-loading-preview *
)) {
  color: var(--autumn-text-muted) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app#app.shell #view#view#view#view :is(
  .panel,
  [class$="-card"], [class*="-card "],
  [class$="-panel"], [class*="-panel "],
  [class$="-browser"], [class*="-browser "],
  [class$="-inspector"], [class*="-inspector "],
  [class$="-rail"], [class*="-rail "]
):not([class*="template"]):not([class*="preview"]):not(:where(
  .autumn-saas-settings, .autumn-saas-settings *,
  .ds-approved-design-studio *,
  .ds-approved-stage, .ds-approved-stage *, #design-studio-canvas,
  #design-studio-canvas *, [data-design-canvas], [data-design-canvas] *,
  [data-player-preview], [data-player-preview] *, .player-preview,
  .player-preview *, .ds-template-composite, .ds-template-composite *,
  .ds-approved-template-placeholder, .ds-approved-template-placeholder *,
  .ds-template-real-preview, .ds-template-real-preview *,
  .ds-hotel-template-preview, .ds-hotel-template-preview *,
  .ds-template-loading-preview
)) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-appearance-content-overlay) !important;
  background-image: linear-gradient(145deg,
    color-mix(in srgb, var(--autumn-surface-elevated), transparent 8%),
    color-mix(in srgb, var(--autumn-surface), var(--autumn-accent-primary-soft) 7%)) !important;
  box-shadow: var(--autumn-shadow) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app#app.shell #view#view#view#view :is(
  [class$="-toolbar"], [class*="-toolbar "],
  [class$="-header"], [class*="-header "],
  [class$="-footer"], [class*="-footer "],
  [class$="-tabs"], [class*="-tabs "],
  .approved-selected-day, .ds-history-controls
):not(:where(
  .ds-approved-design-studio *,
  .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *,
  .player-preview *, .ds-template-composite *,
  .ds-approved-template-placeholder *, .ds-template-real-preview *,
  .ds-hotel-template-preview *, .ds-template-loading-preview *
)) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: color-mix(in srgb, var(--autumn-header-surface), transparent 5%) !important;
  background-image: none !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app#app.shell #view#view#view#view button:not(.danger):not(:where(
  .autumn-system-logs *,
  .approved-standalone-schedules *,
  .approved-standalone-daily *,
  .autumn-premium-users *,
  .ds-approved-design-studio *,
  .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *,
  .player-preview *, .ds-template-composite *,
  .ds-approved-template-placeholder *, .ds-template-real-preview *,
  .ds-hotel-template-preview *, .ds-template-loading-preview *
)) {
  border-color: var(--autumn-button-border) !important;
  color: var(--autumn-button-text) !important;
  background-color: transparent !important;
  background-image: var(--autumn-button-bg) !important;
  box-shadow: var(--autumn-button-shadow) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app#app.shell #view#view#view#view button:not(.danger):not(:disabled):hover:not(:where(
  .autumn-system-logs *,
  .approved-standalone-schedules *,
  .approved-standalone-daily *,
  .autumn-premium-users *,
  .ds-approved-design-studio *,
  .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *,
  .player-preview *, .ds-template-composite *,
  .ds-approved-template-placeholder *, .ds-template-real-preview *,
  .ds-hotel-template-preview *, .ds-template-loading-preview *
)) {
  border-color: var(--autumn-accent-primary) !important;
  color: var(--autumn-accent-primary-hover) !important;
  background-image: none !important;
  background-color: var(--autumn-hover-surface) !important;
  box-shadow: var(--autumn-button-shadow) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app#app.shell #view#view#view#view button:is(
  .active, .selected, [aria-selected="true"], [aria-pressed="true"],
  [aria-current="page"], .approved-create-schedule, .approved-invite-user,
  .identity-add, .autumn-appearance-primary
):not(:where(
  .autumn-system-logs *,
  .approved-standalone-schedules *,
  .approved-standalone-daily *,
  .ds-approved-design-studio *,
  .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *,
  .player-preview *, .ds-template-composite *,
  .ds-approved-template-placeholder *, .ds-template-real-preview *,
  .ds-hotel-template-preview *, .ds-template-loading-preview *
)) {
  border-color: var(--autumn-accent-primary) !important;
  color: var(--autumn-accent-on-primary) !important;
  background-color: transparent !important;
  background-image: var(--autumn-interactive-gradient) !important;
  box-shadow: 0 9px 20px color-mix(in srgb, var(--autumn-accent-primary), transparent 76%) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app#app.shell #view#view#view#view button.danger:not(:where(
  .autumn-system-logs *,
  .approved-standalone-schedules *,
  .approved-standalone-daily *,
  .ds-approved-design-studio *,
  .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *,
  .player-preview *, .ds-template-composite *,
  .ds-approved-template-placeholder *, .ds-template-real-preview *,
  .ds-hotel-template-preview *, .ds-template-loading-preview *
)) {
  border-color: var(--autumn-danger) !important;
  color: var(--autumn-danger-on) !important;
  background-color: var(--autumn-danger) !important;
  background-image: linear-gradient(135deg, var(--autumn-danger), color-mix(in srgb, var(--autumn-danger), var(--autumn-text) 28%)) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app#app.shell #view#view#view#view :is(input, select, textarea):not(#design-studio-inline-text):not(:where(
  .autumn-system-logs *,
  .approved-standalone-schedules *,
  .approved-standalone-daily *,
  .ds-approved-design-studio *,
  .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *,
  .player-preview *, .ds-template-composite *,
  .ds-approved-template-placeholder *, .ds-template-real-preview *,
  .ds-hotel-template-preview *, .ds-template-loading-preview *
)) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-control-surface) !important;
  background-image: none !important;
  caret-color: var(--autumn-accent-primary) !important;
  box-shadow: none !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app#app.shell #view#view#view#view :is(table, thead, tbody, tr, th, td):not(:where(.autumn-system-logs, .autumn-system-logs *, .approved-standalone-schedules *, .approved-standalone-daily *, .autumn-premium-users *)) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app#app.shell #view#view#view#view :is(thead, th):not(:where(.autumn-system-logs, .autumn-system-logs *, .approved-standalone-schedules *, .approved-standalone-daily *, .autumn-premium-users *)) {
  background: color-mix(in srgb, var(--autumn-header-surface), var(--autumn-accent-primary-soft) 8%) !important;
}

/* Schedule chrome. */
html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules) #app#app#app#app.shell #view#view#view#view :is(
  .approved-schedule-workspace, .approved-day-calendar,
  .approved-calendar-card, .approved-content-organizer,
  .approved-mini-calendar, .approved-week-scroll,
  .approved-organizer-dropdown, .approved-content-picker,
  .approved-picker-scroll
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-appearance-content-overlay) !important;
  background-image: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules) #app#app#app#app.shell #view#view#view#view .approved-organizer-field > span {
  border-color: var(--autumn-accent-primary) !important;
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-interactive-gradient) !important;
  box-shadow: 0 6px 13px color-mix(in srgb, var(--autumn-accent-primary), transparent 76%) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules) #app#app#app#app.shell #view#view#view#view :is(
  .approved-organizer-menu, .approved-content-management,
  .approved-mini-calendar > header, .approved-mini-calendar header
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-appearance-content-overlay) !important;
  background-image: none !important;
  box-shadow: var(--autumn-button-shadow) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules) #app#app#app#app.shell #view#view#view#view :is(
  .approved-picker-item.media em, .approved-content-item em,
  .approved-content-row em
) {
  color: var(--autumn-accent-primary-hover) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules) #app#app#app#app.shell #view#view#view#view :is(
  .approved-mini-days button.selected, .approved-mini-days button.today,
  .approved-calendar-day.selected, .approved-calendar-day.today,
  .approved-day-button.selected, .approved-day-button.today
) {
  border-color: var(--autumn-accent-primary) !important;
  color: var(--autumn-accent-primary-hover) !important;
  background: var(--autumn-selected-surface) !important;
  box-shadow: inset 0 0 0 1px var(--autumn-accent-primary) !important;
}

/* --------------------------------------------------------------------------
   Design Studio — Premium V1 canonical chrome

   This is the single visual owner for the current three-column Studio. The
   drawing canvas, mask pixels, template artwork and export geometry are kept
   outside the Admin theme surface.
   -------------------------------------------------------------------------- */
html[data-autumn-appearance="true"] body:has(.ds-approved-design-studio) #topbar {
  display: none;
}

html[data-autumn-appearance="true"] body:has(.ds-approved-design-studio) #view {
  padding: 0;
}

html[data-autumn-appearance="true"] .ds-approved-design-studio {
  inline-size: 100%;
  min-inline-size: 0;
  min-block-size: 0;
  color: var(--autumn-text);
  background: transparent;
  font-family: var(--autumn-ui-font-family);
}

html[data-autumn-appearance="true"] .ds-approved-design-studio,
html[data-autumn-appearance="true"] .ds-approved-design-studio * {
  box-sizing: border-box;
}

html[data-autumn-appearance="true"] .ds-approved-design-studio button {
  min-inline-size: 0;
  min-block-size: var(--autumn-ui-control-height);
  margin: 0;
  padding: 0 12px;
  border: 1px solid var(--autumn-button-border);
  border-radius: calc(var(--autumn-ui-radius) * .68);
  color: var(--autumn-button-text);
  background: var(--autumn-button-bg);
  box-shadow: none;
  font: 700 var(--autumn-ui-text-xs)/1.2 var(--autumn-ui-font-family);
  cursor: pointer;
  transition: border-color .16s ease, color .16s ease, background-color .16s ease, box-shadow .16s ease;
}

html[data-autumn-appearance="true"] .ds-approved-design-studio button:not(.active):not(.primary):not(:disabled):hover {
  border-color: var(--autumn-accent-primary);
  color: var(--autumn-accent-primary-hover);
  background: var(--autumn-hover-surface);
}

html[data-autumn-appearance="true"] .ds-approved-design-studio button:disabled {
  cursor: not-allowed;
  opacity: .44;
}

html[data-autumn-appearance="true"] .ds-approved-design-studio button:focus-visible,
html[data-autumn-appearance="true"] .ds-approved-design-studio :is(input, select, textarea):focus-visible {
  outline: 2px solid color-mix(in srgb, var(--autumn-focus), transparent 28%);
  outline-offset: 2px;
}

html[data-autumn-appearance="true"] .ds-approved-workspace {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr) 380px;
  gap: 0;
  inline-size: 100%;
  min-inline-size: 0;
  block-size: 100dvh;
  min-block-size: 680px;
  max-block-size: 100dvh;
  overflow: hidden;
}

html[data-autumn-appearance="true"] .ds-approved-template-browser,
html[data-autumn-appearance="true"] .ds-approved-editor,
html[data-autumn-appearance="true"] .ds-approved-right-rail {
  min-inline-size: 0;
  min-block-size: 0;
  border: 0;
  border-radius: 0;
  color: var(--autumn-text);
  background: var(--autumn-appearance-content-overlay);
  box-shadow: none;
}

/* Left — template folders, uploads and saved Designs. */
html[data-autumn-appearance="true"] .ds-approved-template-browser {
  display: flex;
  flex-direction: column;
  block-size: 100%;
  padding: 12px;
  border-inline-end: 1px solid var(--autumn-border);
  overflow: hidden;
}

html[data-autumn-appearance="true"] .ds-approved-tabs {
  display: block;
  flex: 0 0 auto;
  padding: 0 0 8px;
  border: 0;
  border-block-end: 1px solid var(--autumn-border);
  border-radius: 0;
  background: transparent;
}

html[data-autumn-appearance="true"] .ds-approved-tabs button {
  inline-size: auto;
  min-inline-size: 0;
  block-size: auto;
  min-block-size: 30px;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: var(--autumn-text);
  background: transparent;
  box-shadow: none;
  font-size: var(--autumn-ui-text-sm);
  font-weight: 800;
  text-align: start;
}

html[data-autumn-appearance="true"] .ds-approved-tabs button.active,
html[data-autumn-appearance="true"] .ds-approved-tabs button.active:hover,
html[data-autumn-appearance="true"] .ds-approved-tabs button.active:focus-visible {
  border: 0;
  border-radius: 0;
  color: var(--autumn-text);
  background: transparent;
  background-image: none;
  box-shadow: none;
}

html[data-autumn-appearance="true"] .ds-approved-template-browser > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 0 0 auto;
  min-block-size: 34px;
  margin: 6px 0 0;
  padding-inline: 0;
  border: 0;
  border-block-end: 1px solid color-mix(in srgb, var(--autumn-border), transparent 38%);
  background: transparent;
}

html[data-autumn-appearance="true"] .ds-approved-template-browser > header strong,
html[data-autumn-appearance="true"] .ds-approved-my-designs > label,
html[data-autumn-appearance="true"] .ds-element-section > h4,
html[data-autumn-appearance="true"] .ds-approved-inspector h4,
html[data-autumn-appearance="true"] .ds-approved-settings h4 {
  margin: 0;
  color: var(--autumn-text);
  font-size: var(--autumn-ui-text-xs);
  font-weight: 800;
  letter-spacing: .055em;
}

html[data-autumn-appearance="true"] .ds-approved-category-list {
  display: grid;
  gap: 7px;
  flex: 0 0 auto;
  margin-block: 8px 10px;
}

html[data-autumn-appearance="true"] .ds-approved-category-list button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  inline-size: 100%;
  block-size: 42px;
  padding-inline: 12px;
  border: 1px solid color-mix(in srgb, var(--autumn-border), transparent 28%);
  border-radius: 10px;
  color: var(--autumn-text);
  background: color-mix(in srgb, var(--autumn-control-surface), transparent 22%);
  font-size: 12px;
  font-weight: 750;
  text-align: start;
}

html[data-autumn-appearance="true"] .ds-approved-category-list button small {
  color: var(--autumn-text-muted);
  font-size: 10px;
}

html[data-autumn-appearance="true"] .ds-template-folder-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-inline-size: 0;
}

html[data-autumn-appearance="true"] .ds-template-folder-label > .ds-ui-icon {
  flex: 0 0 18px;
  inline-size: 18px;
  block-size: 18px;
  color: currentColor;
}

html[data-autumn-appearance="true"] .ds-template-folder-label > b {
  min-inline-size: 0;
  overflow: hidden;
  font: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-autumn-appearance="true"] .ds-approved-category-list button.active {
  border-color: color-mix(in srgb, var(--autumn-accent-primary), transparent 48%);
  color: var(--autumn-accent-primary-hover);
  background: color-mix(in srgb, var(--autumn-accent-primary-soft), var(--autumn-control-surface) 36%);
  box-shadow: none;
}

html[data-autumn-appearance="true"] .ds-approved-category-list button.active > :is(span, small) {
  color: var(--autumn-accent-primary-hover);
}

html[dir="rtl"][data-autumn-appearance="true"] .ds-approved-category-list button.active {
  box-shadow: none;
}

html[data-autumn-appearance="true"] .ds-template-folder-add {
  margin-block-start: 0;
  color: var(--autumn-text-muted);
}

html[data-autumn-appearance="true"] #design-studio-templates {
  flex: 1 1 auto;
  min-block-size: 0;
  padding-inline-end: 3px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

html[data-autumn-appearance="true"] .ds-hotel-template-upload-row {
  margin-block-end: 9px;
}

html[data-autumn-appearance="true"] .ds-approved-design-studio button.ds-hotel-template-upload {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 10px;
  align-items: center;
  inline-size: 100%;
  min-block-size: 60px;
  padding: 9px 10px;
  border: 1px solid color-mix(in srgb, var(--autumn-border), transparent 24%);
  border-radius: 10px;
  color: var(--autumn-text);
  background: color-mix(in srgb, var(--autumn-control-surface), transparent 18%);
  box-shadow: none;
  text-align: start;
}

html[data-autumn-appearance="true"] .ds-approved-design-studio button.ds-hotel-template-upload:not(:disabled):hover {
  border-color: var(--autumn-accent-primary);
  background: var(--autumn-hover-surface);
}

html[data-autumn-appearance="true"] .ds-hotel-template-upload > span {
  grid-row: 1 / 3;
  display: grid;
  place-items: center;
  inline-size: 30px;
  block-size: 36px;
  border: 0;
  border-radius: 0;
  color: var(--autumn-text);
  background: transparent;
  font-size: 25px;
  font-weight: 500;
}

html[data-autumn-appearance="true"] .ds-hotel-template-upload b {
  align-self: end;
  overflow: hidden;
  font-size: 12px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-autumn-appearance="true"] .ds-hotel-template-upload small {
  align-self: start;
  color: var(--autumn-text-muted);
  font-size: 9px;
}

html[data-autumn-appearance="true"] .ds-approved-empty,
html[data-autumn-appearance="true"] .ds-library-state {
  display: grid;
  place-items: center;
  gap: 5px;
  padding: 24px 10px;
  border: 0;
  border-radius: 0;
  color: var(--autumn-text-muted);
  background: transparent;
  font-size: 10px;
  line-height: 1.55;
  text-align: center;
}

html[data-autumn-appearance="true"] .ds-approved-empty strong,
html[data-autumn-appearance="true"] .ds-library-state strong {
  color: var(--autumn-text);
  font-size: 10px;
}

html[data-autumn-appearance="true"] .ds-approved-empty.error,
html[data-autumn-appearance="true"] .ds-library-state.error {
  border-block-start: 1px solid color-mix(in srgb, var(--autumn-danger), transparent 55%);
  color: var(--autumn-danger);
  background: transparent;
}

html[data-autumn-appearance="true"] .ds-approved-template-grid,
html[data-autumn-appearance="true"] .ds-hotel-template-list {
  display: grid;
  gap: 7px;
}

html[data-autumn-appearance="true"] .ds-template-card-shell {
  position: relative;
  min-inline-size: 0;
}

html[data-autumn-appearance="true"] .ds-approved-template,
html[data-autumn-appearance="true"] .ds-hotel-template-sample {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  inline-size: 100%;
  min-block-size: 78px;
  padding: 7px 36px 7px 7px;
  border-color: transparent;
  border-block-end-color: var(--autumn-border);
  border-radius: 9px;
  color: var(--autumn-text);
  background: transparent;
  text-align: start;
}

html[data-autumn-appearance="true"] .ds-approved-template:is(:hover, .active),
html[data-autumn-appearance="true"] .ds-hotel-template-sample:is(:hover, :focus-visible) {
  border-color: color-mix(in srgb, var(--autumn-accent-primary), transparent 48%);
  color: var(--autumn-text);
  background: var(--autumn-selected-surface);
}

html[data-autumn-appearance="true"] .ds-template-delete {
  position: absolute;
  z-index: 3;
  inset-block-start: 7px;
  inset-inline-end: 7px;
  display: grid;
  place-items: center;
  inline-size: 24px;
  min-inline-size: 24px;
  block-size: 24px;
  min-block-size: 24px;
  padding: 0;
  border-color: color-mix(in srgb, var(--autumn-danger), transparent 60%);
  border-radius: 50%;
  color: var(--autumn-danger);
  background: var(--autumn-danger-soft);
  font-size: 15px;
}

html[data-autumn-appearance="true"] .ds-template-delete:hover {
  border-color: var(--autumn-danger);
  color: var(--autumn-danger-on);
  background: var(--autumn-danger);
}

html[data-autumn-appearance="true"] .ds-template-copy,
html[data-autumn-appearance="true"] .ds-hotel-template-copy {
  display: grid;
  gap: 3px;
  min-inline-size: 0;
}

html[data-autumn-appearance="true"] :is(.ds-template-copy, .ds-hotel-template-copy) strong {
  overflow: hidden;
  color: var(--autumn-text);
  font-size: 11px;
  line-height: 1.35;
  text-overflow: ellipsis;
}

html[data-autumn-appearance="true"] :is(.ds-template-copy, .ds-hotel-template-copy) small {
  color: var(--autumn-text-muted);
  font-size: 9px;
}

html[data-autumn-appearance="true"] .ds-template-real-preview,
html[data-autumn-appearance="true"] .ds-hotel-template-preview {
  position: relative;
  display: block;
  justify-self: center;
  inline-size: 48px;
  block-size: 70px;
  overflow: hidden;
  border: 1px solid var(--autumn-border);
  border-radius: 6px;
  background: var(--autumn-control-surface);
}

html[data-autumn-appearance="true"] :is(.ds-template-real-preview, .ds-hotel-template-preview) > img {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}

html[data-autumn-appearance="true"] .ds-template-real-preview.unavailable {
  display: grid;
  place-items: center;
  padding: 5px;
  color: var(--autumn-text-muted);
  font-size: 8px;
  text-align: center;
}

html[data-autumn-appearance="true"] .ds-template-composite,
html[data-autumn-appearance="true"] .ds-approved-template-placeholder {
  position: relative;
  isolation: isolate;
  display: block;
  grid-row: 1 / 3;
  justify-self: center;
  inline-size: 54px;
  block-size: 70px;
  overflow: hidden;
  border: 1px solid var(--autumn-border);
  border-radius: 6px;
  color: var(--template-text, #0f172a);
  background: var(--template-bg, #f8fafc);
}

html[data-autumn-appearance="true"] .ds-template-composite > img {
  position: absolute;
  z-index: -2;
  inset: 0;
  display: block;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}

html[data-autumn-appearance="true"] .ds-template-composite::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.22));
  pointer-events: none;
}

html[data-autumn-appearance="true"] .ds-template-composite > :is(i, b, em, small) {
  position: absolute;
  z-index: 2;
  inset-inline: 8%;
  display: block;
  max-inline-size: 84%;
  overflow: hidden;
  color: inherit;
  font-style: normal;
  line-height: 1.05;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-autumn-appearance="true"] .ds-template-composite > i {
  inset-block-start: 15%;
  font: 700 2px/1 var(--autumn-ui-font-family);
  letter-spacing: .05em;
}

html[data-autumn-appearance="true"] .ds-template-composite > b {
  inset-block-start: 34%;
  font: 700 5px/1.05 "Cormorant Garamond", serif;
}

html[data-autumn-appearance="true"] .ds-template-composite > em {
  inset-block-start: 55%;
  font: 500 2px/1 var(--autumn-ui-font-family);
}

html[data-autumn-appearance="true"] .ds-template-composite > small {
  inset-block: auto 10%;
  color: var(--template-accent, var(--autumn-accent-primary));
  font: 800 2px/1 var(--autumn-ui-font-family);
}

html[data-autumn-appearance="true"] .ds-template-composite.layout-1::after,
html[data-autumn-appearance="true"] .ds-template-composite.layout-9::after {
  background: linear-gradient(90deg, rgba(255,255,255,.78) 0 56%, transparent 76%);
}

html[data-autumn-appearance="true"] .ds-template-composite.layout-2::after {
  background: linear-gradient(270deg, rgba(255,255,255,.78) 0 56%, transparent 76%);
}

html[data-autumn-appearance="true"] .ds-template-composite.layout-3::after {
  background: linear-gradient(90deg, rgba(255,255,255,.72) 0 51%, rgba(255,255,255,.18) 51%);
}

html[data-autumn-appearance="true"] .ds-template-composite.layout-8::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 5px;
  border: 1px solid var(--template-accent, var(--autumn-accent-primary));
}

html[data-autumn-appearance="true"] .ds-approved-my-designs {
  display: none;
}

html[data-autumn-appearance="true"] .ds-approved-saved-list {
  display: grid;
  gap: 2px;
  max-block-size: 118px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

html[data-autumn-appearance="true"] .ds-approved-saved-list button {
  display: grid;
  gap: 2px;
  inline-size: 100%;
  min-block-size: 42px;
  padding: 6px 7px;
  border: 0;
  border-block-end: 1px solid var(--autumn-border);
  border-radius: 6px;
  color: var(--autumn-text);
  background: transparent;
  text-align: start;
}

html[data-autumn-appearance="true"] .ds-approved-saved-list button.active {
  color: var(--autumn-accent-primary-hover);
  background: var(--autumn-selected-surface);
}

html[data-autumn-appearance="true"] .ds-approved-saved-list :is(span, small) {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-autumn-appearance="true"] .ds-approved-saved-list span {
  font-size: 10px;
  font-weight: 750;
}

html[data-autumn-appearance="true"] .ds-approved-saved-list small {
  color: var(--autumn-text-muted);
  font-size: 8px;
}

/* Center — neutral authoring workspace. */
html[data-autumn-appearance="true"] .ds-approved-editor-column {
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  min-inline-size: 0;
  min-block-size: 0;
  block-size: 100%;
  overflow: hidden;
}

html[data-autumn-appearance="true"] .ds-approved-editor {
  display: grid;
  grid-template-rows: 52px minmax(0, 1fr);
  block-size: 100%;
  border-inline-end: 1px solid var(--autumn-border);
  overflow: hidden;
}

html[data-autumn-appearance="true"] .ds-history-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-block-size: 52px;
  padding: 6px;
  border-block-end: 1px solid var(--autumn-border);
  background: var(--autumn-header-surface);
}

html[data-autumn-appearance="true"] .ds-history-controls button {
  inline-size: 112px;
  block-size: 38px;
  color: var(--autumn-text-muted);
  background: transparent;
}

html[data-autumn-appearance="true"] .ds-history-controls button span {
  margin-inline-end: 6px;
  color: var(--autumn-accent-primary);
  font-size: 15px;
}

html[data-autumn-appearance="true"] .ds-approved-viewport {
  display: flex;
  align-items: center;
  justify-content: center;
  min-inline-size: 0;
  min-block-size: 0;
  block-size: auto;
  padding: 20px;
  overflow: auto;
  color: var(--autumn-text-muted);
  background: color-mix(in srgb, var(--autumn-canvas), var(--autumn-surface) 42%);
  overscroll-behavior: contain;
}

/* Protected authoring plane: positioning only, never semantic recoloring. */
html[data-autumn-appearance="true"] .ds-approved-stage {
  position: relative;
  flex: 0 0 auto;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 16px 38px rgba(15, 23, 42, .18), 0 0 0 1px var(--autumn-accent-primary);
  touch-action: none;
  user-select: none;
}

html[data-autumn-appearance="true"] .ds-approved-stage > #design-studio-canvas {
  position: absolute;
  inset: 0;
  display: block;
  inline-size: 100%;
  block-size: 100%;
}

html[data-autumn-appearance="true"] .ds-approved-grid {
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(color-mix(in srgb, var(--autumn-accent-primary), transparent 87%) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--autumn-accent-primary), transparent 87%) 1px, transparent 1px);
}

html[data-autumn-appearance="true"] .ds-approved-safe-area {
  position: absolute;
  z-index: 3;
  border: 1px dashed color-mix(in srgb, var(--autumn-danger), transparent 20%);
  pointer-events: none;
}

html[data-autumn-appearance="true"] .ds-approved-guide {
  position: absolute;
  z-index: 5;
  display: block;
  background: var(--autumn-accent-primary);
  pointer-events: none;
}

html[data-autumn-appearance="true"] .ds-approved-guide.vertical {
  inset-block: 0;
  inline-size: 1px;
}

html[data-autumn-appearance="true"] .ds-approved-guide.horizontal {
  inset-inline: 0;
  block-size: 1px;
}

html[data-autumn-appearance="true"] :is(.ds-approved-guide, .ds-approved-grid, .ds-approved-safe-area)[hidden] {
  display: none;
}

html[data-autumn-appearance="true"] .ds-approved-selection {
  position: absolute;
  z-index: 8;
  border: 1.5px solid var(--autumn-accent-primary);
  box-shadow: 0 0 0 1px rgba(255,255,255,.72);
  pointer-events: none;
  transform-origin: center;
}

html[data-autumn-appearance="true"] .ds-approved-selection[hidden] {
  display: none;
}

html[data-autumn-appearance="true"] .ds-approved-selection.ds-mask-selection {
  border-color: transparent;
  box-shadow: none;
}

html[data-autumn-appearance="true"] .ds-approved-selection .ds-resize {
  position: absolute;
  display: block;
  inline-size: 10px;
  min-inline-size: 10px;
  block-size: 10px;
  min-block-size: 10px;
  padding: 0;
  border: 2px solid var(--autumn-accent-primary);
  border-radius: 50%;
  background: #fff;
  box-shadow: none;
  pointer-events: auto;
}

html[data-autumn-appearance="true"] .ds-approved-selection .nw { inset-block-start: -6px; inset-inline-start: -6px; }
html[data-autumn-appearance="true"] .ds-approved-selection .n { inset-block-start: -6px; inset-inline-start: 50%; transform: translateX(-50%); }
html[data-autumn-appearance="true"] .ds-approved-selection .ne { inset-block-start: -6px; inset-inline-end: -6px; }
html[data-autumn-appearance="true"] .ds-approved-selection .e { inset-block-start: 50%; inset-inline-end: -6px; transform: translateY(-50%); }
html[data-autumn-appearance="true"] .ds-approved-selection .se { inset-inline-end: -6px; inset-block-end: -6px; }
html[data-autumn-appearance="true"] .ds-approved-selection .s { inset-inline-start: 50%; inset-block-end: -6px; transform: translateX(-50%); }
html[data-autumn-appearance="true"] .ds-approved-selection .sw { inset-block-end: -6px; inset-inline-start: -6px; }
html[data-autumn-appearance="true"] .ds-approved-selection .w { inset-block-start: 50%; inset-inline-start: -6px; transform: translateY(-50%); }

html[data-autumn-appearance="true"] .ds-approved-inline-text {
  position: absolute;
  z-index: 12;
  margin: 0;
  overflow: hidden;
  border: 1.5px solid var(--autumn-accent-primary);
  border-radius: 2px;
  outline: 0;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--autumn-accent-primary), transparent 82%);
  resize: none;
  transform-origin: center;
  white-space: pre-wrap;
}

html[data-autumn-appearance="true"] .ds-mask-editor-overlay {
  position: absolute;
  z-index: 22;
  inset: 0;
  display: block;
  inline-size: 100%;
  block-size: 100%;
  pointer-events: auto;
  cursor: grab;
}

html[data-autumn-appearance="true"] .ds-mask-editor-overlay[hidden] {
  display: none;
}

html[data-autumn-appearance="true"] .ds-mask-editor-overlay.add-point {
  cursor: crosshair;
}

html[data-autumn-appearance="true"] .ds-template-loading-preview {
  position: absolute;
  z-index: 4;
  inset: 0;
  display: block;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
  background: #fff;
  pointer-events: none;
}

html[data-autumn-appearance="true"] .ds-approved-stage.template-preview-loading .ds-approved-selection {
  visibility: hidden;
}

/* Right — actions, tabs and tools use one coherent inspector surface. */
html[data-autumn-appearance="true"] .ds-approved-right-rail {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  block-size: 100%;
  overflow: hidden;
}

html[data-autumn-appearance="true"] .ds-approved-top-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  padding: 9px;
  border-block-end: 1px solid var(--autumn-border);
  background: var(--autumn-header-surface);
}

html[data-autumn-appearance="true"] .ds-approved-top-actions button {
  block-size: 40px;
  padding-inline: 8px;
  color: var(--autumn-text);
  background: var(--autumn-control-surface);
  white-space: nowrap;
}

html[data-autumn-appearance="true"] .ds-approved-top-actions button.primary {
  border-color: var(--autumn-accent-primary);
  color: var(--autumn-accent-on-primary);
  background: var(--autumn-accent-primary);
}

html[data-autumn-appearance="true"] .ds-approved-inspector {
  display: grid;
  grid-template-rows: 50px minmax(0, 1fr);
  min-inline-size: 0;
  min-block-size: 0;
  overflow: hidden;
}

html[data-autumn-appearance="true"] .ds-approved-inspector-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 4px;
  border-block-end: 1px solid var(--autumn-border);
  background: var(--autumn-header-surface);
}

html[data-autumn-appearance="true"] .ds-approved-inspector-tabs button {
  position: relative;
  block-size: 40px;
  border-color: transparent;
  color: var(--autumn-text-muted);
  background: transparent;
}

html[data-autumn-appearance="true"] .ds-approved-inspector-tabs button.active {
  color: var(--autumn-accent-on-primary);
  background: var(--autumn-accent-primary);
}

html[data-autumn-appearance="true"] .ds-approved-inspector-tabs button.active::after {
  display: none;
}

html[data-autumn-appearance="true"] .ds-approved-inspector-body {
  min-inline-size: 0;
  min-block-size: 0;
  padding: 12px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

html[data-autumn-appearance="true"] .ds-elements-library {
  display: grid;
  gap: 12px;
}

html[data-autumn-appearance="true"] .ds-approved-inspector section:not(.ds-element-section),
html[data-autumn-appearance="true"] .ds-approved-settings section {
  display: grid;
  gap: 9px;
  padding-block: 12px;
  border: 0;
  border-block-end: 1px solid var(--autumn-border);
  border-radius: 0;
  color: var(--autumn-text);
  background: transparent;
  box-shadow: none;
}

html[data-autumn-appearance="true"] .ds-element-section {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid color-mix(in srgb, var(--autumn-border), transparent 30%);
  border-radius: 14px;
  color: var(--autumn-text);
  background: color-mix(in srgb, var(--autumn-control-surface), transparent 30%);
  box-shadow: none;
}

html[data-autumn-appearance="true"] .ds-approved-inspector section:not(.ds-element-section):last-child {
  border-block-end: 0;
}

html[data-autumn-appearance="true"] .portrait-status {
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  min-block-size: 74px;
}

html[data-autumn-appearance="true"] .portrait-status > span {
  display: grid;
  place-items: center;
  inline-size: 34px;
  block-size: 44px;
  border: 0;
  border-radius: 0;
  color: var(--autumn-accent-primary);
  background: transparent;
  font-size: 30px;
}

html[data-autumn-appearance="true"] .portrait-status strong {
  display: block;
  color: var(--autumn-text);
  font-size: 13px;
  font-weight: 800;
}

html[data-autumn-appearance="true"] .portrait-status small {
  display: block;
  margin-block-start: 3px;
  color: var(--autumn-text-muted);
  font-size: 10px;
}

html[data-autumn-appearance="true"] .ds-element-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

html[data-autumn-appearance="true"] .ds-element-grid button {
  display: grid;
  place-items: center;
  gap: 6px;
  inline-size: 100%;
  block-size: 78px;
  padding: 8px 5px;
  border: 1px solid color-mix(in srgb, var(--autumn-border), transparent 28%);
  border-radius: 10px;
  color: var(--autumn-text);
  background: color-mix(in srgb, var(--autumn-surface-elevated), transparent 16%);
  box-shadow: none;
  text-align: center;
}

html[data-autumn-appearance="true"] .ds-element-grid button > span {
  display: grid;
  place-items: center;
  inline-size: 28px;
  block-size: 28px;
  min-inline-size: 28px;
  min-block-size: 28px;
  padding-inline: 0;
  border: 0;
  border-radius: 0;
  color: var(--autumn-accent-primary);
  background: transparent;
  font-size: 21px;
  line-height: 1;
}

html[data-autumn-appearance="true"] .ds-ui-icon {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  overflow: visible;
}

html[data-autumn-appearance="true"] .ds-element-grid button > span .ds-ui-icon {
  inline-size: 22px;
  block-size: 22px;
}

html[data-autumn-appearance="true"] .portrait-status > span .ds-ui-icon {
  inline-size: 28px;
  block-size: 38px;
}

html[data-autumn-appearance="true"] .ds-hotel-template-upload > span .ds-ui-icon {
  inline-size: 25px;
  block-size: 25px;
}

html[data-autumn-appearance="true"] .ds-approved-top-actions button > .ds-ui-icon {
  inline-size: 16px;
  block-size: 16px;
  margin-inline-end: 7px;
  vertical-align: -3px;
}

html[data-autumn-appearance="true"] .ds-element-grid button > b {
  overflow-wrap: anywhere;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.25;
}

html[data-autumn-appearance="true"] .ds-elements-logo-shelf {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
}

html[data-autumn-appearance="true"] .ds-elements-logo-shelf button {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  align-items: center;
  gap: 6px;
  padding: 5px;
  color: var(--autumn-text);
  background: var(--autumn-control-surface);
}

html[data-autumn-appearance="true"] .ds-elements-logo-shelf img {
  display: block;
  inline-size: 40px;
  block-size: 32px;
  object-fit: contain;
}

html[data-autumn-appearance="true"] .ds-elements-logo-shelf span {
  overflow: hidden;
  text-align: start;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-autumn-appearance="true"] .ds-elements-restore,
html[data-autumn-appearance="true"] .ds-approved-layers {
  display: grid;
  gap: 4px;
}

html[data-autumn-appearance="true"] .ds-elements-restore button {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  block-size: 38px;
  padding-inline: 8px;
  color: var(--autumn-text);
  background: transparent;
  text-align: start;
}

html[data-autumn-appearance="true"] .ds-elements-restore span {
  color: var(--autumn-accent-primary);
  font-size: 16px;
}

html[data-autumn-appearance="true"] .ds-approved-layers > div {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 32px 32px 32px;
  align-items: center;
  min-block-size: 42px;
  border-block-end: 1px solid var(--autumn-border);
  color: var(--autumn-text);
  background: transparent;
}

html[data-autumn-appearance="true"] .ds-approved-layers > div.active {
  color: var(--autumn-accent-primary-hover);
  background: var(--autumn-selected-surface);
}

html[data-autumn-appearance="true"] .ds-approved-layers button {
  inline-size: 100%;
  block-size: 38px;
  min-block-size: 38px;
  padding: 0;
  border: 0;
  border-radius: 5px;
  color: inherit;
  background: transparent;
}

html[data-autumn-appearance="true"] .ds-approved-layers .layer-select {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  text-align: start;
}

html[data-autumn-appearance="true"] .ds-approved-layers b {
  overflow: hidden;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-autumn-appearance="true"] .ds-approved-layers .layer-delete {
  color: var(--autumn-danger);
  font-size: 15px;
}

html[data-autumn-appearance="true"] .ds-approved-selected {
  display: grid;
  gap: 4px;
  padding-block-end: 10px;
  border-block-end: 1px solid var(--autumn-border);
  color: var(--autumn-text);
  font-size: 11px;
}

html[data-autumn-appearance="true"] .ds-approved-selected span {
  color: var(--autumn-text-muted);
  font-size: 9px;
  line-height: 1.45;
}

html[data-autumn-appearance="true"] .ds-approved-inspector :is(input, select, textarea),
html[data-autumn-appearance="true"] .ds-approved-settings :is(input, select, textarea),
html[data-autumn-appearance="true"] .ds-template-folder-dialog-card input {
  inline-size: 100%;
  margin: 0;
  border: 1px solid var(--autumn-border);
  border-radius: calc(var(--autumn-ui-radius) * .6);
  color: var(--autumn-text);
  background: var(--autumn-control-surface);
  box-shadow: none;
  font: 600 var(--autumn-ui-text-xs)/1.35 var(--autumn-ui-font-family);
}

html[data-autumn-appearance="true"] .ds-approved-inspector :is(input, select),
html[data-autumn-appearance="true"] .ds-approved-settings :is(input, select) {
  block-size: 36px;
  padding-inline: 9px;
}

html[data-autumn-appearance="true"] .ds-approved-inspector textarea {
  min-block-size: 72px;
  padding: 8px;
  resize: vertical;
}

html[data-autumn-appearance="true"] .ds-approved-inspector :is(input, select, textarea):focus,
html[data-autumn-appearance="true"] .ds-approved-settings :is(input, select, textarea):focus,
html[data-autumn-appearance="true"] .ds-template-folder-dialog-card input:focus {
  border-color: var(--autumn-accent-primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--autumn-accent-primary), transparent 84%);
}

html[data-autumn-appearance="true"] .ds-approved-inspector select option,
html[data-autumn-appearance="true"] .ds-approved-settings select option {
  color: var(--autumn-text);
  background: var(--autumn-surface-elevated);
}

html[data-autumn-appearance="true"] .ds-approved-fields {
  display: grid;
  gap: 6px;
}

html[data-autumn-appearance="true"] .ds-approved-fields.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

html[data-autumn-appearance="true"] .ds-approved-fields.four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

html[data-autumn-appearance="true"] .ds-approved-fields label {
  display: grid;
  gap: 4px;
  min-inline-size: 0;
  color: var(--autumn-text-muted);
  font-size: 9px;
}

html[data-autumn-appearance="true"] .ds-approved-inline,
html[data-autumn-appearance="true"] .ds-approved-format {
  display: flex;
  gap: 5px;
}

html[data-autumn-appearance="true"] :is(.ds-approved-inline, .ds-approved-format) > * {
  flex: 1;
}

html[data-autumn-appearance="true"] .ds-approved-format button.active,
html[data-autumn-appearance="true"] .ds-mask-proof-switch button.active,
html[data-autumn-appearance="true"] .ds-mask-edit-toggle.active,
html[data-autumn-appearance="true"] .ds-mask-control-grid button.active {
  border-color: var(--autumn-accent-primary);
  color: var(--autumn-accent-on-primary);
  background: var(--autumn-accent-primary);
}

html[data-autumn-appearance="true"] .ds-approved-remove {
  inline-size: 100%;
  margin-block-start: 8px;
  border-color: color-mix(in srgb, var(--autumn-danger), transparent 55%);
  color: var(--autumn-danger);
  background: var(--autumn-danger-soft);
}

html[data-autumn-appearance="true"] .ds-approved-color-palette {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 7px;
}

html[data-autumn-appearance="true"] .ds-approved-color-swatch,
html[data-autumn-appearance="true"] .ds-text-color-family,
html[data-autumn-appearance="true"] .ds-text-color-shade {
  position: relative;
  inline-size: 100%;
  block-size: 28px;
  min-block-size: 28px;
  padding: 0;
  background: var(--swatch, var(--accent, transparent));
}

html[data-autumn-appearance="true"] .ds-approved-color-swatch.active::after {
  content: "✓";
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  text-shadow: 0 1px 3px rgba(0,0,0,.7);
}

html[data-autumn-appearance="true"] .ds-widget-simple-controls,
html[data-autumn-appearance="true"] .ds-smart-mask-controls {
  display: grid;
  gap: 9px;
  inline-size: 100%;
}

html[data-autumn-appearance="true"] .ds-widget-color {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 46px;
  align-items: center;
  gap: 8px;
  color: var(--autumn-text-muted);
  font-size: 10px;
  font-weight: 750;
}

html[data-autumn-appearance="true"] .ds-widget-color input {
  inline-size: 46px;
  block-size: 38px;
  padding: 4px;
}

html[data-autumn-appearance="true"] .ds-widget-size-stepper {
  display: grid;
  grid-template-columns: 40px minmax(62px, 1fr) 40px;
  gap: 6px;
}

html[data-autumn-appearance="true"] .ds-widget-size-stepper button,
html[data-autumn-appearance="true"] .ds-widget-size-stepper output {
  display: grid;
  place-items: center;
  block-size: 40px;
  margin: 0;
  border: 1px solid var(--autumn-border);
  border-radius: 8px;
  color: var(--autumn-text);
  background: var(--autumn-control-surface);
}

html[data-autumn-appearance="true"] .ds-widget-size-stepper button {
  inline-size: 40px;
  min-inline-size: 40px;
  padding: 0;
  font-size: 20px;
}

html[data-autumn-appearance="true"] .ds-mask-source,
html[data-autumn-appearance="true"] .ds-mask-drawing-help {
  display: grid;
  gap: 4px;
  padding: 9px 10px;
  border-inline-start: 3px solid var(--autumn-accent-primary);
  color: var(--autumn-text-muted);
  background: var(--autumn-accent-primary-soft);
  font-size: 9px;
  line-height: 1.5;
}

html[data-autumn-appearance="true"] .ds-mask-source strong {
  color: var(--autumn-text);
  font-size: 10px;
}

html[data-autumn-appearance="true"] .ds-mask-proof-switch,
html[data-autumn-appearance="true"] .ds-mask-control-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

html[data-autumn-appearance="true"] .ds-mask-edit-toggle {
  inline-size: 100%;
}

/* Existing upload-folder dialog, brought onto the same semantic surface. */
html[data-autumn-appearance="true"] .ds-template-folder-dialog {
  position: fixed;
  z-index: 6000;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 20px;
  background: color-mix(in srgb, var(--autumn-text), transparent 48%);
  backdrop-filter: blur(5px);
}

html[data-autumn-appearance="true"] .ds-template-folder-dialog-card {
  display: grid;
  gap: 13px;
  inline-size: min(420px, calc(100vw - 40px));
  padding: 20px;
  border: 1px solid var(--autumn-border);
  border-radius: var(--autumn-ui-radius);
  color: var(--autumn-text);
  background: var(--autumn-surface-elevated);
  box-shadow: var(--autumn-shadow);
}

html[data-autumn-appearance="true"] .ds-template-folder-dialog-card :is(header, footer) {
  display: flex;
  align-items: center;
  gap: 10px;
}

html[data-autumn-appearance="true"] .ds-template-folder-dialog-card header {
  justify-content: space-between;
}

html[data-autumn-appearance="true"] .ds-template-folder-dialog-card footer {
  justify-content: flex-end;
}

html[data-autumn-appearance="true"] .ds-template-folder-dialog-card header button {
  display: grid;
  place-items: center;
  inline-size: 32px;
  min-inline-size: 32px;
  block-size: 32px;
  min-block-size: 32px;
  padding: 0;
}

html[data-autumn-appearance="true"] .ds-template-folder-dialog-card footer button {
  min-inline-size: 96px;
}

html[data-autumn-appearance="true"] .ds-template-folder-dialog-card footer button.primary {
  border-color: var(--autumn-accent-primary);
  color: var(--autumn-accent-on-primary);
  background: var(--autumn-accent-primary);
}

html[data-autumn-appearance="true"] .ds-fullscreen-host {
  position: fixed;
  z-index: 100000;
  inset: 0;
  display: grid;
  place-items: center;
  background: #05070c;
}

html[data-autumn-appearance="true"] .ds-fullscreen-host canvas {
  display: block;
  max-inline-size: 100vw;
  max-block-size: 100vh;
  inline-size: auto;
  block-size: auto;
}

@media (max-width: 1450px) and (min-width: 1001px) {
  html[data-autumn-appearance="true"] .ds-approved-workspace {
    grid-template-columns: 300px minmax(0, 1fr) 380px;
    gap: 0;
  }

  html[data-autumn-appearance="true"] .ds-approved-template-browser,
  html[data-autumn-appearance="true"] .ds-approved-inspector-body {
    padding-inline: 12px;
  }

  html[data-autumn-appearance="true"] .ds-element-grid {
    gap: 8px;
  }

  html[data-autumn-appearance="true"] .ds-element-grid button {
    block-size: 78px;
  }
}

@media (max-width: 1180px) and (min-width: 1001px) {
  html[data-autumn-appearance="true"] .ds-approved-workspace {
    grid-template-columns: 220px minmax(0, 1fr) 300px;
  }

  html[data-autumn-appearance="true"] .ds-element-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1000px) {
  html[data-autumn-appearance="true"] .ds-approved-workspace {
    grid-template-columns: 1fr;
    block-size: auto;
    max-block-size: none;
    overflow: visible;
  }

  html[data-autumn-appearance="true"] .ds-approved-template-browser,
  html[data-autumn-appearance="true"] .ds-approved-editor,
  html[data-autumn-appearance="true"] .ds-approved-right-rail {
    min-block-size: 620px;
    border-inline-end: 0;
    border-block-end: 1px solid var(--autumn-border);
  }

  html[data-autumn-appearance="true"] .ds-approved-right-rail {
    min-block-size: 720px;
  }
}

/* Users and Settings chrome. */
html[data-autumn-appearance="true"] body:has(.approved-users-page) #app#app#app#app.shell #view#view#view#view .approved-users-kpis article {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-appearance-content-overlay) !important;
  box-shadow: var(--autumn-button-shadow) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-users-page) #app#app#app#app.shell #view#view#view#view :is(
  .approved-users-kpis article > span,
  .approved-table-user > span
) {
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-interactive-gradient) !important;
  box-shadow: 0 7px 17px color-mix(in srgb, var(--autumn-accent-primary), transparent 74%) !important;
}

html[data-autumn-appearance="true"] body:has(.settings-appearance-page, .autumn-saas-settings) #app#app#app#app.shell #view#view#view#view :is(
  .settings-card-icon,
  .settings-time-preview svg, .settings-time-preview circle,
  .settings-time-preview path
) {
  border-color: color-mix(in srgb, var(--autumn-accent-primary), transparent 68%) !important;
  color: var(--autumn-accent-primary) !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  background-color: var(--autumn-accent-primary-soft) !important;
  background-image: none !important;
}

html[data-autumn-appearance="true"] body:has(.settings-appearance-page, .autumn-saas-settings) #app#app#app#app.shell #view#view#view#view .settings-theme-preview::after {
  background: var(--autumn-interactive-gradient) !important;
}

html[data-autumn-appearance="true"] body:has(.settings-appearance-page, .autumn-saas-settings) #app#app#app#app.shell #view#view#view#view :is(
  .settings-theme-option input:checked + .settings-theme-choice,
  .settings-tabs button.active
) {
  border-color: var(--autumn-accent-primary) !important;
  color: var(--autumn-accent-primary-hover) !important;
  background: var(--autumn-selected-surface) !important;
  box-shadow: inset 0 0 0 1px var(--autumn-accent-primary) !important;
}

/* High-risk late-injected components that are not named card/panel. */
html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]):not(:has(.approved-standalone-schedules, .approved-standalone-daily, .dashboard-shell)) #app#app#app#app.shell #view#view#view#view button:not(:where(
  .approved-standalone-schedules .approved-organizer-row > button,
  .autumn-premium-users *,
  .ds-approved-design-studio *,
  .ds-approved-stage *, [data-design-canvas] *, [data-player-preview] *,
  .player-preview *, .ds-template-composite *,
  .ds-approved-template-placeholder *, .ds-template-real-preview *,
  .ds-hotel-template-preview *, .ds-template-loading-preview *
)) {
  min-block-size: var(--autumn-ui-control-height) !important;
  border-radius: calc(var(--autumn-ui-radius) * .72) !important;
  font-size: var(--autumn-ui-text-sm) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]) #app#app#app#app.shell #view#view#view#view button:is(
  .ds-text-color-family, .ds-text-color-shade,
  .ds-approved-color-swatch, .color-swatch
) {
  background-color: var(--swatch, var(--accent, transparent)) !important;
  background-image: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily) #app#app#app#app.shell #view#view#view#view :is(
  .approved-view-switch,
  .approved-day-event, .fallback-slot,
  .approved-organizer-field, .approved-screen-organizer-field,
  .approved-organizer-option, .organizer-name,
  .organizer-screen-option
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-control-surface) !important;
  background-image: none !important;
  box-shadow: var(--autumn-button-shadow) !important;
}

html[data-autumn-appearance="true"] body :is(
  .approved-organizer-option.selected,
  .approved-organizer-option[aria-selected="true"],
  .organizer-screen-option.selected,
  .organizer-screen-option[aria-selected="true"]
) {
  border-color: var(--autumn-accent-primary) !important;
  color: var(--autumn-accent-primary-hover) !important;
  background: var(--autumn-selected-surface) !important;
  box-shadow: inset 0 0 0 1px var(--autumn-accent-primary) !important;
}

html[data-autumn-appearance="true"] body :is(
  .organizer-name, .organizer-screen-option
) > span:first-child {
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-interactive-gradient) !important;
}

html[data-autumn-appearance="true"] body .corrected-clock-modal :is(
  .luxury-clock-fields, .luxury-clock-face
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-control-surface) !important;
  box-shadow: var(--autumn-button-shadow) !important;
}

html[data-autumn-appearance="true"] body .corrected-clock-modal :is(
  .luxury-clock-hour, .luxury-clock-minute, .luxury-clock-hand
) {
  background: var(--autumn-accent-primary) !important;
}

html[data-autumn-appearance="true"] body .corrected-clock-modal :is(
  .luxury-clock-pivot, .luxury-clock-center
) {
  border-color: var(--autumn-surface-elevated) !important;
  background: var(--autumn-accent-secondary) !important;
}

html[data-autumn-appearance="true"] body :is(
  .approved-picker-drag-ghost,
  #upload-status.is-uploading,
  .approved-content-upload-status.is-uploading,
  .approved-content-upload-status.loading
) {
  border-color: var(--autumn-accent-primary) !important;
  color: var(--autumn-accent-primary-hover) !important;
  background: var(--autumn-selected-surface) !important;
  box-shadow: var(--autumn-shadow) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-users-page) #app#app#app#app.shell #view#view#view#view .approved-users-table-card tbody tr.selected {
  color: var(--autumn-text) !important;
  background: var(--autumn-selected-surface) !important;
  box-shadow: inset 3px 0 var(--autumn-accent-primary) !important;
}

html[dir="rtl"][data-autumn-appearance="true"] body:has(.approved-users-page) #app#app#app#app.shell #view#view#view#view .approved-users-table-card tbody tr.selected {
  box-shadow: inset -3px 0 var(--autumn-accent-primary) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-users-page) #app#app#app#app.shell #view#view#view#view :is(
  .approved-role-badge, .approved-role-badge.super_admin,
  .approved-role-badge.custom
) {
  border-color: color-mix(in srgb, var(--autumn-accent-primary), transparent 68%) !important;
  color: var(--autumn-accent-primary-hover) !important;
  background: var(--autumn-accent-primary-soft) !important;
}

html[data-autumn-appearance="true"] body:has(.settings-appearance-page, .autumn-saas-settings) #app#app#app#app.shell #view#view#view#view .settings-tabs button.active::after {
  background: var(--autumn-accent-primary) !important;
}

html[data-autumn-appearance="true"] body:has(.settings-appearance-page, .autumn-saas-settings) #app#app#app#app.shell #view#view#view#view :is(
  .settings-theme-choice, .settings-notification-item,
  .settings-media-preference-row,
  .settings-time-preview, .settings-file-types,
  .settings-screensaver-preview
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-control-surface) !important;
  background-image: none !important;
  box-shadow: var(--autumn-button-shadow) !important;
}

html[data-autumn-appearance="true"] body:has(.settings-appearance-page, .autumn-saas-settings) #app#app#app#app.shell #view#view#view#view .settings-theme-option input:checked + .settings-theme-choice::after {
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-accent-primary) !important;
}

html[data-autumn-appearance="true"] body:has(.settings-appearance-page, .autumn-saas-settings) #app#app#app#app.shell #view#view#view#view :is(
  .settings-scale-value, .settings-toggle span
) {
  border-color: color-mix(in srgb, var(--autumn-accent-primary), transparent 64%) !important;
  color: var(--autumn-accent-primary-hover) !important;
  background: var(--autumn-accent-primary-soft) !important;
}

html[data-autumn-appearance="true"] body:has(.settings-appearance-page, .autumn-saas-settings) #app#app#app#app.shell #view#view#view#view .settings-scale-range::-webkit-slider-runnable-track {
  background: linear-gradient(90deg,
    var(--autumn-accent-primary) 0 var(--settings-scale-progress),
    var(--autumn-border) var(--settings-scale-progress) 100%) !important;
}

html[data-autumn-appearance="true"] body:has(.settings-appearance-page, .autumn-saas-settings) #app#app#app#app.shell #view#view#view#view .settings-scale-range::-moz-range-track {
  background: linear-gradient(90deg,
    var(--autumn-accent-primary) 0 var(--settings-scale-progress),
    var(--autumn-border) var(--settings-scale-progress) 100%) !important;
}

html[data-autumn-appearance="true"] body:has(.settings-appearance-page, .autumn-saas-settings) #app#app#app#app.shell #view#view#view#view .settings-scale-range::-webkit-slider-thumb {
  background: var(--autumn-accent-primary) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--autumn-accent-primary), transparent 82%),
    var(--autumn-button-shadow) !important;
}

html[data-autumn-appearance="true"] body:has(.settings-appearance-page, .autumn-saas-settings) #app#app#app#app.shell #view#view#view#view .settings-scale-range::-moz-range-thumb {
  background: var(--autumn-accent-primary) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--autumn-accent-primary), transparent 82%),
    var(--autumn-button-shadow) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view :is(
  .dashboard-weather, .dashboard-kpi-card
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-appearance-content-overlay) !important;
  background-image: linear-gradient(145deg,
    color-mix(in srgb, var(--autumn-surface-elevated), transparent 8%),
    color-mix(in srgb, var(--autumn-surface), var(--autumn-accent-primary-soft) 8%)) !important;
  box-shadow: var(--autumn-shadow) !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view :is(
  .dashboard-weather-icon, .dashboard-kpi-icon,
  .dashboard-screen-thumb
) {
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-interactive-gradient) !important;
  filter: none !important;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--autumn-accent-primary), transparent 72%) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-screens-page) #app#app#app#app.shell #view#view#view#view .screens-table tbody tr.selected {
  color: var(--autumn-text) !important;
  background: var(--autumn-selected-surface) !important;
  box-shadow: inset 3px 0 var(--autumn-accent-primary) !important;
}

html[dir="rtl"][data-autumn-appearance="true"] body:has(.approved-screens-page) #app#app#app#app.shell #view#view#view#view .screens-table tbody tr.selected {
  box-shadow: inset -3px 0 var(--autumn-accent-primary) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-screens-page) #app#app#app#app.shell #view#view#view#view :is(
  .screens-thumbnail, .screens-thumbnail.empty,
  .screen-viewer-playlist, .screen-detail-content li,
  .screen-detail-log, .screen-detail-actions
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-control-surface) !important;
  background-image: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-screens-page) #app#app#app#app.shell #view#view#view#view .screen-status-badge.online {
  border-color: var(--autumn-success) !important;
  color: var(--autumn-success) !important;
  background: var(--autumn-success-soft) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-screens-page) #app#app#app#app.shell #view#view#view#view .screen-status-badge.offline {
  border-color: var(--autumn-danger) !important;
  color: var(--autumn-danger) !important;
  background: var(--autumn-danger-soft) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-screens-page) #app#app#app#app.shell #view#view#view#view .screen-status-badge.warning {
  border-color: var(--autumn-warning) !important;
  color: var(--autumn-warning) !important;
  background: var(--autumn-warning-soft) !important;
}

/* Approved status badge treatment: restrained semantic colour, clear outline and
   a compact state dot. This is Admin chrome only; runtime/player content is not
   targeted. */
html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-screen-pulse-row.offline > b {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-width: 86px !important;
  min-height: 28px !important;
  padding: 6px 11px !important;
  border: 1px solid color-mix(in srgb, var(--autumn-danger), var(--autumn-border) 42%) !important;
  border-radius: 999px !important;
  color: color-mix(in srgb, var(--autumn-danger), var(--autumn-text) 22%) !important;
  background: color-mix(in srgb, var(--autumn-danger-soft), var(--autumn-control-surface) 48%) !important;
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--autumn-surface-elevated), transparent 8%),
    0 4px 12px color-mix(in srgb, var(--autumn-danger), transparent 91%) !important;
  font-size: max(11px, var(--autumn-ui-text-xs)) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
}

html[data-autumn-appearance="true"] body.dashboard-active #app#app#app#app.shell #view#view#view#view .dashboard-screen-pulse-row.offline > b::before {
  content: "" !important;
  flex: 0 0 auto !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: var(--autumn-danger) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--autumn-danger), transparent 86%) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-screens-page) #app#app#app#app.shell #view#view#view#view .screen-status-badge.offline {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: 28px !important;
  padding: 6px 11px !important;
  border: 1px solid color-mix(in srgb, var(--autumn-danger), var(--autumn-border) 42%) !important;
  border-radius: 999px !important;
  color: color-mix(in srgb, var(--autumn-danger), var(--autumn-text) 22%) !important;
  background: color-mix(in srgb, var(--autumn-danger-soft), var(--autumn-control-surface) 48%) !important;
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--autumn-surface-elevated), transparent 8%),
    0 4px 12px color-mix(in srgb, var(--autumn-danger), transparent 91%) !important;
  font-size: max(11px, var(--autumn-ui-text-xs)) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
}

html[data-autumn-appearance="true"] body:has(.approved-screens-page) #app#app#app#app.shell #view#view#view#view .screen-status-badge.offline > i {
  flex: 0 0 auto !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: var(--autumn-danger) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--autumn-danger), transparent 86%) !important;
}

/* Daily is Admin scheduling chrome, not signage output. Keep its geometry and
   drag/drop behavior while replacing the retained warm skin with the active
   semantic identity. */
html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily :is(
  .fallback-timeline,
  .schedule-right.approved-daily-content-picker
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-appearance-content-overlay) !important;
  background-image: linear-gradient(145deg,
    color-mix(in srgb, var(--autumn-surface-elevated), transparent 8%),
    color-mix(in srgb, var(--autumn-surface), var(--autumn-accent-primary-soft) 8%)) !important;
  box-shadow: var(--autumn-shadow) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .fallback-timeline > header {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: color-mix(in srgb, var(--autumn-header-surface), transparent 5%) !important;
  background-image: linear-gradient(145deg,
    color-mix(in srgb, var(--autumn-header-surface), var(--autumn-accent-primary-soft) 5%),
    color-mix(in srgb, var(--autumn-surface), transparent 10%)) !important;
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--autumn-surface-elevated), transparent 20%) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily :is(
  .fallback-track,
  .fallback-canvas,
  .approved-daily-picker-scroll,
  .media-rail,
  .daily-main-selection-bar
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: color-mix(in srgb, var(--autumn-control-surface), transparent 12%) !important;
  background-image: linear-gradient(145deg,
    color-mix(in srgb, var(--autumn-control-surface), transparent 9%),
    color-mix(in srgb, var(--autumn-canvas), var(--autumn-accent-primary-soft) 5%)) !important;
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--autumn-surface-elevated), transparent 28%) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily :is(
  .approved-daily-title-centered,
  .fallback-empty strong
) {
  color: var(--autumn-text) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .approved-daily-header-label {
  color: var(--autumn-accent-primary) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .approved-content-upload-status {
  border-color: color-mix(in srgb, var(--autumn-warning), var(--autumn-border) 45%) !important;
  color: color-mix(in srgb, var(--autumn-warning), var(--autumn-text) 26%) !important;
  background: color-mix(in srgb, var(--autumn-warning), var(--autumn-control-surface) 90%) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell[style*="display: block"]):has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .approved-daily-header-label {
  color: var(--autumn-accent-primary) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily :is(
  .approved-organizer-dropdown > summary,
  .approved-organizer-placeholder
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-control-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .fallback-empty {
  color: var(--autumn-text-muted) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily :is(
  .daily-select-all,
  input[type="checkbox"]
) {
  accent-color: var(--autumn-accent-primary) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily :is(
  .fallback-canvas,
  .approved-daily-picker-scroll,
  .media-rail
) {
  scrollbar-color: var(--autumn-accent-primary) var(--autumn-border) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily :is(
  .fallback-canvas,
  .approved-daily-picker-scroll,
  .media-rail
)::-webkit-scrollbar-thumb {
  border: 2px solid var(--autumn-control-surface) !important;
  border-radius: 999px !important;
  background: var(--autumn-accent-primary) !important;
}

/* Daily detail pass. These selectors only recolour Admin controls and state;
   media pixels, template artwork and signage output remain untouched. */
html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily :is(
  .fallback-copy span,
  .fallback-empty span,
  .approved-picker-empty,
  .approved-organizer-empty
) {
  color: var(--autumn-text-muted) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .approved-content-organization {
  border-color: var(--autumn-border) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .approved-organizer-dropdown > summary.approved-organizer-placeholder > span,
html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .approved-organizer-option.placeholder > button:first-child {
  color: var(--autumn-text-muted) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .approved-organizer-dropdown > summary > i {
  border-color: var(--autumn-text-muted) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .approved-organizer-dropdown > summary:focus-visible,
html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .approved-organizer-dropdown[open] > summary {
  border-color: var(--autumn-accent-primary) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--autumn-focus), transparent 76%) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily :is(
  .approved-organizer-menu,
  .fallback-canvas,
  .approved-daily-picker-scroll,
  .media-rail
)::-webkit-scrollbar-track {
  border-color: var(--autumn-border) !important;
  background: var(--autumn-border) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .approved-organizer-menu::-webkit-scrollbar-thumb {
  border-color: var(--autumn-control-surface) !important;
  background: var(--autumn-accent-primary) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .fallback-slot.daily-drop-before::before,
html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .fallback-slot.daily-drop-after::after {
  background: var(--autumn-accent-primary) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--autumn-accent-primary), transparent 82%) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .daily-push-track {
  border-color: var(--autumn-border) !important;
  background: var(--autumn-control-surface) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .daily-push-track > span {
  background: var(--autumn-interactive-gradient) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .daily-push-time {
  color: var(--autumn-text-muted) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily .daily-push-progress.done .daily-push-time {
  color: var(--autumn-success) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .approved-standalone-daily select option {
  color: var(--autumn-text) !important;
  background: var(--autumn-control-surface) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app#app#app.shell #view#view#view#view#view#view .approved-standalone-daily :is(
  .daily-main-delete,
  .approved-content-delete
) {
  border-color: color-mix(in srgb, var(--autumn-danger), var(--autumn-border) 52%) !important;
  color: var(--autumn-danger) !important;
  background-color: var(--autumn-danger-soft) !important;
  background-image: none !important;
  box-shadow: var(--autumn-button-shadow) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app#app#app.shell #view#view#view#view#view#view .approved-standalone-daily :is(
  .daily-main-delete,
  .approved-content-delete
):not(:disabled):hover {
  border-color: var(--autumn-danger) !important;
  color: var(--autumn-danger-on) !important;
  background: var(--autumn-danger) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app#app#app.shell #view#view#view#view#view#view .approved-standalone-daily :is(
  .daily-main-delete,
  .approved-content-delete
):disabled {
  opacity: .48 !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) :is(
  #upload-status.is-uploading,
  .approved-content-upload-status.is-uploading,
  #default-media-upload-status.is-uploading
)::before {
  border-color: color-mix(in srgb, var(--autumn-accent-primary), transparent 76%) !important;
  border-top-color: var(--autumn-accent-primary) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) :is(
  #upload-status.is-uploading,
  .approved-content-upload-status.is-uploading,
  #default-media-upload-status.is-uploading
)::after {
  background: linear-gradient(90deg,
    var(--autumn-accent-primary) 0 var(--media-upload-progress),
    color-mix(in srgb, var(--autumn-accent-primary), transparent 84%) var(--media-upload-progress) 100%) !important;
}

/* The no-screen Daily state is rendered beside (not inside) the normal Daily
   shell, so it needs an explicit semantic skin. */
html[data-autumn-appearance="true"] body:has(.approved-standalone-daily-empty) #app#app#app#app#app.shell #view#view#view#view .approved-standalone-daily-empty .approved-schedule-state {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-appearance-content-overlay) !important;
  background-image: linear-gradient(145deg,
    color-mix(in srgb, var(--autumn-surface-elevated), transparent 8%),
    color-mix(in srgb, var(--autumn-surface), var(--autumn-accent-primary-soft) 8%)) !important;
  box-shadow: var(--autumn-shadow) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily-empty) #app#app#app#app#app.shell #view#view#view#view .approved-standalone-daily-empty .approved-schedule-state > span {
  color: var(--autumn-accent-primary) !important;
  background: var(--autumn-accent-primary-soft) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily-empty) #app#app#app#app#app.shell #view#view#view#view .approved-standalone-daily-empty .approved-schedule-state.error > span {
  color: var(--autumn-danger) !important;
  background: var(--autumn-danger-soft) !important;
}

/* Organizer dialog is appended to body, outside #view. Theme its Admin chrome
   without changing its DOM, bindings, geometry or target selection. */
html[data-autumn-appearance="true"] body .autumn-organizer-modal.autumn-organizer-modal {
  background: color-mix(in srgb, var(--autumn-shadow-color), transparent 54%) !important;
}

html[data-autumn-appearance="true"] body .autumn-organizer-modal.autumn-organizer-modal > section[role="dialog"] {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-surface-elevated) !important;
  background-image: linear-gradient(145deg,
    color-mix(in srgb, var(--autumn-surface-elevated), transparent 3%),
    color-mix(in srgb, var(--autumn-surface), var(--autumn-accent-primary-soft) 8%)) !important;
  box-shadow: 0 28px 76px color-mix(in srgb, var(--autumn-shadow-color), transparent 12%),
    inset 0 1px 0 color-mix(in srgb, var(--autumn-surface-elevated), transparent 12%) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body .autumn-organizer-modal.autumn-organizer-modal :is(
  header small,
  header h2,
  .organizer-name,
  .organizer-screen-option
) {
  color: var(--autumn-text) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body .autumn-organizer-modal.autumn-organizer-modal header small {
  color: var(--autumn-accent-primary) !important;
}

html[data-autumn-appearance="true"] body .autumn-organizer-modal.autumn-organizer-modal :is(
  .organizer-name input,
  .organizer-screen-option
) {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-control-surface) !important;
  background-image: none !important;
  box-shadow: var(--autumn-button-shadow) !important;
}

html[data-autumn-appearance="true"] body .autumn-organizer-modal.autumn-organizer-modal .organizer-name input:focus {
  border-color: var(--autumn-accent-primary) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--autumn-focus), transparent 76%) !important;
}

html[data-autumn-appearance="true"] body .autumn-organizer-modal.autumn-organizer-modal .organizer-screen-option > span {
  color: var(--autumn-accent-primary-hover) !important;
  background: var(--autumn-accent-primary-soft) !important;
}

html[data-autumn-appearance="true"] body .autumn-organizer-modal.autumn-organizer-modal footer {
  border-color: var(--autumn-border) !important;
}

html[data-autumn-appearance="true"] body .autumn-organizer-modal.autumn-organizer-modal footer button:last-child {
  border-color: color-mix(in srgb, var(--autumn-accent-primary), var(--autumn-border) 28%) !important;
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-interactive-gradient) !important;
  box-shadow: 0 10px 24px color-mix(in srgb, var(--autumn-accent-primary), transparent 72%) !important;
}

html[data-autumn-appearance="true"] body .autumn-organizer-modal.autumn-organizer-modal .organizer-delete {
  border-color: color-mix(in srgb, var(--autumn-danger), var(--autumn-border) 52%) !important;
  color: var(--autumn-danger) !important;
  background: var(--autumn-danger-soft) !important;
}

/* Daily template artwork is protected. Only the surrounding Admin preview and
   picker chrome follows Appearance Studio. */
html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .autumn-daily-template-preview {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-control-surface) !important;
  background-image: linear-gradient(145deg,
    color-mix(in srgb, var(--autumn-control-surface), transparent 4%),
    color-mix(in srgb, var(--autumn-accent-primary-soft), var(--autumn-control-surface) 76%)) !important;
  box-shadow: var(--autumn-button-shadow) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .autumn-daily-template-copy :is(small, strong, span) {
  color: var(--autumn-text) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .autumn-daily-template-copy :is(small, span) {
  color: var(--autumn-text-muted) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) #app#app#app#app.shell #view#view#view#view .autumn-daily-template-copy small {
  color: var(--autumn-accent-primary) !important;
}

html[data-autumn-appearance="true"] body .autumn-daily-template-modal.autumn-daily-template-modal {
  background: color-mix(in srgb, var(--autumn-shadow-color), transparent 48%) !important;
}

html[data-autumn-appearance="true"] body .autumn-daily-template-dialog.autumn-daily-template-dialog {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-surface-elevated) !important;
  background-image: linear-gradient(145deg,
    color-mix(in srgb, var(--autumn-surface-elevated), transparent 3%),
    color-mix(in srgb, var(--autumn-surface), var(--autumn-accent-primary-soft) 7%)) !important;
  box-shadow: 0 34px 80px color-mix(in srgb, var(--autumn-shadow-color), transparent 8%) !important;
}

html[data-autumn-appearance="true"] body .autumn-daily-template-dialog.autumn-daily-template-dialog :is(
  h2,
  header p,
  .autumn-daily-template-option,
  .autumn-daily-template-option span,
  .autumn-daily-template-assignment > em
) {
  color: var(--autumn-text) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body .autumn-daily-template-dialog.autumn-daily-template-dialog :is(
  header p,
  .autumn-daily-template-option span,
  .autumn-daily-template-assignment > em
) {
  color: var(--autumn-text-muted) !important;
}

html[data-autumn-appearance="true"] body .autumn-daily-template-dialog.autumn-daily-template-dialog :is(
  .autumn-daily-template-orientation-tabs,
  .autumn-daily-template-option,
  .autumn-daily-template-active-inside
) {
  border-color: var(--autumn-border) !important;
  background-color: var(--autumn-control-surface) !important;
  background-image: none !important;
  box-shadow: var(--autumn-button-shadow) !important;
}

html[data-autumn-appearance="true"] body .autumn-daily-template-dialog.autumn-daily-template-dialog .autumn-daily-template-orientation-tabs button.active {
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-interactive-gradient) !important;
  box-shadow: 0 9px 20px color-mix(in srgb, var(--autumn-accent-primary), transparent 72%) !important;
}

html[data-autumn-appearance="true"] body .autumn-daily-template-dialog.autumn-daily-template-dialog :is(
  .autumn-daily-template-option.selected,
  .autumn-daily-template-option.has-active
) {
  border-color: var(--autumn-accent-primary) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--autumn-accent-primary), transparent 86%),
    var(--autumn-button-shadow) !important;
}

html[data-autumn-appearance="true"] body .autumn-daily-template-dialog.autumn-daily-template-dialog :is(
  .autumn-template-new-badge,
  .autumn-daily-template-active-inside > small
) {
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-interactive-gradient) !important;
}

html[data-autumn-appearance="true"] body .autumn-daily-template-dialog.autumn-daily-template-dialog .autumn-daily-template-status.preparing {
  color: color-mix(in srgb, var(--autumn-warning), var(--autumn-text) 28%) !important;
  background: var(--autumn-warning-soft) !important;
}

html[data-autumn-appearance="true"] body .autumn-daily-template-dialog.autumn-daily-template-dialog .autumn-daily-template-status.ready {
  color: var(--autumn-success) !important;
  background: var(--autumn-success-soft) !important;
}

html[data-autumn-appearance="true"] body .autumn-daily-template-dialog.autumn-daily-template-dialog .autumn-daily-template-status.failed {
  color: var(--autumn-danger) !important;
  background: var(--autumn-danger-soft) !important;
}

/* Sign-in uses the approved calm canvas; falling leaves provide its only
   background decoration. Shared Admin background photos are not used here. */
html body #login#login#login.autumn-login-stage {
  color: var(--autumn-text) !important;
  background-color: var(--autumn-canvas) !important;
  background-image: var(--autumn-canvas-gradient, none) !important;
  background-position: center !important;
  background-size: cover !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html body #login#login#login.autumn-login-stage::before {
  display: none !important;
}

html body #login#login#login.autumn-login-stage :is(.autumn-login-story, .autumn-login-card) {
  border-color: color-mix(in srgb, var(--autumn-border), transparent 10%) !important;
  color: var(--autumn-text) !important;
  background-color: color-mix(in srgb, var(--autumn-surface-elevated), transparent 8%) !important;
  background-image: linear-gradient(145deg,
    color-mix(in srgb, var(--autumn-surface-elevated), transparent 10%),
    color-mix(in srgb, var(--autumn-surface), var(--autumn-accent-primary-soft) 8%)) !important;
  box-shadow:
    0 28px 68px color-mix(in srgb, var(--autumn-shadow-color), transparent 14%),
    inset 0 1px 0 color-mix(in srgb, var(--autumn-surface-elevated), transparent 8%) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html body #login#login#login.autumn-login-stage .login-story-brand strong {
  color: var(--autumn-text) !important;
  background: none !important;
  background-image: none !important;
  background-clip: border-box !important;
  -webkit-background-clip: border-box !important;
  -webkit-text-fill-color: currentColor !important;
  font-family: var(--autumn-ui-font-family) !important;
  font-weight: 700 !important;
  letter-spacing: -.03em !important;
  text-shadow: none !important;
}

html body #login#login#login.autumn-login-stage :is(
  .autumn-login-card h1,
  .autumn-login-card .login-field
) {
  color: var(--autumn-text) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html body #login#login#login.autumn-login-stage :is(
  .autumn-login-card .login-copy,
  .autumn-login-phrases p
) {
  border-color: color-mix(in srgb, var(--autumn-border), transparent 18%) !important;
  color: var(--autumn-text-muted) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html body #login#login#login.autumn-login-stage .autumn-login-phrases p::after {
  color: var(--autumn-accent-primary) !important;
  background: color-mix(in srgb, var(--autumn-surface), transparent 8%) !important;
}

html body #login#login#login.autumn-login-stage .autumn-input-shell > svg {
  stroke: var(--autumn-accent-primary) !important;
}

html body #login#login#login.autumn-login-stage .autumn-login-card .login-field input {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background: color-mix(in srgb, var(--autumn-control-surface), transparent 5%) !important;
  box-shadow: inset 0 1px 2px color-mix(in srgb, var(--autumn-shadow-color), transparent 72%) !important;
  font-family: var(--autumn-ui-font-family) !important;
}

html body #login#login#login.autumn-login-stage .autumn-login-card .login-field input::placeholder {
  color: var(--autumn-text-muted) !important;
}

html body #login#login#login.autumn-login-stage .autumn-login-card .login-field input:focus {
  border-color: var(--autumn-accent-primary) !important;
  background: var(--autumn-control-surface) !important;
  box-shadow:
    0 0 0 4px color-mix(in srgb, var(--autumn-focus), transparent 74%),
    inset 0 1px 2px color-mix(in srgb, var(--autumn-shadow-color), transparent 76%) !important;
}

html body #login#login#login.autumn-login-stage .autumn-password-toggle {
  color: var(--autumn-text-muted) !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html body #login#login#login.autumn-login-stage .autumn-password-toggle:hover {
  color: var(--autumn-accent-primary) !important;
  background: var(--autumn-hover-surface) !important;
  background-image: none !important;
}

html body #login#login#login.autumn-login-stage .autumn-login-card button.login-primary {
  height: 48px !important;
  margin-top: clamp(22px, 1.6vw, 28px) !important;
  border-color: color-mix(in srgb, var(--autumn-accent-primary), var(--autumn-border) 28%) !important;
  border-radius: 12px !important;
  color: var(--autumn-accent-on-primary) !important;
  background-color: var(--autumn-accent-primary) !important;
  background-image: linear-gradient(180deg,
    color-mix(in srgb, var(--autumn-accent-primary), var(--autumn-surface-elevated) 10%),
    var(--autumn-accent-primary)) !important;
  box-shadow:
    0 8px 18px color-mix(in srgb, var(--autumn-accent-primary), transparent 80%),
    inset 0 1px 0 color-mix(in srgb, var(--autumn-surface-elevated), transparent 68%) !important;
  font-family: var(--autumn-ui-font-family) !important;
  font-size: max(14px, var(--autumn-ui-text-sm)) !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

html body #login#login#login.autumn-login-stage .autumn-login-card button.login-primary:hover {
  color: var(--autumn-accent-on-primary) !important;
  background-color: var(--autumn-accent-primary-hover) !important;
  background-image: linear-gradient(180deg,
    color-mix(in srgb, var(--autumn-accent-primary-hover), var(--autumn-surface-elevated) 8%),
    var(--autumn-accent-primary-hover)) !important;
  box-shadow: 0 10px 20px color-mix(in srgb, var(--autumn-accent-primary), transparent 78%) !important;
}

html body #login#login#login.autumn-login-stage .autumn-login-card button.login-primary:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--autumn-focus), transparent 24%) !important;
  outline-offset: 3px !important;
}

html body #login#login#login.autumn-login-stage .autumn-login-card button.login-primary:active {
  background-image: none !important;
  box-shadow: inset 0 2px 5px color-mix(in srgb, var(--autumn-text), transparent 78%) !important;
}

html body #login#login#login.autumn-login-stage .autumn-login-card button.login-link {
  min-height: 40px !important;
  padding: 8px 10px !important;
  color: color-mix(in srgb, var(--autumn-accent-primary), var(--autumn-text) 35%) !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  font-family: var(--autumn-ui-font-family) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

html body #login#login#login.autumn-login-stage .autumn-login-card button.login-link:hover {
  color: var(--autumn-accent-primary) !important;
  background: transparent !important;
  background-image: none !important;
  text-decoration: underline !important;
}

html body #login#login#login.autumn-login-stage .autumn-login-card #notice {
  color: var(--autumn-danger) !important;
}

html body #login#login#login.autumn-login-stage :is(
  .autumn-login-story .autumn-leaf-brand,
  .autumn-login-card .login-card-mark .autumn-leaf-brand
) {
  filter: drop-shadow(0 13px 18px color-mix(in srgb, var(--autumn-shadow-color), transparent 12%)) !important;
}

html body #login#login#login.autumn-login-stage .autumn-login-leaf {
  filter: blur(var(--blur)) drop-shadow(0 8px 7px color-mix(in srgb, var(--autumn-shadow-color), transparent 8%)) !important;
}

/* The Appearance Studio belongs to the admin shell only. Canvas geometry,
   player previews and screen content intentionally remain outside this layer. */
html[data-autumn-appearance="true"] :is(
  .ds-approved-stage,
  .ds-approved-stage *,
  #design-studio-canvas,
  #design-studio-inline-text,
  [data-design-canvas],
  [data-design-canvas] *,
  [data-player-preview],
  [data-player-preview] *,
  .player-preview,
  .player-preview *,
  .ds-template-composite,
  .ds-template-composite *,
  .ds-approved-template-placeholder,
  .ds-approved-template-placeholder *,
  .ds-template-real-preview,
  .ds-template-real-preview *,
  .ds-hotel-template-preview,
  .ds-hotel-template-preview *,
  .ds-template-loading-preview,
  [data-screen-live-preview] :is(img, video, canvas, iframe),
  .screen-live-preview :is(img, video, canvas, iframe),
  .screen-details-preview :is(img, video, canvas, iframe),
  .runtime-preview-canvas :is(img, video, canvas, iframe)
) {
  /* Deliberately empty: this selector documents the protected boundary. */
}



@media (max-width: 720px) {
  .autumn-appearance-studio__heading {
    align-items: stretch;
    flex-direction: column;
  }

  .autumn-appearance-studio__status {
    min-inline-size: 0;
    text-align: start;
  }

  .autumn-appearance-studio__controls,
  [data-autumn-settings-extras],
  .autumn-appearance-fields-two {
    grid-template-columns: minmax(0, 1fr);
  }


  .autumn-adaptive-identity__metrics {
    grid-template-columns: minmax(0, 1fr);
  }

}

@media (prefers-reduced-motion: reduce) {
  .autumn-appearance-studio *,
  .autumn-appearance-studio *::before,
  .autumn-appearance-studio *::after {
    scroll-behavior: auto;
    transition-duration: .01ms;
    animation-duration: .01ms;
    animation-iteration-count: 1;
  }
}

/* AUTUMN PREMIUM V1 — PHASE 1 CANONICAL FOUNDATION
   -------------------------------------------------
   This is the sole active visual owner for the Premium Screens renderer and
   the shared fixed Sidebar. Theme values stay semantic; geometry is fixed. */
html[data-autumn-background="autumn"] body:has(#app.premium-v1-shell[style*="display: block"]) {
  background-color: var(--autumn-canvas) !important;
  background-image: none !important;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell {
  --premium-v1-sidebar-rail: calc(76px * var(--autumn-ui-scale));
  --premium-v1-sidebar-expanded: calc(240px * var(--autumn-ui-scale));
  min-block-size: 100dvh;
  color: var(--autumn-text);
  background: var(--autumn-canvas);
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side > nav.nav > button[data-page="settings"] {
  --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M12 15.2a3.2 3.2 0 1 0 0-6.4 3.2 3.2 0 0 0 0 6.4Zm7.4-3.2a7.4 7.4 0 0 0-.1-1l2-1.6-2-3.5-2.5 1a8 8 0 0 0-1.8-1L14.6 3h-4l-.4 2.9a8 8 0 0 0-1.8 1l-2.5-1-2 3.5 2 1.6a7.4 7.4 0 0 0 0 2l-2 1.6 2 3.5 2.5-1a8 8 0 0 0 1.8 1l.4 2.9h4l.4-2.9a8 8 0 0 0 1.8-1l2.5 1 2-3.5-2-1.6a7.4 7.4 0 0 0 .1-1Z'/%3E%3C/svg%3E") !important;
}

/* The legacy workspace decoration is wider than a 390px viewport. Screens V1
   owns a clean canvas, so remove the obsolete decoration at its source rather
   than hiding horizontal overflow. Other Admin pages keep their current layer. */
html[data-autumn-appearance="true"] body:has(.autumn-premium-screens)
#app.premium-v1-shell main #view::before,
html[data-autumn-appearance="true"] body:has(.autumn-premium-screens)
#app.premium-v1-shell main #view::after {
  display: none !important;
  content: none !important;
}

@media (min-width: 801px) {
  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side {
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    position: fixed !important;
    z-index: 100 !important;
    inset-block: 0 !important;
    inset-inline-start: 0 !important;
    inline-size: var(--premium-v1-sidebar-expanded) !important;
    min-inline-size: var(--premium-v1-sidebar-expanded) !important;
    max-inline-size: var(--premium-v1-sidebar-expanded) !important;
    block-size: 100dvh !important;
    margin: 0 !important;
    padding: calc(18px * var(--autumn-ui-scale)) calc(10px * var(--autumn-ui-scale)) calc(154px * var(--autumn-ui-scale)) !important;
    overflow: clip !important;
    border: 0 !important;
    border-inline-end: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-sidebar-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    isolation: isolate;
    transition: none !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side:hover {
    inline-size: var(--premium-v1-sidebar-expanded) !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side::before,
  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side::after {
    display: none !important;
    content: none !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > main {
    box-sizing: border-box !important;
    inline-size: auto !important;
    min-inline-size: 0 !important;
    min-block-size: 100dvh !important;
    margin-inline-start: var(--premium-v1-sidebar-expanded) !important;
    margin-inline-end: 0 !important;
    background: var(--autumn-canvas) !important;
  }

  html[dir="rtl"][data-autumn-appearance="true"] body #app.premium-v1-shell > main {
    margin-inline-start: var(--premium-v1-sidebar-expanded) !important;
    margin-left: 0 !important;
    margin-right: var(--premium-v1-sidebar-expanded) !important;
  }

  html[dir="ltr"][data-autumn-appearance="true"] body #app.premium-v1-shell > main {
    margin-left: var(--premium-v1-sidebar-expanded) !important;
    margin-right: 0 !important;
  }

  html body #app.premium-v1-shell > aside.side > .brand {
    display: grid !important;
    flex: 0 0 auto !important;
    place-items: center !important;
    inline-size: calc(220px * var(--autumn-ui-scale)) !important;
    min-inline-size: calc(220px * var(--autumn-ui-scale)) !important;
    block-size: calc(128px * var(--autumn-ui-scale)) !important;
    min-block-size: calc(128px * var(--autumn-ui-scale)) !important;
    margin: 0 0 calc(14px * var(--autumn-ui-scale)) !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transition: none !important;
    transform: none !important;
  }

  html body #app.premium-v1-shell > aside.side > .brand > .approved-brand-lockup {
    display: flex !important;
    align-items: center !important;
    flex-direction: column !important;
    justify-content: center !important;
    inline-size: 100% !important;
    gap: calc(6px * var(--autumn-ui-scale)) !important;
    color: var(--autumn-text) !important;
    background: transparent !important;
    filter: none !important;
    transform: none !important;
  }

  html body #app.premium-v1-shell > aside.side > .brand > .approved-brand-lockup > img {
    display: block;
    flex: none !important;
    inline-size: calc(76px * var(--autumn-ui-scale)) !important;
    block-size: calc(76px * var(--autumn-ui-scale)) !important;
    margin: 0 !important;
    object-fit: contain;
    filter: none !important;
    transform: none !important;
    transition: none !important;
  }

  html body #app.premium-v1-shell > aside.side > .brand > .approved-brand-lockup > span {
    max-block-size: calc(28px * var(--autumn-ui-scale));
    opacity: 1;
    overflow: hidden;
    color: var(--autumn-text) !important;
    font-family: Georgia, serif !important;
    font-size: calc(24px * var(--autumn-ui-scale)) !important;
    line-height: 1.1 !important;
    transition: none;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side > nav.nav {
    display: grid !important;
    flex: 1 1 0 !important;
    min-block-size: 0 !important;
    align-content: start !important;
    inline-size: calc(220px * var(--autumn-ui-scale)) !important;
    gap: calc(6px * var(--autumn-ui-scale)) !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: var(--autumn-text-muted) transparent;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side > nav.nav > button {
    display: flex !important;
    align-items: center !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: calc(52px * var(--autumn-ui-scale)) !important;
    min-block-size: calc(52px * var(--autumn-ui-scale)) !important;
    margin: 0 !important;
    padding-inline: calc(17px * var(--autumn-ui-scale)) !important;
    gap: calc(16px * var(--autumn-ui-scale)) !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: calc(8px * var(--autumn-ui-scale)) !important;
    color: var(--autumn-text-muted) !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    font-family: var(--autumn-ui-font-family) !important;
    font-size: var(--autumn-ui-text-sm) !important;
    font-weight: 500 !important;
    text-align: start !important;
    white-space: nowrap;
    transform: none !important;
    transition: color 160ms ease, background-color 160ms ease !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side > nav.nav > button::before {
    flex: 0 0 calc(22px * var(--autumn-ui-scale)) !important;
    inline-size: calc(22px * var(--autumn-ui-scale)) !important;
    block-size: calc(22px * var(--autumn-ui-scale)) !important;
    background-color: currentColor !important;
    background-image: none !important;
    -webkit-mask-image: var(--nav-icon) !important;
    mask-image: var(--nav-icon) !important;
    -webkit-mask-position: center !important;
    mask-position: center !important;
    -webkit-mask-repeat: no-repeat !important;
    mask-repeat: no-repeat !important;
    -webkit-mask-size: contain !important;
    mask-size: contain !important;
    filter: none !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side > nav.nav > button:hover {
    color: var(--autumn-text) !important;
    background: var(--autumn-hover-surface) !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side > nav.nav > button.active {
    color: var(--autumn-accent-primary) !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side > nav.nav > button:focus-visible {
    outline: 2px solid var(--autumn-focus) !important;
    outline-offset: -2px !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side > nav.nav > button.active:focus-visible {
    outline: 0 !important;
    box-shadow: none !important;
  }

  html[dir="rtl"][data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side > nav.nav > button.active {
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side > .dashboard-profile-wrap {
    box-sizing: border-box !important;
    position: absolute !important;
    inset-inline-start: calc(10px * var(--autumn-ui-scale)) !important;
    inset-block-end: calc(14px * var(--autumn-ui-scale)) !important;
    display: grid !important;
    grid-template-rows: calc(76px * var(--autumn-ui-scale)) calc(48px * var(--autumn-ui-scale)) !important;
    inline-size: calc(220px * var(--autumn-ui-scale)) !important;
    min-inline-size: calc(220px * var(--autumn-ui-scale)) !important;
    block-size: auto !important;
    min-block-size: 0 !important;
    gap: calc(6px * var(--autumn-ui-scale)) !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side .dashboard-profile-button,
  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side .dashboard-sidebar-logout {
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    inline-size: calc(220px * var(--autumn-ui-scale)) !important;
    min-inline-size: calc(220px * var(--autumn-ui-scale)) !important;
    min-block-size: calc(48px * var(--autumn-ui-scale)) !important;
    margin: 0 !important;
    padding: calc(5px * var(--autumn-ui-scale)) calc(10px * var(--autumn-ui-scale)) !important;
    gap: calc(12px * var(--autumn-ui-scale)) !important;
    overflow: hidden !important;
    border: 1px solid var(--autumn-border) !important;
    border-radius: calc(8px * var(--autumn-ui-scale)) !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-control-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
    text-align: start !important;
    transform: none !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side #dashboard-profile-initials {
    display: grid !important;
    place-items: center !important;
    flex: 0 0 calc(36px * var(--autumn-ui-scale)) !important;
    inline-size: calc(36px * var(--autumn-ui-scale)) !important;
    block-size: calc(36px * var(--autumn-ui-scale)) !important;
    border-radius: 50% !important;
    color: var(--autumn-accent-on-primary) !important;
    background: var(--autumn-accent-primary) !important;
    font-size: var(--autumn-ui-text-sm) !important;
    font-weight: 700 !important;
    line-height: 1 !important;
  }

  /* The account action is a quiet secondary control in the approved reference.
     Keep its icon and label independent from broad theme button/SVG rules. */
  html[data-autumn-appearance="true"] body #app#app.premium-v1-shell > aside.side > .dashboard-profile-wrap > .dashboard-sidebar-logout {
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    inline-size: calc(220px * var(--autumn-ui-scale)) !important;
    min-inline-size: calc(220px * var(--autumn-ui-scale)) !important;
    block-size: calc(48px * var(--autumn-ui-scale)) !important;
    min-block-size: calc(48px * var(--autumn-ui-scale)) !important;
    margin: 0 !important;
    padding: 0 calc(16px * var(--autumn-ui-scale)) !important;
    gap: calc(12px * var(--autumn-ui-scale)) !important;
    overflow: hidden !important;
    border: 1px solid var(--autumn-border) !important;
    border-radius: calc(8px * var(--autumn-ui-scale)) !important;
    color: var(--autumn-text) !important;
    background-color: var(--autumn-surface-elevated) !important;
    background-image: none !important;
    box-shadow: none !important;
    font-family: var(--autumn-ui-font-family) !important;
    font-size: var(--autumn-ui-text-sm) !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    text-align: start !important;
    white-space: nowrap !important;
    transform: none !important;
  }

  html[data-autumn-appearance="true"] body #app#app.premium-v1-shell > aside.side > .dashboard-profile-wrap > .dashboard-sidebar-logout > svg {
    display: block !important;
    flex: 0 0 calc(18px * var(--autumn-ui-scale)) !important;
    inline-size: calc(18px * var(--autumn-ui-scale)) !important;
    min-inline-size: calc(18px * var(--autumn-ui-scale)) !important;
    max-inline-size: calc(18px * var(--autumn-ui-scale)) !important;
    block-size: calc(18px * var(--autumn-ui-scale)) !important;
    min-block-size: calc(18px * var(--autumn-ui-scale)) !important;
    max-block-size: calc(18px * var(--autumn-ui-scale)) !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    color: currentColor !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
    background: none !important;
    box-shadow: none !important;
    transform: none !important;
  }

  html[data-autumn-appearance="true"] body #app#app.premium-v1-shell > aside.side > .dashboard-profile-wrap > .dashboard-sidebar-logout > svg > * {
    fill: none !important;
    stroke: currentColor !important;
  }

  html[data-autumn-appearance="true"] body #app#app.premium-v1-shell > aside.side > .dashboard-profile-wrap > .dashboard-sidebar-logout > span {
    display: inline !important;
    min-inline-size: 0 !important;
    color: inherit !important;
    font: inherit !important;
    line-height: inherit !important;
    white-space: nowrap !important;
  }

  html[data-autumn-appearance="true"] body #app#app.premium-v1-shell > aside.side > .dashboard-profile-wrap > .dashboard-sidebar-logout:hover {
    border-color: var(--autumn-accent-primary) !important;
    color: var(--autumn-accent-primary) !important;
    background-color: var(--autumn-hover-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
    transform: none !important;
  }

  html[data-autumn-appearance="true"] body #app#app.premium-v1-shell > aside.side > .dashboard-profile-wrap > .dashboard-sidebar-logout:focus-visible {
    outline: 2px solid var(--autumn-focus) !important;
    outline-offset: -2px !important;
  }
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell > main > #view:has(> .autumn-premium-screens) {
  box-sizing: border-box !important;
  inline-size: 100% !important;
  min-inline-size: 0 !important;
  min-block-size: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-canvas) !important;
  background-image: none !important;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell > main:has(.autumn-premium-screens) > #topbar {
  display: none !important;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens,
html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens * {
  box-sizing: border-box;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens {
  min-inline-size: 0;
  min-block-size: 100dvh;
  color: var(--autumn-text);
  background: var(--autumn-canvas);
  font-family: var(--autumn-ui-font-family);
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(390px, 27vw, 430px);
  align-items: stretch;
  min-inline-size: 0;
  min-block-size: 100dvh;
  gap: 0;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table-card {
  min-inline-size: 0 !important;
  min-block-size: 100dvh;
  margin: 0 !important;
  padding: 0 !important;
  overflow: auto !important;
  border: 0 !important;
  border-inline-end: 1px solid var(--autumn-border) !important;
  border-radius: 0 !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-surface-elevated) !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table {
  inline-size: 100% !important;
  min-inline-size: 760px;
  margin: 0 !important;
  border: 0 !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  border-radius: 0 !important;
  table-layout: fixed;
  color: var(--autumn-text) !important;
  background: var(--autumn-surface-elevated) !important;
  box-shadow: none !important;
}

.autumn-premium-screens .screens-table col.pv1-col-select { inline-size: 48px; }
.autumn-premium-screens .screens-table col.pv1-col-screen { inline-size: 34%; }
.autumn-premium-screens .screens-table col.pv1-col-player { inline-size: 16%; }
.autumn-premium-screens .screens-table col.pv1-col-status { inline-size: 20%; }
.autumn-premium-screens .screens-table col.pv1-col-heartbeat { inline-size: 16%; }
.autumn-premium-screens .screens-table col.pv1-col-actions { inline-size: 104px; }

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table th,
html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table td {
  block-size: 76px !important;
  padding: 12px 16px !important;
  border: 0 !important;
  border-block-end: 1px solid var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background: transparent !important;
  font-size: var(--autumn-ui-text-sm) !important;
  line-height: 1.35 !important;
  text-align: start !important;
  vertical-align: middle;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table th {
  block-size: 76px !important;
  color: var(--autumn-text) !important;
  font-size: max(12px, var(--autumn-ui-text-xs)) !important;
  font-weight: 650 !important;
  letter-spacing: .02em;
  text-transform: uppercase;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table th.pv1-col-select,
html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table td.pv1-col-select {
  padding-inline: 14px 4px !important;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table tbody tr {
  position: relative;
  cursor: pointer;
  color: var(--autumn-text);
  background: var(--autumn-surface-elevated);
  transition: background-color 150ms ease;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table tbody tr:hover {
  background: var(--autumn-hover-surface);
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table tbody tr.selected {
  background: var(--autumn-selected-surface);
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table tbody tr > td:first-child {
  border-inline-start: 3px solid transparent !important;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table tbody tr.selected > td:first-child {
  border-inline-start-color: var(--autumn-accent-primary) !important;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table tbody tr:focus-visible {
  outline: var(--autumn-ui-focus-width) solid var(--autumn-focus);
  outline-offset: -3px;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-sort-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  min-block-size: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 6px !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: inherit !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  font: inherit !important;
  text-transform: inherit;
  transform: none !important;
}

/* Keep sortable headings typographic. Broad theme button rules must not turn
   Screen or Runtime Status into rounded controls. */
html[data-autumn-appearance="true"] body #app#app#app#app.premium-v1-shell .autumn-premium-screens .screens-table th > .screens-sort-button {
  min-inline-size: 0 !important;
  min-block-size: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: inherit !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens table.screens-table thead th button.screens-sort-button {
  appearance: none !important;
  inline-size: auto !important;
  min-inline-size: 0 !important;
  max-inline-size: none !important;
  block-size: auto !important;
  min-block-size: 0 !important;
  max-block-size: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: inherit !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  text-shadow: none !important;
  transform: none !important;
}

.autumn-premium-screens .screens-sort-button i {
  color: var(--autumn-text-muted);
  font-style: normal;
}

.autumn-premium-screens .screen-cell {
  display: flex;
  align-items: center;
  min-inline-size: 0;
  gap: 14px;
}

.autumn-premium-screens .screen-cell > span:last-child,
.autumn-premium-screens .runtime-table-player {
  display: grid;
  min-inline-size: 0;
  gap: 4px;
}

.autumn-premium-screens .screen-cell strong,
.autumn-premium-screens .runtime-table-player strong {
  overflow: hidden;
  color: var(--autumn-text) !important;
  font-size: var(--autumn-ui-text-md) !important;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.autumn-premium-screens .screen-cell small,
.autumn-premium-screens .runtime-table-player small,
.autumn-premium-screens .runtime-table-heartbeat {
  overflow: hidden;
  color: var(--autumn-text-muted) !important;
  font-size: max(12px, var(--autumn-ui-text-xs)) !important;
  text-overflow: ellipsis;
}

.autumn-premium-screens .screens-thumbnail {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 58px !important;
  inline-size: 58px !important;
  block-size: 54px !important;
  overflow: hidden !important;
  border: 1px solid var(--autumn-border) !important;
  border-radius: 7px !important;
  color: var(--autumn-text-muted) !important;
  background: var(--autumn-control-surface) !important;
  box-shadow: none !important;
}

.autumn-premium-screens .screens-thumbnail.portrait {
  flex-basis: 42px !important;
  inline-size: 42px !important;
}

.autumn-premium-screens .screens-thumbnail :is(img, video, canvas) {
  inline-size: 100% !important;
  block-size: 100% !important;
  object-fit: cover !important;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screen-status-badge {
  display: inline-flex !important;
  align-items: center !important;
  min-block-size: 28px !important;
  padding-inline: 10px !important;
  gap: 8px !important;
  border: 1px solid currentColor !important;
  border-radius: 999px !important;
  background: var(--autumn-control-surface) !important;
  box-shadow: none !important;
  font-size: max(12px, var(--autumn-ui-text-xs)) !important;
  font-weight: 600 !important;
  white-space: nowrap;
}

.autumn-premium-screens .screen-status-badge > i {
  inline-size: 6px;
  block-size: 6px;
  border-radius: 50%;
  background: currentColor;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screen-status-badge.online {
  border-color: color-mix(in srgb, var(--autumn-success), transparent 70%) !important;
  color: var(--autumn-success) !important;
  background: color-mix(in srgb, var(--autumn-success), transparent 88%) !important;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screen-status-badge.warning {
  border-color: color-mix(in srgb, var(--autumn-warning), transparent 70%) !important;
  color: var(--autumn-warning) !important;
  background: color-mix(in srgb, var(--autumn-warning), transparent 88%) !important;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screen-status-badge.offline {
  border-color: color-mix(in srgb, var(--autumn-danger), transparent 70%) !important;
  color: var(--autumn-danger) !important;
  background: color-mix(in srgb, var(--autumn-danger), transparent 88%) !important;
}

/* Premium V1 uses plain semantic status text: no dots, pills or halos. */
html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app.premium-v1-shell .autumn-premium-screens .screen-status-badge {
  min-block-size: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  line-height: 1.35 !important;
}

html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app.premium-v1-shell .autumn-premium-screens .screen-status-badge > i {
  display: none !important;
}

.autumn-premium-screens .screen-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens :is(.screen-edit-pencil, .screen-row-menu-toggle) {
  display: grid !important;
  place-items: center !important;
  inline-size: 40px !important;
  min-inline-size: 40px !important;
  block-size: 40px !important;
  min-block-size: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--autumn-border) !important;
  border-radius: 8px !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-control-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
  transform: none !important;
}

.autumn-premium-screens :is(.screen-edit-pencil, .screen-row-menu-toggle) svg {
  inline-size: 19px;
  block-size: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
}

.autumn-premium-screens .screen-row-menu { position: relative; }

html[data-autumn-appearance="true"] body #app.premium-v1-shell
.autumn-premium-screens .screen-row-menu > .screen-row-popover {
  display: none !important;
  position: fixed !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell) .screen-row-popover.approved-screen-menu-portal {
  position: fixed !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 2400 !important;
  display: grid !important;
  inline-size: 210px !important;
  min-inline-size: 174px !important;
  max-inline-size: calc(100vw - 24px) !important;
  margin: 0 !important;
  padding: 6px !important;
  gap: 2px !important;
  box-sizing: border-box !important;
  border: 1px solid var(--autumn-border) !important;
  border-radius: 9px !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-surface-elevated) !important;
  background-image: none !important;
  box-shadow: 0 14px 34px var(--autumn-shadow-color) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell) .screen-row-popover.approved-screen-menu-portal button {
  min-block-size: 40px !important;
  padding-inline: 12px !important;
  border: 0 !important;
  border-radius: 7px !important;
  color: var(--autumn-text) !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  text-align: start !important;
  font-family: var(--autumn-ui-font-family) !important;
  transform: none !important;
  filter: none !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell) .screen-row-popover.approved-screen-menu-portal button:hover:not(:disabled) {
  color: var(--autumn-accent-primary-hover) !important;
  background: var(--autumn-hover-surface) !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell) .screen-row-popover.approved-screen-menu-portal button:focus-visible {
  outline: var(--autumn-ui-focus-width) solid var(--autumn-focus) !important;
  outline-offset: -2px !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell) .screen-row-popover.approved-screen-menu-portal button.danger {
  color: var(--autumn-danger) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell) .screen-row-popover.approved-screen-menu-portal button.danger:hover:not(:disabled) {
  color: var(--autumn-danger) !important;
  background: color-mix(in srgb, var(--autumn-danger) 12%, var(--autumn-control-surface)) !important;
}

html[data-autumn-appearance="true"] body:has(#app.shell) .screen-row-popover.approved-screen-menu-portal button::before,
html[data-autumn-appearance="true"] body:has(#app.shell) .screen-row-popover.approved-screen-menu-portal button::after {
  display: none !important;
  content: none !important;
}

.autumn-premium-screens .screens-table-footer {
  display: grid !important;
  grid-template-columns: 1fr auto 1fr;
  align-items: center !important;
  min-block-size: 74px !important;
  margin: 0 !important;
  padding-inline: 24px !important;
  color: var(--autumn-text-muted) !important;
  background: var(--autumn-surface-elevated) !important;
  font-size: max(12px, var(--autumn-ui-text-xs)) !important;
}

.autumn-premium-screens .screens-pagination {
  grid-column: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-pagination button {
  display: grid !important;
  place-items: center !important;
  inline-size: 40px !important;
  min-inline-size: 40px !important;
  block-size: 40px !important;
  min-block-size: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--autumn-border) !important;
  border-radius: 8px !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-control-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-pagination button.current {
  border-color: var(--autumn-accent-primary) !important;
  color: var(--autumn-accent-primary) !important;
}

.autumn-premium-screens .screen-details-panel {
  position: sticky !important;
  inset-block-start: 0 !important;
  align-self: start;
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) auto;
  inline-size: 100% !important;
  min-inline-size: 0 !important;
  min-block-size: 100dvh !important;
  max-block-size: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-inline-start: 1px solid var(--autumn-border) !important;
  border-radius: 0 !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-surface-elevated) !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.autumn-premium-screens .runtime-mirror-dynamic {
  display: flex !important;
  min-block-size: 0;
  flex-direction: column;
  overflow: auto;
  scrollbar-width: thin;
}

.autumn-premium-screens .runtime-mirror-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-block-size: 58px;
  padding-inline: 22px;
  gap: 10px;
  border-block-end: 1px solid var(--autumn-border);
}

.autumn-premium-screens .runtime-mirror-header > span {
  display: inline-flex;
  align-items: center;
  min-inline-size: 0;
  gap: 8px;
  color: var(--autumn-text);
  font-size: max(12px, var(--autumn-ui-text-xs));
  font-weight: 650;
  letter-spacing: .025em;
  text-transform: uppercase;
}

.autumn-premium-screens .runtime-mirror-header > span > i {
  inline-size: 7px;
  block-size: 7px;
  border-radius: 50%;
  background: currentColor;
}

.autumn-premium-screens .runtime-mirror-header > span.online { color: var(--autumn-success); }
.autumn-premium-screens .runtime-mirror-header > span.warning { color: var(--autumn-warning); }
.autumn-premium-screens .runtime-mirror-header > span.offline { color: var(--autumn-danger); }

.autumn-premium-screens .runtime-mirror-header em {
  color: var(--autumn-text-muted);
  font-size: max(12px, var(--autumn-ui-text-xs));
  font-style: normal;
  font-weight: 600;
  white-space: nowrap;
}

html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app.premium-v1-shell .autumn-premium-screens .runtime-mirror-header > span {
  padding: 0 !important;
  gap: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app.premium-v1-shell .autumn-premium-screens .runtime-mirror-header > span > i {
  display: none !important;
}

html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app.premium-v1-shell .autumn-premium-screens .runtime-mirror-header > em {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* The inspector is one continuous sidebar surface. Header, runtime content and
   pairing actions are sections of that surface, not independent cards. */
html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens .screen-details-panel.runtime-mirror-panel {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  gap: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-inline-start: 1px solid var(--autumn-border) !important;
  border-radius: 0 !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-surface-elevated) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens .screen-details-panel.runtime-mirror-panel > .runtime-mirror-dynamic {
  min-inline-size: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens .screen-details-panel.runtime-mirror-panel > .screen-detail-pairing-actions {
  inline-size: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  border-block-start: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

.autumn-premium-screens .runtime-mirror-preview {
  margin: 14px 22px 0;
  overflow: hidden;
  border: 1px solid var(--autumn-border);
  border-radius: 8px;
  background: var(--autumn-control-surface);
}

.autumn-premium-screens .runtime-preview-canvas {
  display: grid;
  place-items: center;
  block-size: 260px;
  padding: 12px;
  overflow: hidden;
  background: var(--autumn-surface);
}

.autumn-premium-screens .runtime-preview-canvas :is(img, video, canvas, iframe),
.autumn-premium-screens .runtime-preview-canvas .screens-thumbnail.large {
  inline-size: 100% !important;
  block-size: 100% !important;
  max-inline-size: 100% !important;
  max-block-size: 100% !important;
  border: 0 !important;
  object-fit: contain !important;
  background: transparent !important;
}

.autumn-premium-screens .runtime-preview-empty {
  display: grid;
  place-items: center;
  gap: 8px;
  color: var(--autumn-text-muted);
  text-align: center;
}

.autumn-premium-screens .runtime-preview-empty svg {
  inline-size: 42px;
  block-size: 42px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.autumn-premium-screens .runtime-preview-empty strong {
  color: var(--autumn-text);
  font-size: var(--autumn-ui-text-sm);
  font-weight: 600;
}

.autumn-premium-screens .runtime-preview-empty small {
  color: var(--autumn-text-muted);
  font-size: max(11px, var(--autumn-ui-text-xs));
}

.autumn-premium-screens .runtime-mirror-preview > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-block-size: 34px;
  padding-inline: 12px;
  border-block-start: 1px solid var(--autumn-border);
  color: var(--autumn-text-muted);
  font-size: max(11px, var(--autumn-ui-text-xs));
}

.autumn-premium-screens .runtime-mirror-facts {
  display: grid;
  margin: 8px 22px 0;
}

.autumn-premium-screens .runtime-mirror-facts > div {
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr);
  align-items: center;
  min-block-size: 40px;
  padding-inline: 16px;
  gap: 10px;
  border-block-end: 1px solid var(--autumn-border);
}

.autumn-premium-screens .runtime-mirror-facts dt {
  color: var(--autumn-text-muted);
  font-size: max(11px, var(--autumn-ui-text-xs));
}

.autumn-premium-screens .runtime-mirror-facts dd {
  overflow: hidden;
  margin: 0;
  color: var(--autumn-text);
  font-size: max(12px, var(--autumn-ui-text-sm));
  font-weight: 600;
  text-align: end;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.autumn-premium-screens [data-technical] {
  direction: ltr;
  unicode-bidi: isolate;
  text-align: end;
}

.autumn-premium-screens .runtime-mirror-facts dd.ready { color: var(--autumn-success); }

.autumn-premium-screens .screen-detail-body {
  margin: 8px 22px 0;
  color: var(--autumn-text);
}

.autumn-premium-screens .runtime-support {
  display: grid;
  margin-block-start: auto;
  padding: 18px 22px;
  gap: 10px;
  border-block-start: 1px solid var(--autumn-border);
}

.autumn-premium-screens .runtime-support h4 {
  margin: 0;
  color: var(--autumn-text);
  font-size: max(12px, var(--autumn-ui-text-xs));
  font-weight: 650;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.autumn-premium-screens .runtime-support-main { display: grid; gap: 6px; }

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .runtime-support button,
html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screen-preview-pairing button {
  min-block-size: 42px !important;
  margin: 0 !important;
  padding-inline: 14px !important;
  border: 1px solid var(--autumn-border) !important;
  border-radius: 8px !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-control-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
  font-family: var(--autumn-ui-font-family) !important;
  font-size: var(--autumn-ui-text-sm) !important;
  font-weight: 600 !important;
  transform: none !important;
}

.autumn-premium-screens .runtime-support .runtime-fix-display { inline-size: 100%; }
.autumn-premium-screens .runtime-support small,
.autumn-premium-screens .runtime-support > p { color: var(--autumn-text-muted); font-size: max(11px, var(--autumn-ui-text-xs)); }
.autumn-premium-screens .runtime-support > p { min-block-size: 16px; margin: 0; }
.autumn-premium-screens .runtime-support-advanced { border-block-start: 1px solid var(--autumn-border); padding-block-start: 10px; }
.autumn-premium-screens .runtime-support-advanced summary { cursor: pointer; color: var(--autumn-text); font-size: var(--autumn-ui-text-sm); font-weight: 600; }
.autumn-premium-screens .runtime-support-advanced > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-block-start: 10px; }

.autumn-premium-screens .screen-detail-actions {
  min-block-size: 0;
  padding: 10px 22px 18px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.autumn-premium-screens .screen-preview-pairing {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screen-preview-pairing button.pair {
  border-color: var(--autumn-accent-primary) !important;
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-accent-primary) !important;
}

/* Runtime controls stay visible and balanced: Fix Display on the first row,
   Diagnostics and Restart as equal secondary actions underneath. */
html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens .runtime-support {
  margin: 0 !important;
  padding: 18px 22px !important;
  gap: 8px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens .runtime-support > h4,
html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens .runtime-support-advanced > summary {
  display: none !important;
}

html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens .runtime-support-advanced {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens .runtime-support-advanced > div {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens .runtime-support-action {
  display: grid !important;
  align-content: start !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: inherit !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens .runtime-support :is(.runtime-fix-display, .runtime-support-action > button) {
  inline-size: 100% !important;
  min-inline-size: 0 !important;
  block-size: 42px !important;
  min-block-size: 42px !important;
  margin: 0 !important;
  padding-inline: 12px !important;
  border: 1px solid var(--autumn-border) !important;
  border-radius: 8px !important;
  color: var(--autumn-text) !important;
  background-color: var(--autumn-control-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
  font-family: var(--autumn-ui-font-family) !important;
  font-size: var(--autumn-ui-text-sm) !important;
  font-weight: 600 !important;
  transform: none !important;
}

html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens .runtime-support-main > small,
html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens .runtime-support-advanced .runtime-support-action > small,
html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens .runtime-support > p:empty {
  display: none !important;
}

html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens .screen-detail-pairing-actions {
  min-block-size: 0 !important;
  padding: 10px 22px 18px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens .screen-detail-pairing-actions .screen-preview-pairing {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

html[data-autumn-appearance="true"] body:has(.autumn-premium-screens) #app#app#app#app#app#app.premium-v1-shell #view#view#view#view#view#view .autumn-premium-screens .screen-detail-pairing-actions .screen-preview-pairing > button {
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body #app .schedule-sidebar-default {
  display: none !important;
}

@media (max-width: 1279px) {
  html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-workspace {
    grid-template-columns: minmax(0, 1fr);
  }

  .autumn-premium-screens .screen-details-panel {
    position: relative !important;
    min-block-size: auto !important;
    max-block-size: none !important;
    border-inline-start: 0 !important;
    border-block-start: 1px solid var(--autumn-border) !important;
  }
}

@media (max-width: 800px) {
  html[data-autumn-appearance="true"] body #app.premium-v1-shell {
    display: block !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side {
    box-sizing: border-box !important;
    position: sticky !important;
    z-index: 100 !important;
    inset: 0 !important;
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr) 44px;
    align-items: center;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 64px !important;
    min-block-size: 64px !important;
    margin: 0 !important;
    padding: 6px 8px !important;
    gap: 8px;
    overflow: hidden !important;
    border: 0 !important;
    border-block-end: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    background: var(--autumn-sidebar-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html body #app.premium-v1-shell > aside.side > .brand {
    display: grid !important;
    place-items: center !important;
    inline-size: 52px !important;
    min-inline-size: 52px !important;
    block-size: 52px !important;
    min-block-size: 52px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body #app.premium-v1-shell > aside.side > .brand > .approved-brand-lockup > img {
    inline-size: 48px !important;
    block-size: 48px !important;
  }

  html body #app.premium-v1-shell > aside.side > .brand > .approved-brand-lockup > span,
  html[data-autumn-appearance="true"] body #app.premium-v1-shell .dashboard-profile-copy,
  html[data-autumn-appearance="true"] body #app.premium-v1-shell .dashboard-sidebar-logout > span {
    display: none !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side > nav.nav {
    display: flex !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    gap: 4px !important;
    overflow-x: auto !important;
    scrollbar-width: none;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side > nav.nav > button {
    flex: 0 0 44px;
    display: grid !important;
    place-items: center !important;
    inline-size: 44px !important;
    min-inline-size: 44px !important;
    block-size: 44px !important;
    min-block-size: 44px !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 7px !important;
    color: transparent !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    font-size: 0 !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side > nav.nav > button::before {
    inline-size: 22px !important;
    block-size: 22px !important;
    margin: 0 !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side > .dashboard-profile-wrap {
    position: static !important;
    display: block !important;
    inline-size: 44px !important;
    min-inline-size: 44px !important;
    block-size: 44px !important;
    min-block-size: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side .dashboard-profile-button {
    display: none !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side .dashboard-sidebar-logout {
    display: grid !important;
    place-items: center !important;
    inline-size: 44px !important;
    min-inline-size: 44px !important;
    block-size: 44px !important;
    min-block-size: 44px !important;
    padding: 0 !important;
    border: 1px solid var(--autumn-border) !important;
    border-radius: 7px !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-control-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell > main {
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    margin: 0 !important;
  }
}

@media (max-width: 767px) {
  html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table-card {
    min-block-size: auto;
    overflow: visible !important;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table {
    display: block !important;
    min-inline-size: 0 !important;
  }

  .autumn-premium-screens .screens-table colgroup,
  .autumn-premium-screens .screens-table thead {
    display: none;
  }

  .autumn-premium-screens .screens-table tbody {
    display: grid;
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table tbody tr {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    grid-template-areas:
      "select screen actions"
      "select player actions"
      "select status heartbeat";
    align-items: center;
    min-inline-size: 0;
    padding: 12px 10px;
    gap: 7px 10px;
    border-block-end: 1px solid var(--autumn-border);
  }

  html[data-autumn-appearance="true"] body #app.premium-v1-shell .autumn-premium-screens .screens-table td {
    display: block;
    block-size: auto !important;
    min-inline-size: 0;
    padding: 0 !important;
    border: 0 !important;
  }

  .autumn-premium-screens .screens-table td.pv1-col-select { grid-area: select; align-self: start; padding-block-start: 16px !important; }
  .autumn-premium-screens .screens-table td.pv1-col-screen { grid-area: screen; }
  .autumn-premium-screens .screens-table td.pv1-col-player { grid-area: player; }
  .autumn-premium-screens .screens-table td.pv1-col-status { grid-area: status; }
  .autumn-premium-screens .screens-table td.pv1-col-heartbeat { grid-area: heartbeat; text-align: end !important; }
  .autumn-premium-screens .screens-table td.pv1-col-actions { grid-area: actions; align-self: start; }

  .autumn-premium-screens .screens-thumbnail {
    flex-basis: 50px !important;
    inline-size: 50px !important;
    block-size: 48px !important;
  }

  .autumn-premium-screens .screen-cell { gap: 10px; }
  .autumn-premium-screens .screen-cell strong { font-size: max(14px, var(--autumn-ui-text-sm)) !important; }

  .autumn-premium-screens .screens-table-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap;
    min-block-size: 82px !important;
    padding: 12px 14px !important;
    gap: 10px 18px;
    text-align: center;
  }

  .autumn-premium-screens .runtime-preview-canvas { block-size: 230px; }
  .autumn-premium-screens .runtime-mirror-facts > div { grid-template-columns: minmax(92px, .8fr) minmax(0, 1.2fr); }
}

@media (prefers-reduced-motion: reduce) {
  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side,
  html[data-autumn-appearance="true"] body #app.premium-v1-shell > aside.side * {
    transition-duration: .01ms !important;
  }
}

/* AUTUMN PREMIUM V1 — SCHEDULES / CALENDAR
   -------------------------------------------------
   Calendar-only visual owner for the approved 3.png reference. The existing
   schedule DOM, drag/drop targets, actions, filters and Daily view stay intact. */
@media (min-width: 851px) {
  html[data-autumn-appearance="true"]:has(body .approved-standalone-schedules) {
    overflow: hidden !important;
    overflow-y: hidden !important;
    scrollbar-gutter: auto !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules) {
    block-size: 100dvh !important;
    min-block-size: 100dvh !important;
    overflow: hidden !important;
    background: var(--autumn-canvas) !important;
    background-image: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell > main > #view#view#view#view.page {
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 100dvh !important;
    min-block-size: 100dvh !important;
    max-block-size: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: var(--autumn-surface-elevated) !important;
    background-image: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-schedules {
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 100dvh !important;
    min-block-size: 100dvh !important;
    max-block-size: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    overflow: hidden !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-surface-elevated) !important;
    background-image: none !important;
    font-family: var(--autumn-ui-font-family) !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .standalone-schedule-workspace {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 384px !important;
    align-items: stretch !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 100dvh !important;
    min-block-size: 100dvh !important;
    max-block-size: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: var(--autumn-surface-elevated) !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .standalone-schedule-workspace > .approved-calendar-card {
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 100dvh !important;
    min-block-size: 100dvh !important;
    max-block-size: 100dvh !important;
    margin: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: var(--autumn-surface-elevated) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-selected-day {
    box-sizing: border-box !important;
    display: grid !important;
    place-content: center !important;
    block-size: 78px !important;
    min-block-size: 78px !important;
    max-block-size: 78px !important;
    margin: 0 !important;
    padding: 10px 24px !important;
    gap: 4px !important;
    border: 0 !important;
    border-block-end: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-surface-elevated) !important;
    background-image: none !important;
    box-shadow: none !important;
    text-align: center !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-selected-day > small {
    margin: 0 !important;
    color: var(--autumn-text-muted) !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-selected-day > strong {
    margin: 0 !important;
    color: var(--autumn-text) !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    letter-spacing: -.015em !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-calendar-card > .approved-week-scroll {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: 72px minmax(0, 1fr) !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: calc(100dvh - 78px) !important;
    min-block-size: 0 !important;
    max-block-size: calc(100dvh - 78px) !important;
    margin: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: var(--autumn-surface-elevated) !important;
    background-image: none !important;
    box-shadow: none !important;
    scrollbar-width: thin !important;
    scrollbar-color: color-mix(in srgb, var(--autumn-text-muted), transparent 32%) transparent !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view :is(.approved-time-axis, .approved-week-canvas) {
    box-sizing: border-box !important;
    block-size: 864px !important;
    min-block-size: 864px !important;
    max-block-size: 864px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-time-axis {
    border: 0 !important;
    border-inline-end: 1px solid var(--autumn-border) !important;
    color: var(--autumn-text-muted) !important;
    background: var(--autumn-surface-elevated) !important;
    background-image: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-time-axis > span {
    inset-inline-end: 14px !important;
    color: var(--autumn-text-muted) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 18px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-week-canvas {
    border: 0 !important;
    background-color: var(--autumn-surface-elevated) !important;
    background-image: repeating-linear-gradient(
      to bottom,
      var(--autumn-border) 0,
      var(--autumn-border) 1px,
      transparent 1px,
      transparent 36px
    ) !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-calendar-empty {
    inset-block-start: 48px !important;
    margin: 0 !important;
    color: var(--autumn-text-muted) !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    text-align: center !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-timeline-bottom-bar {
    display: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .standalone-schedule-workspace > .approved-schedule-side {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: 64px minmax(0, 1fr) 352px !important;
    align-content: stretch !important;
    align-self: stretch !important;
    inline-size: 384px !important;
    min-inline-size: 384px !important;
    max-inline-size: 384px !important;
    block-size: 100dvh !important;
    min-block-size: 100dvh !important;
    max-block-size: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-inline-start: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    background: color-mix(in srgb, var(--autumn-surface) 88%, var(--autumn-surface-elevated)) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-schedule-side > .approved-view-switch.autumn-embedded-view-switch {
    box-sizing: border-box !important;
    grid-row: 1 !important;
    align-self: center !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    inline-size: auto !important;
    min-inline-size: 0 !important;
    max-inline-size: none !important;
    block-size: 40px !important;
    min-block-size: 40px !important;
    max-block-size: 40px !important;
    margin: 12px 14px !important;
    padding: 0 !important;
    gap: 8px !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-view-switch.autumn-embedded-view-switch > button {
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 40px !important;
    min-block-size: 40px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    border: 1px solid var(--autumn-border) !important;
    border-radius: 8px !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-control-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    transform: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-view-switch.autumn-embedded-view-switch > button.active {
    border-color: var(--autumn-accent-primary) !important;
    color: var(--autumn-accent-on-primary) !important;
    background: var(--autumn-interactive-gradient) !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-schedule-side > .approved-content-picker {
    position: relative !important;
    box-sizing: border-box !important;
    grid-row: 2 !important;
    display: grid !important;
    grid-template-columns: 118px minmax(0, 1fr) !important;
    grid-template-rows: auto 42px auto minmax(0, 1fr) !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
    block-size: 100% !important;
    min-block-size: 0 !important;
    max-block-size: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-block: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker > .approved-content-organization {
    box-sizing: border-box !important;
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
    display: grid !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    margin: 0 !important;
    padding: 6px 14px 4px !important;
    gap: 2px !important;
    background: transparent !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker .approved-organizer-field,
  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker .approved-screen-organizer-field {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-rows: 14px 34px !important;
    block-size: 56px !important;
    min-block-size: 56px !important;
    max-block-size: 56px !important;
    margin: 0 !important;
    padding: 3px 0 5px !important;
    gap: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker .approved-organizer-field > span {
    position: static !important;
    inset: auto !important;
    display: block !important;
    inline-size: auto !important;
    min-inline-size: 0 !important;
    block-size: 14px !important;
    min-block-size: 14px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--autumn-text) !important;
    background: transparent !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    line-height: 14px !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    transform: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker .approved-organizer-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    min-inline-size: 0 !important;
    block-size: 34px !important;
    min-block-size: 34px !important;
    gap: 8px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker .approved-organizer-row.single {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker :is(.approved-organizer-select-shell, .approved-organizer-dropdown) {
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 34px !important;
    min-block-size: 34px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker .approved-organizer-dropdown > summary,
  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker .approved-organizer-row > button {
    box-sizing: border-box !important;
    min-inline-size: 0 !important;
    block-size: 34px !important;
    min-block-size: 34px !important;
    max-block-size: 34px !important;
    margin: 0 !important;
    padding: 0 11px !important;
    border: 1px solid var(--autumn-border) !important;
    border-radius: 7px !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-control-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
    font-size: 12px !important;
    font-weight: 650 !important;
    line-height: 32px !important;
    transform: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker .approved-organizer-row > button {
    inline-size: auto !important;
    white-space: nowrap !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker > .approved-content-upload {
    box-sizing: border-box !important;
    grid-column: 1 !important;
    grid-row: 2 !important;
    align-self: center !important;
    justify-self: start !important;
    display: grid !important;
    place-items: center !important;
    inline-size: 88px !important;
    min-inline-size: 88px !important;
    block-size: 32px !important;
    min-block-size: 32px !important;
    max-block-size: 32px !important;
    margin: 5px 0 5px 14px !important;
    padding: 0 !important;
    border: 1px solid var(--autumn-accent-primary) !important;
    border-radius: 7px !important;
    color: var(--autumn-accent-on-primary) !important;
    background: var(--autumn-interactive-gradient) !important;
    box-shadow: none !important;
    font-size: 11px !important;
    font-weight: 750 !important;
    line-height: 1 !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker > .approved-content-upload-status {
    box-sizing: border-box !important;
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    margin: 0 14px !important;
    padding: 0 !important;
    color: var(--autumn-text-muted) !important;
    font-size: 10px !important;
    line-height: 1.3 !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker > .approved-content-upload-status:empty {
    display: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker > .approved-content-management {
    box-sizing: border-box !important;
    grid-column: 2 !important;
    grid-row: 2 !important;
    align-self: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    inline-size: auto !important;
    min-inline-size: 0 !important;
    block-size: 32px !important;
    min-block-size: 32px !important;
    margin: 5px 14px 5px 8px !important;
    padding: 0 !important;
    gap: 10px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-management > label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    color: var(--autumn-text) !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-management > button {
    inline-size: 86px !important;
    min-inline-size: 86px !important;
    block-size: 32px !important;
    min-block-size: 32px !important;
    margin: 0 !important;
    padding: 0 12px !important;
    border: 1px solid color-mix(in srgb, var(--autumn-danger), transparent 55%) !important;
    border-radius: 7px !important;
    color: var(--autumn-danger) !important;
    background: color-mix(in srgb, var(--autumn-danger), transparent 94%) !important;
    background-image: none !important;
    box-shadow: none !important;
    font-size: 11px !important;
    font-weight: 650 !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker > .approved-picker-scroll {
    box-sizing: border-box !important;
    grid-column: 1 / -1 !important;
    grid-row: 4 !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: auto !important;
    min-block-size: 0 !important;
    max-block-size: none !important;
    margin: 0 !important;
    padding: 0 14px 6px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    border: 0 !important;
    border-block-start: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    scrollbar-width: thin !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-picker-scroll > .approved-picker-empty {
    margin: 0 !important;
    padding: 30px 12px !important;
    color: var(--autumn-text-muted) !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    text-align: center !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-picker-scroll > .approved-picker-item.media {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: 18px 48px minmax(0, 1fr) auto !important;
    align-items: center !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 52px !important;
    min-block-size: 52px !important;
    max-block-size: 52px !important;
    margin: 0 !important;
    padding: 3px 4px !important;
    gap: 8px !important;
    overflow: hidden !important;
    border: 0 !important;
    border-block-end: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    transform: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-picker-item.media > img {
    inline-size: 48px !important;
    block-size: 44px !important;
    border: 0 !important;
    border-radius: 4px !important;
    object-fit: cover !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-schedule-side > .approved-mini-calendar {
    box-sizing: border-box !important;
    grid-row: 3 !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
    block-size: 352px !important;
    min-block-size: 352px !important;
    max-block-size: 352px !important;
    margin: 0 !important;
    padding: 10px 14px 12px !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-mini-calendar > header {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr) 38px !important;
    align-items: center !important;
    block-size: 42px !important;
    min-block-size: 42px !important;
    margin: 0 0 4px !important;
    padding: 0 !important;
    gap: 8px !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-mini-calendar > header > button {
    inline-size: 38px !important;
    min-inline-size: 38px !important;
    block-size: 38px !important;
    min-block-size: 38px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid var(--autumn-border) !important;
    border-radius: 8px !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-control-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
    font-size: 20px !important;
    line-height: 1 !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-mini-calendar > header > strong {
    color: var(--autumn-text) !important;
    font-size: 12px !important;
    font-weight: 750 !important;
    line-height: 1.2 !important;
    text-align: center !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view :is(.approved-mini-weekdays, .approved-mini-days) {
    display: grid !important;
    grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    gap: 4px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-mini-weekdays {
    block-size: 24px !important;
    min-block-size: 24px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-mini-weekdays > span {
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    color: var(--autumn-text-muted) !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-mini-days {
    grid-auto-rows: 40px !important;
    block-size: 280px !important;
    min-block-size: 280px !important;
    align-content: start !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-mini-days > button {
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 40px !important;
    min-block-size: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid var(--autumn-border) !important;
    border-radius: 7px !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-control-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
    font-size: 11px !important;
    font-weight: 650 !important;
    line-height: 1 !important;
    transform: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-mini-days > button.outside {
    color: color-mix(in srgb, var(--autumn-text-muted), transparent 36%) !important;
    background: color-mix(in srgb, var(--autumn-control-surface), transparent 34%) !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-mini-days > button:is(.selected, [aria-current="date"]) {
    border-color: var(--autumn-accent-primary) !important;
    color: var(--autumn-accent-primary) !important;
    background: color-mix(in srgb, var(--autumn-accent-primary-soft) 72%, var(--autumn-control-surface)) !important;
    box-shadow: inset 0 0 0 1px var(--autumn-accent-primary) !important;
  }

  /* Outrank the legacy all-buttons/all-cards layer without changing it for
     Daily or any other Admin tab. */
  html[data-autumn-appearance="true"] body:has(#app#app.premium-v1-shell .approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .standalone-schedule-workspace > .approved-calendar-card {
    background: var(--autumn-surface-elevated) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(#app#app.premium-v1-shell .approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-schedule-side button {
    box-shadow: none !important;
    transform: none !important;
  }

  html[data-autumn-appearance="true"] body:has(#app#app.premium-v1-shell .approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-view-switch.autumn-embedded-view-switch > button {
    border-radius: 8px !important;
    background: var(--autumn-control-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(#app#app.premium-v1-shell .approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-view-switch.autumn-embedded-view-switch > button.active {
    border-color: var(--autumn-calendar-accent, #ea5c15) !important;
    color: #ffffff !important;
    background: var(--autumn-calendar-accent, #ea5c15) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(#app#app.premium-v1-shell .approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker .approved-organizer-field > span {
    border: 0 !important;
    border-radius: 0 !important;
    color: var(--autumn-text) !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(#app#app.premium-v1-shell .approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker :is(.approved-organizer-dropdown > summary, .approved-organizer-row > button, .approved-content-delete) {
    border-radius: 7px !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(#app#app.premium-v1-shell .approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker > .approved-content-upload {
    border-color: var(--autumn-calendar-accent, #ea5c15) !important;
    border-radius: 7px !important;
    color: #ffffff !important;
    background: var(--autumn-calendar-accent, #ea5c15) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(#app#app.premium-v1-shell .approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-mini-days > button {
    border-radius: 7px !important;
    background: var(--autumn-control-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(#app#app.premium-v1-shell .approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-mini-days > button.outside {
    border-color: #f1ece8 !important;
    color: #d2cbc7 !important;
    background: #fffdfb !important;
  }

  html[data-autumn-appearance="true"] body:has(#app#app.premium-v1-shell .approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-mini-days > button:is(.selected, [aria-current="date"]) {
    border: 1px solid var(--autumn-calendar-selected, #ef5a24) !important;
    color: var(--autumn-calendar-selected, #ef5a24) !important;
    background: #fffdfb !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  /* Calendar reference colour calibration (3.png).
     Autumn keeps the approved orange baseline while custom identities feed
     their semantic accent through the same Calendar geometry. */
  html[data-autumn-appearance="true"][data-autumn-theme="light"] body:has(.approved-standalone-schedules, .autumn-saas-settings, .settings-advanced-page)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view {
    --calendar-reference-accent: var(--autumn-calendar-accent, #ea5c15);
    --calendar-reference-accent-hover: var(--autumn-calendar-accent-hover, #d94f0f);
    --calendar-reference-selected: var(--autumn-calendar-selected, #ef5a24);
    --calendar-reference-control: #ffffff;
    --calendar-reference-control-soft: #fffdfb;
    --calendar-reference-border: #e1e2e6;
    --calendar-reference-day-border: #eee7e2;
    --calendar-reference-text: #4b3038;
    --calendar-reference-placeholder: #8592a5;
    --calendar-reference-muted: #a69599;
  }

  html[data-autumn-appearance="true"][data-autumn-theme="light"] body:has(.approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-view-switch.autumn-embedded-view-switch > button {
    border-color: var(--calendar-reference-border) !important;
    color: var(--calendar-reference-text) !important;
    background: var(--calendar-reference-control) !important;
    background-image: none !important;
  }

  html[data-autumn-appearance="true"][data-autumn-theme="light"] body:has(.approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-view-switch.autumn-embedded-view-switch > button.active {
    border-color: var(--calendar-reference-accent) !important;
    color: #ffffff !important;
    background: var(--calendar-reference-accent) !important;
    background-image: none !important;
  }

  html[data-autumn-appearance="true"][data-autumn-theme="light"] body:has(.approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-view-switch.autumn-embedded-view-switch > button.active:hover,
  html[data-autumn-appearance="true"][data-autumn-theme="light"] body:has(.approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker > .approved-content-upload:hover {
    border-color: var(--calendar-reference-accent-hover) !important;
    background: var(--calendar-reference-accent-hover) !important;
  }

  html[data-autumn-appearance="true"][data-autumn-theme="light"] body:has(.approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-mini-calendar > header > button {
    border-color: var(--calendar-reference-border) !important;
    color: var(--calendar-reference-text) !important;
    background: var(--calendar-reference-control) !important;
    background-image: none !important;
  }

  html[data-autumn-appearance="true"][data-autumn-theme="light"] body:has(.approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker .approved-organizer-dropdown > summary.approved-organizer-placeholder > span {
    color: var(--calendar-reference-placeholder) !important;
    font-style: italic !important;
    font-weight: 500 !important;
  }

  html[data-autumn-appearance="true"][data-autumn-theme="light"] body:has(.approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker .approved-organizer-dropdown > summary > i {
    border-color: #667895 !important;
  }

  html[data-autumn-appearance="true"][data-autumn-theme="light"] body:has(.approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker .approved-organizer-menu {
    border-color: var(--calendar-reference-border) !important;
    color: var(--calendar-reference-text) !important;
    background: var(--calendar-reference-control) !important;
    background-image: none !important;
  }

  html[data-autumn-appearance="true"][data-autumn-theme="light"] body:has(.approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker .approved-organizer-option > button {
    color: var(--calendar-reference-text) !important;
    background: transparent !important;
    background-image: none !important;
  }

  html[data-autumn-appearance="true"][data-autumn-theme="light"] body:has(.approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker .approved-organizer-option:is(.selected, :hover) > button {
    color: var(--calendar-reference-accent-hover) !important;
    background: color-mix(in srgb, var(--calendar-reference-accent) 9%, var(--calendar-reference-control)) !important;
  }

  html[data-autumn-appearance="true"][data-autumn-theme="light"] body:has(.approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker > .approved-content-upload {
    border-color: var(--calendar-reference-accent) !important;
    color: #ffffff !important;
    background: var(--calendar-reference-accent) !important;
    background-image: none !important;
  }

  html[data-autumn-appearance="true"][data-autumn-theme="light"] body:has(.approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker .approved-content-delete {
    border-color: color-mix(in srgb, var(--autumn-calendar-danger, #ef493f), transparent 55%) !important;
    color: var(--autumn-calendar-danger, #ef493f) !important;
    background: color-mix(in srgb, var(--autumn-calendar-danger, #ef493f), transparent 94%) !important;
    background-image: none !important;
  }

  html[data-autumn-appearance="true"][data-autumn-theme="light"] body:has(.approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-mini-days > button {
    border-color: var(--calendar-reference-day-border) !important;
    color: var(--calendar-reference-text) !important;
    background: var(--calendar-reference-control-soft) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"][data-autumn-theme="light"] body:has(.approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-mini-days > button.outside {
    border-color: #f1ece8 !important;
    color: #d2cbc7 !important;
    background: #fffdfb !important;
  }

  html[data-autumn-appearance="true"][data-autumn-theme="light"] body:has(.approved-standalone-schedules)
  #app#app#app#app#app.premium-v1-shell #view#view#view#view .approved-mini-days > button:is(.selected, [aria-current="date"]) {
    border: 1px solid var(--calendar-reference-selected) !important;
    color: var(--calendar-reference-selected) !important;
    background: var(--calendar-reference-control-soft) !important;
    background-image: none !important;
    box-shadow: none !important;
  }
}

/* AUTUMN PREMIUM V1 — SCHEDULES / DAILY
   -------------------------------------------------
   Daily-only composition for the approved 4.png reference. Calendar owns the
   shared scheduling language; Daily reuses it without changing behavior. */
@media (min-width: 851px) {
  html[data-autumn-appearance="true"]:has(body .approved-standalone-daily) {
    overflow: hidden !important;
    overflow-y: hidden !important;
    scrollbar-gutter: auto !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) {
    block-size: 100dvh !important;
    min-block-size: 100dvh !important;
    overflow: hidden !important;
    background: var(--autumn-canvas) !important;
    background-image: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell > main > #view#view#view#view.page,
  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily {
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 100dvh !important;
    min-block-size: 100dvh !important;
    max-block-size: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-surface-elevated) !important;
    background-image: none !important;
    box-shadow: none !important;
    font-family: var(--autumn-ui-font-family) !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily > :is(.standalone-schedule-hero, .schedule-header, .schedule-tabs) {
    display: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily > .schedule-body {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 384px !important;
    grid-template-rows: minmax(0, 1fr) !important;
    align-items: stretch !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 100dvh !important;
    min-block-size: 100dvh !important;
    max-block-size: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: var(--autumn-surface-elevated) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily > .schedule-body > main {
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 100dvh !important;
    min-block-size: 0 !important;
    max-block-size: 100dvh !important;
    margin: 0 !important;
    overflow: hidden !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-timeline {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: 90px 56px minmax(0, 1fr) !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 100dvh !important;
    min-block-size: 100dvh !important;
    max-block-size: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: var(--autumn-surface-elevated) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-timeline > header {
    box-sizing: border-box !important;
    display: grid !important;
    place-content: center !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 90px !important;
    min-block-size: 90px !important;
    max-block-size: 90px !important;
    margin: 0 !important;
    padding: 12px 24px !important;
    border: 0 !important;
    border-block-end: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-surface-elevated) !important;
    background-image: none !important;
    box-shadow: none !important;
    text-align: center !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-timeline > header > div {
    display: grid !important;
    justify-items: center !important;
    gap: 5px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-timeline > header > select {
    display: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .approved-daily-header-label {
    margin: 0 !important;
    color: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    letter-spacing: .01em !important;
    text-transform: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .approved-daily-title-centered {
    margin: 0 !important;
    color: var(--autumn-text) !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    letter-spacing: -.015em !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .daily-main-selection-bar {
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 56px !important;
    min-block-size: 56px !important;
    max-block-size: 56px !important;
    margin: 0 !important;
    padding: 0 20px !important;
    gap: 16px !important;
    border: 0 !important;
    border-block-end: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-surface-elevated) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .daily-main-selection-bar > label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 9px !important;
    color: var(--autumn-text) !important;
    font-size: 11px !important;
    font-weight: 650 !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily :is(.daily-main-delete, .approved-content-delete) {
    box-sizing: border-box !important;
    inline-size: 86px !important;
    min-inline-size: 86px !important;
    block-size: 34px !important;
    min-block-size: 34px !important;
    margin: 0 !important;
    padding: 0 12px !important;
    border: 1px solid color-mix(in srgb, var(--autumn-calendar-danger, var(--autumn-danger)), transparent 55%) !important;
    border-radius: 7px !important;
    color: var(--autumn-calendar-danger, var(--autumn-danger)) !important;
    background: color-mix(in srgb, var(--autumn-calendar-danger, var(--autumn-danger)), transparent 94%) !important;
    background-image: none !important;
    box-shadow: none !important;
    font-size: 11px !important;
    font-weight: 650 !important;
    transform: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily :is(.fallback-track, .fallback-canvas) {
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 100% !important;
    min-block-size: 0 !important;
    max-block-size: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-surface-elevated) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-track {
    overflow: hidden !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-canvas {
    overflow-y: auto !important;
    scrollbar-width: thin !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-empty {
    display: grid !important;
    place-content: center !important;
    min-block-size: 100% !important;
    padding: 32px 20px !important;
    gap: 8px !important;
    color: var(--autumn-text-muted) !important;
    text-align: center !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-empty > strong {
    color: var(--autumn-text) !important;
    font-size: 24px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    letter-spacing: -.025em !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-empty > span {
    color: var(--autumn-text-muted) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.45 !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily > .schedule-body > .autumn-daily-side-stack {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: 64px minmax(0, 1fr) !important;
    align-content: stretch !important;
    align-self: stretch !important;
    inline-size: 384px !important;
    min-inline-size: 384px !important;
    max-inline-size: 384px !important;
    block-size: 100dvh !important;
    min-block-size: 100dvh !important;
    max-block-size: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-inline-start: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    background: color-mix(in srgb, var(--autumn-surface) 88%, var(--autumn-surface-elevated)) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .autumn-daily-side-stack > .approved-view-switch.autumn-embedded-view-switch {
    box-sizing: border-box !important;
    grid-row: 1 !important;
    align-self: center !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    inline-size: auto !important;
    min-inline-size: 0 !important;
    max-inline-size: none !important;
    block-size: 40px !important;
    min-block-size: 40px !important;
    max-block-size: 40px !important;
    margin: 12px 14px !important;
    padding: 0 !important;
    gap: 8px !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-view-switch.autumn-embedded-view-switch > button {
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 40px !important;
    min-block-size: 40px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    border: 1px solid var(--autumn-border) !important;
    border-radius: 8px !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-control-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    transform: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-view-switch.autumn-embedded-view-switch > button.active {
    border-color: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
    color: #ffffff !important;
    background: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .autumn-daily-side-stack > .schedule-right.approved-daily-content-picker {
    position: relative !important;
    box-sizing: border-box !important;
    grid-row: 2 !important;
    display: grid !important;
    grid-template-columns: 104px minmax(0, 1fr) !important;
    grid-template-rows: auto 42px auto 50px minmax(0, 1fr) !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
    block-size: 100% !important;
    min-block-size: 0 !important;
    max-block-size: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-block-start: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker > .approved-daily-content-organization {
    box-sizing: border-box !important;
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
    display: grid !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    margin: 0 !important;
    padding: 6px 14px 4px !important;
    gap: 2px !important;
    border: 0 !important;
    background: transparent !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker :is(.approved-organizer-field, .approved-screen-organizer-field) {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-rows: 14px 34px !important;
    block-size: 56px !important;
    min-block-size: 56px !important;
    max-block-size: 56px !important;
    margin: 0 !important;
    padding: 3px 0 5px !important;
    gap: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker .approved-organizer-field > span {
    position: static !important;
    inset: auto !important;
    display: block !important;
    block-size: 14px !important;
    min-block-size: 14px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--autumn-text) !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    line-height: 14px !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    transform: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker .approved-organizer-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    min-inline-size: 0 !important;
    block-size: 34px !important;
    min-block-size: 34px !important;
    gap: 8px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker .approved-organizer-row.single {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker :is(.approved-organizer-select-shell, .approved-organizer-dropdown) {
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 34px !important;
    min-block-size: 34px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker :is(.approved-organizer-dropdown > summary, .approved-organizer-row > button) {
    box-sizing: border-box !important;
    min-inline-size: 0 !important;
    block-size: 34px !important;
    min-block-size: 34px !important;
    max-block-size: 34px !important;
    margin: 0 !important;
    padding: 0 11px !important;
    border: 1px solid var(--autumn-border) !important;
    border-radius: 7px !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-control-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
    font-size: 12px !important;
    font-weight: 650 !important;
    line-height: 32px !important;
    transform: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker .approved-organizer-row > button {
    inline-size: auto !important;
    white-space: nowrap !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker > .approved-daily-upload-actions {
    box-sizing: border-box !important;
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    align-self: center !important;
    justify-self: stretch !important;
    display: grid !important;
    grid-template-columns: 104px 104px !important;
    align-items: center !important;
    justify-content: start !important;
    inline-size: auto !important;
    min-inline-size: 0 !important;
    block-size: 32px !important;
    min-block-size: 32px !important;
    margin: 5px 14px !important;
    padding: 0 !important;
    gap: 8px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-upload-actions :is(.upload-default-button, button) {
    box-sizing: border-box !important;
    display: grid !important;
    place-items: center !important;
    inline-size: 104px !important;
    min-inline-size: 104px !important;
    block-size: 32px !important;
    min-block-size: 32px !important;
    max-block-size: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid var(--autumn-border) !important;
    border-radius: 7px !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-control-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
    font-size: 11px !important;
    font-weight: 750 !important;
    line-height: 1 !important;
    transform: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-upload-actions > .upload-default-button {
    border-color: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
    color: #ffffff !important;
    background: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker > .approved-content-upload-status {
    box-sizing: border-box !important;
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    margin: 0 14px !important;
    padding: 0 !important;
    color: var(--autumn-text-muted) !important;
    font-size: 10px !important;
    line-height: 1.3 !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker > .approved-content-upload-status:empty {
    display: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker > .autumn-daily-template-preview {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    justify-self: start !important;
    display: block !important;
    inline-size: 82px !important;
    min-inline-size: 0 !important;
    max-inline-size: calc(100% - 28px) !important;
    block-size: auto !important;
    min-block-size: 0 !important;
    margin: 8px 14px 10px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker > .autumn-daily-template-preview.landscape {
    inline-size: 160px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .autumn-daily-template-preview > .autumn-daily-template-thumb,
  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .autumn-daily-template-preview > .autumn-daily-template-thumb.landscape {
    inline-size: 100% !important;
    block-size: auto !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 6px !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .autumn-daily-template-preview > .autumn-daily-template-copy {
    display: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker > .approved-content-management {
    box-sizing: border-box !important;
    grid-column: 1 / -1 !important;
    grid-row: 4 !important;
    align-self: stretch !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 50px !important;
    min-block-size: 50px !important;
    margin: 0 !important;
    padding: 8px 14px !important;
    gap: 10px !important;
    border: 0 !important;
    border-block: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker > .approved-content-management > label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    color: var(--autumn-text) !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker > .approved-daily-picker-scroll {
    box-sizing: border-box !important;
    grid-column: 1 / -1 !important;
    grid-row: 5 !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: auto !important;
    min-block-size: 0 !important;
    max-block-size: none !important;
    margin: 0 !important;
    padding: 0 14px 6px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    scrollbar-width: thin !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-picker-scroll > .approved-picker-empty {
    margin: 0 !important;
    padding: 30px 12px !important;
    color: var(--autumn-text-muted) !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    text-align: center !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-picker-scroll > .approved-picker-item.media {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: 18px 48px minmax(0, 1fr) auto !important;
    align-items: center !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 52px !important;
    min-block-size: 52px !important;
    max-block-size: 52px !important;
    margin: 0 !important;
    padding: 3px 4px !important;
    gap: 8px !important;
    overflow: hidden !important;
    border: 0 !important;
    border-block-end: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    transform: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-picker-scroll > .approved-picker-item.media > img {
    inline-size: 48px !important;
    block-size: 44px !important;
    border: 0 !important;
    border-radius: 4px !important;
    object-fit: cover !important;
    box-shadow: none !important;
  }
}

@media (max-width: 850px) {
  html[data-autumn-appearance="true"],
  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily) {
    overflow-x: hidden !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell > main > #view#view#view#view.page,
  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily {
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
    min-block-size: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: var(--autumn-surface-elevated) !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily > :is(.standalone-schedule-hero, .schedule-header, .schedule-tabs) {
    display: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily > .schedule-body {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
    block-size: auto !important;
    min-block-size: 0 !important;
    max-block-size: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: var(--autumn-surface-elevated) !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily > .schedule-body > main,
  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-timeline {
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
    block-size: auto !important;
    min-block-size: 540px !important;
    max-block-size: none !important;
    margin: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: var(--autumn-surface-elevated) !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-timeline {
    display: grid !important;
    grid-template-rows: 80px 52px minmax(408px, 1fr) !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-timeline > header {
    box-sizing: border-box !important;
    display: grid !important;
    place-content: center !important;
    block-size: 80px !important;
    min-block-size: 80px !important;
    margin: 0 !important;
    padding: 10px 16px !important;
    border: 0 !important;
    border-block-end: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    background: var(--autumn-surface-elevated) !important;
    box-shadow: none !important;
    text-align: center !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-timeline > header > select {
    display: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .daily-main-selection-bar {
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    block-size: 52px !important;
    min-block-size: 52px !important;
    margin: 0 !important;
    padding: 0 14px !important;
    border: 0 !important;
    border-block-end: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    background: var(--autumn-surface-elevated) !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily :is(.fallback-track, .fallback-canvas) {
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
    block-size: 100% !important;
    min-block-size: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: var(--autumn-surface-elevated) !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-empty {
    display: grid !important;
    place-content: center !important;
    min-block-size: 100% !important;
    padding: 28px 16px !important;
    gap: 7px !important;
    text-align: center !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-empty > strong {
    font-size: 20px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily > .schedule-body > .autumn-daily-side-stack {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: 64px auto !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
    block-size: auto !important;
    min-block-size: 0 !important;
    max-block-size: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-block-start: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    background: color-mix(in srgb, var(--autumn-surface) 88%, var(--autumn-surface-elevated)) !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .autumn-daily-side-stack > .approved-view-switch.autumn-embedded-view-switch {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    block-size: 40px !important;
    min-block-size: 40px !important;
    margin: 12px 14px !important;
    padding: 0 !important;
    gap: 8px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-view-switch.autumn-embedded-view-switch > button {
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 40px !important;
    margin: 0 !important;
    padding: 0 10px !important;
    border: 1px solid var(--autumn-border) !important;
    border-radius: 8px !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-control-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
    font-size: 12px !important;
    font-weight: 700 !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-view-switch.autumn-embedded-view-switch > button.active {
    border-color: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
    color: #ffffff !important;
    background: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .autumn-daily-side-stack > .schedule-right.approved-daily-content-picker {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: 104px minmax(0, 1fr) !important;
    grid-template-rows: auto 42px auto 50px minmax(240px, auto) !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
    block-size: auto !important;
    min-block-size: 0 !important;
    max-block-size: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-block-start: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker > .approved-daily-content-organization {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    margin: 0 !important;
    padding: 6px 14px 4px !important;
    gap: 2px !important;
    border: 0 !important;
    background: transparent !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker > .approved-daily-upload-actions {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    display: grid !important;
    grid-template-columns: 104px 104px !important;
    justify-content: start !important;
    block-size: 32px !important;
    margin: 5px 14px !important;
    gap: 8px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-upload-actions :is(.upload-default-button, button) {
    box-sizing: border-box !important;
    display: grid !important;
    place-items: center !important;
    inline-size: 104px !important;
    min-inline-size: 104px !important;
    block-size: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid var(--autumn-border) !important;
    border-radius: 7px !important;
    color: var(--autumn-text) !important;
    background: var(--autumn-control-surface) !important;
    background-image: none !important;
    box-shadow: none !important;
    font-size: 11px !important;
    font-weight: 750 !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-upload-actions > .upload-default-button {
    border-color: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
    color: #ffffff !important;
    background: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker > .approved-content-management {
    grid-column: 1 / -1 !important;
    grid-row: 4 !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: 50px !important;
    margin: 0 !important;
    padding: 8px 14px !important;
    border: 0 !important;
    border-block: 1px solid var(--autumn-border) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker > .approved-daily-picker-scroll {
    grid-column: 1 / -1 !important;
    grid-row: 5 !important;
    box-sizing: border-box !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
    block-size: auto !important;
    min-block-size: 240px !important;
    max-block-size: 420px !important;
    margin: 0 !important;
    padding: 0 14px 8px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}

@media (max-width: 420px) {
  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .daily-main-selection-bar {
    padding-inline: 12px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-empty > strong {
    font-size: 18px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-standalone-daily .fallback-empty > span {
    font-size: 12px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker > :is(.approved-daily-content-organization, .approved-content-management, .approved-daily-picker-scroll) {
    padding-inline: 10px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-content-picker > .approved-daily-upload-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    inline-size: auto !important;
    margin-inline: 10px !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
  #app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-upload-actions :is(.upload-default-button, button) {
    inline-size: 100% !important;
    min-inline-size: 0 !important;
  }
}

/* Calendar and Daily share one Premium organizer-control language.
   This intentionally replaces the retired per-page blue/orange control rules. */
html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) :is(.approved-organizer-field, .approved-screen-organizer-field) {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) .approved-organizer-field > span {
  position: static !important;
  inset: auto !important;
  display: block !important;
  block-size: 14px !important;
  min-block-size: 14px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--autumn-text) !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  line-height: 14px !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  transform: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker)
:is(.approved-organizer-dropdown > summary, .approved-organizer-row > button) {
  box-sizing: border-box !important;
  block-size: 42px !important;
  min-block-size: 42px !important;
  max-block-size: 42px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  border: 1px solid var(--autumn-border) !important;
  border-radius: 9px !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-control-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
  font-family: var(--autumn-ui-font-family) !important;
  font-size: 12.5px !important;
  font-weight: 650 !important;
  line-height: 40px !important;
  transform: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) .approved-organizer-row > button {
  inline-size: 96px !important;
  min-inline-size: 96px !important;
  max-inline-size: 96px !important;
  white-space: nowrap !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker)
:is(.approved-organizer-dropdown > summary:hover, .approved-organizer-row > button:hover) {
  border-color: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
  color: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
  background: color-mix(in srgb, var(--autumn-control-surface), var(--autumn-calendar-accent, var(--autumn-accent-primary)) 9%) !important;
  background-image: none !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker)
:is(.approved-organizer-dropdown > summary:focus-visible, .approved-organizer-dropdown[open] > summary, .approved-organizer-row > button:focus-visible) {
  border-color: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
  outline: none !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--autumn-calendar-accent, var(--autumn-accent-primary)), transparent 78%) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) .approved-organizer-dropdown > summary.approved-organizer-placeholder > span {
  color: var(--autumn-text-muted) !important;
  font-style: italic !important;
  font-weight: 500 !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) .approved-organizer-dropdown > summary > i {
  border-color: var(--autumn-text-muted) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) .approved-organizer-menu {
  display: block !important;
  inline-size: max(100%, min(340px, calc(100vw - 32px))) !important;
  max-block-size: 280px !important;
  padding: 6px 8px !important;
  gap: 0 !important;
  border-color: var(--autumn-border) !important;
  border-radius: 12px !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-control-surface) !important;
  background-image: none !important;
  box-shadow: 0 14px 34px color-mix(in srgb, var(--autumn-text), transparent 86%) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) .approved-organizer-option {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 34px !important;
  align-items: center !important;
  gap: 6px !important;
  min-block-size: 44px !important;
  padding: 0 4px 0 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  border-block-end: 1px solid color-mix(in srgb, var(--autumn-border), transparent 26%) !important;
  color: var(--autumn-text) !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) .approved-organizer-option + .approved-organizer-option {
  border-block-start: 0 !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) .approved-organizer-option:not(:has(.approved-organizer-remove)) {
  grid-template-columns: minmax(0, 1fr) !important;
  padding-inline-end: 12px !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) .approved-organizer-option:last-child {
  border-block-end: 0 !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) .approved-organizer-option > button:first-child {
  box-sizing: border-box !important;
  inline-size: 100% !important;
  min-inline-size: 0 !important;
  block-size: 42px !important;
  min-block-size: 42px !important;
  max-block-size: 42px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: inherit !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  font-size: 12.5px !important;
  font-weight: 650 !important;
  line-height: 42px !important;
  text-align: start !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) .approved-organizer-remove {
  display: grid !important;
  inline-size: 30px !important;
  min-inline-size: 30px !important;
  block-size: 30px !important;
  min-block-size: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 50% !important;
  color: var(--autumn-text-muted) !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) .approved-organizer-remove > svg {
  inline-size: 12px !important;
  block-size: 12px !important;
  overflow: visible !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.65 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  pointer-events: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) .approved-organizer-remove:is(:hover, :focus-visible) {
  color: var(--autumn-danger) !important;
  background: color-mix(in srgb, var(--autumn-control-surface), var(--autumn-danger) 9%) !important;
  box-shadow: none !important;
  outline: none !important;
  transform: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) .approved-organizer-option:hover {
  border-color: transparent !important;
  background: color-mix(in srgb, var(--autumn-control-surface), var(--autumn-calendar-accent, var(--autumn-accent-primary)) 6%) !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) .approved-organizer-option:is(.selected, [aria-selected="true"]) {
  border-color: transparent !important;
  color: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules, .approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
:is(.approved-content-picker, .approved-daily-content-picker) .approved-organizer-option:is(.selected, [aria-selected="true"]) > button:first-child {
  color: inherit !important;
  background: transparent !important;
  font-weight: 750 !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-upload-actions :is(.upload-default-button, button) {
  block-size: 32px !important;
  min-block-size: 32px !important;
  max-block-size: 32px !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
#app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker > .approved-content-upload,
html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-upload-actions > .upload-default-button {
  box-sizing: border-box !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 32px !important;
  inline-size: 104px !important;
  min-inline-size: 104px !important;
  max-inline-size: 104px !important;
  block-size: 32px !important;
  min-block-size: 32px !important;
  max-block-size: 32px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
  border-radius: 7px !important;
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
  background-image: none !important;
  box-shadow: none !important;
  font-family: var(--autumn-ui-font-family) !important;
  font-size: 11px !important;
  font-weight: 750 !important;
  line-height: 30px !important;
  transform: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
#app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker > .approved-content-upload:hover,
html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view .approved-daily-upload-actions > .upload-default-button:hover {
  border-color: var(--autumn-calendar-accent-hover, var(--autumn-accent-primary-hover)) !important;
  background: var(--autumn-calendar-accent-hover, var(--autumn-accent-primary-hover)) !important;
  background-image: none !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
#app#app#app#app.premium-v1-shell #view#view#view#view .approved-content-picker > .approved-content-upload {
  margin: 5px 0 5px 14px !important;
}

/* Premium V1 — Users & Access
   Canonical owner for the live Users list. Legacy `.approved-users-page`
   skins intentionally do not match this root. */
html[data-autumn-appearance="true"] body:has(.autumn-premium-users) #app.shell > main > .page {
  padding: 0;
}

.autumn-premium-users,
.autumn-premium-users * {
  box-sizing: border-box;
}

.autumn-premium-users {
  min-inline-size: 0;
  min-block-size: 100dvh;
  color: var(--autumn-text);
  background: color-mix(in srgb, var(--autumn-surface-elevated), transparent 4%);
  font-family: var(--autumn-ui-font-family);
}

.autumn-premium-users__workspace {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  min-inline-size: 0;
  min-block-size: 100dvh;
  margin: 0;
  padding: 0;
}

.autumn-users-table {
  min-inline-size: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.autumn-users-table-scroll {
  min-inline-size: 0;
  overflow-x: auto;
  background: transparent;
}

.autumn-users-table table {
  inline-size: 100%;
  min-inline-size: 860px;
  margin: 0;
  border: 0;
  border-spacing: 0;
  border-collapse: separate;
  table-layout: fixed;
  color: inherit;
  background: transparent;
}

.autumn-users-col-name { inline-size: 33%; }
.autumn-users-col-role { inline-size: 22%; }
.autumn-users-col-status { inline-size: 15%; }
.autumn-users-col-login { inline-size: 18%; }
.autumn-users-col-actions { inline-size: 12%; }

.autumn-users-table th,
.autumn-users-table td {
  min-inline-size: 0;
  block-size: 96px;
  padding: 0 32px;
  border: 0;
  border-block-end: 1px solid color-mix(in srgb, var(--autumn-border), transparent 28%);
  color: var(--autumn-text);
  background: transparent;
  text-align: center;
  vertical-align: middle;
}

.autumn-users-table th {
  color: var(--autumn-text);
  font-size: var(--autumn-ui-text-sm);
  font-weight: 650;
  letter-spacing: .005em;
}

.autumn-users-table th button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-inline-size: 0;
  min-block-size: 40px;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 6px;
  color: inherit;
  background: transparent;
  box-shadow: none;
  font: inherit;
  text-align: start;
  cursor: pointer;
}

.autumn-users-table th:first-child {
  text-align: start;
}

.autumn-users-table th:first-child button {
  margin-inline: 0;
}

.autumn-users-table th button:hover {
  color: var(--autumn-accent-primary-hover);
  background: transparent;
}

.autumn-users-table th button:focus-visible,
.approved-user-action-toggle:focus-visible,
.autumn-users-new-button:focus-visible,
.approved-user-action-menu-portal > button:focus-visible {
  outline: var(--autumn-ui-focus-width) solid var(--autumn-focus);
  outline-offset: 2px;
}

.autumn-users-sort {
  color: var(--autumn-accent-primary);
  font-size: 15px;
  line-height: 1;
}

.autumn-users-table th:nth-child(5),
.autumn-user-actions-cell {
  text-align: center;
}

html[dir="rtl"][data-autumn-appearance="true"] body #app .autumn-users-table th:last-child,
html[dir="rtl"][data-autumn-appearance="true"] body #app .autumn-user-actions-cell {
  text-align: center;
}

.autumn-users-table tbody tr {
  color: inherit;
  background: transparent;
  transition: background-color 140ms ease;
  cursor: pointer;
}

.autumn-users-table tbody tr:hover {
  background: color-mix(in srgb, var(--autumn-hover-surface), transparent 68%);
}

.autumn-users-table tbody tr.selected {
  background: var(--autumn-selected-surface);
}

.autumn-users-table tbody tr > td:first-child {
  border-inline-start: 4px solid transparent;
}

.autumn-users-table tbody tr.selected > td:first-child {
  border-inline-start-color: var(--autumn-accent-primary);
}

.autumn-user-identity {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 16px;
  min-inline-size: 0;
}

.autumn-user-identity > span {
  display: grid;
  place-items: center;
  flex: 0 0 48px;
  inline-size: 48px;
  block-size: 48px;
  border-radius: 50%;
  color: var(--autumn-accent-on-primary);
  background: var(--autumn-accent-primary);
  font-size: var(--autumn-ui-text-md);
  font-weight: 700;
  line-height: 1;
  unicode-bidi: isolate;
}

.autumn-user-identity > div {
  min-inline-size: 0;
}

.autumn-user-identity strong,
.autumn-user-identity small {
  display: block;
  min-inline-size: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.autumn-user-identity strong {
  color: var(--autumn-text);
  font-size: 16px;
  font-weight: 650;
  line-height: 1.35;
}

.autumn-user-identity small {
  margin-block-start: 3px;
  color: var(--autumn-text-muted);
  font-size: var(--autumn-ui-text-md);
  font-weight: 400;
  line-height: 1.45;
  direction: ltr;
  unicode-bidi: isolate;
  text-align: start;
}

.autumn-user-role,
.autumn-user-status {
  display: inline-flex;
  align-items: center;
  min-block-size: 30px;
  padding-inline: 0;
  border: 0;
  border-radius: 0;
  color: var(--autumn-accent-primary-hover);
  background: transparent;
  font-size: var(--autumn-ui-text-sm);
  font-weight: 500;
  line-height: 1.25;
  white-space: nowrap;
  margin-inline: auto;
}

.autumn-user-status {
  gap: 8px;
  color: var(--autumn-success);
  background: transparent;
}

.autumn-user-status i {
  flex: 0 0 8px;
  inline-size: 8px;
  block-size: 8px;
  border-radius: 50%;
  background: currentColor;
}

.autumn-user-status.disabled {
  color: var(--autumn-danger);
  background: transparent;
}

.autumn-user-login-cell {
  color: var(--autumn-text-muted);
  font-size: var(--autumn-ui-text-md);
  font-weight: 400;
}

.autumn-user-login-cell [data-technical] {
  display: block;
  inline-size: max-content;
  max-inline-size: 100%;
  margin-inline: auto;
  direction: ltr;
  unicode-bidi: isolate;
  overflow-wrap: anywhere;
  text-align: start;
}

.approved-user-action-menu {
  display: grid;
  place-items: center;
  inline-size: 40px;
  margin-inline: auto;
}

.approved-user-action-source {
  display: none;
}

.approved-user-action-toggle {
  display: inline-grid;
  place-items: center;
  inline-size: 40px;
  min-inline-size: 40px;
  block-size: 40px;
  min-block-size: 40px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 6px;
  color: var(--autumn-accent-primary);
  background: transparent;
  box-shadow: none;
  cursor: pointer;
}

.approved-user-action-toggle:hover {
  color: var(--autumn-accent-primary-hover);
  background: var(--autumn-accent-primary-soft);
}

.approved-user-action-toggle svg,
.autumn-users-new-button svg {
  inline-size: 20px;
  block-size: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.approved-user-action-toggle svg {
  stroke: var(--autumn-text-muted);
}

.approved-user-action-toggle:hover svg {
  stroke: var(--autumn-accent-primary-hover);
}

.autumn-users-new-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: end;
  align-self: center;
  gap: 8px;
  min-inline-size: 172px;
  min-block-size: 54px;
  margin: 24px 32px 42px;
  padding-inline: 24px;
  border: 0;
  border-radius: 8px;
  color: var(--autumn-accent-on-primary);
  background: var(--autumn-accent-primary);
  box-shadow: 0 8px 18px color-mix(in srgb, var(--autumn-accent-primary), transparent 78%);
  font-size: var(--autumn-ui-text-md);
  font-weight: 650;
  line-height: 1;
  cursor: pointer;
}

.autumn-users-new-button:hover {
  background: var(--autumn-accent-primary-hover);
  box-shadow: 0 10px 22px color-mix(in srgb, var(--autumn-accent-primary), transparent 68%);
}

.autumn-users-empty {
  display: grid;
  place-items: center;
  min-block-size: 180px;
  color: var(--autumn-text-muted);
  text-align: center;
}

.approved-user-action-menu-portal {
  position: fixed;
  z-index: 240;
  display: grid;
  gap: 4px;
  inline-size: min(180px, calc(100vw - 24px));
  max-block-size: calc(100dvh - 24px);
  padding: 6px;
  overflow: auto;
  border: 1px solid var(--autumn-border);
  border-radius: 9px;
  color: var(--autumn-text);
  background: var(--autumn-surface-elevated);
  box-shadow: 0 12px 28px color-mix(in srgb, var(--autumn-shadow-color), transparent 42%);
}

.approved-user-action-menu-portal > button {
  display: flex;
  align-items: center;
  gap: 8px;
  inline-size: 100%;
  min-block-size: 40px;
  margin: 0;
  padding-inline: 11px;
  border: 0;
  border-radius: 6px;
  color: var(--autumn-text);
  background: transparent;
  box-shadow: none;
  font-size: var(--autumn-ui-text-sm);
  font-weight: 500;
  text-align: start;
  cursor: pointer;
}

.approved-user-action-menu-portal > button:hover {
  color: var(--autumn-accent-primary-hover);
  background: var(--autumn-accent-primary-soft);
}

.approved-user-action-menu-portal > button:focus-visible {
  outline: 0;
  color: var(--autumn-text);
  background: var(--autumn-accent-primary-soft);
  box-shadow: inset 3px 0 var(--autumn-accent-primary);
}

html[dir="rtl"] .approved-user-action-menu-portal > button:focus-visible {
  box-shadow: inset -3px 0 var(--autumn-accent-primary);
}

.approved-user-action-menu-portal > button.autumn-user-action-danger {
  color: var(--autumn-danger);
  background: transparent;
}

.approved-user-action-menu-portal > button.autumn-user-action-danger:hover {
  background: var(--autumn-danger-soft);
}

.approved-user-action-menu-portal > button svg {
  inline-size: 17px;
  block-size: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@media (max-width: 767px) {
  .autumn-premium-users,
  .autumn-premium-users__workspace {
    min-block-size: 100dvh;
  }

  .autumn-users-table-scroll {
    overflow: visible;
  }

  .autumn-users-table table,
  .autumn-users-table tbody {
    display: block;
    min-inline-size: 0;
    inline-size: 100%;
  }

  .autumn-users-table colgroup {
    display: none;
  }

  .autumn-users-table thead {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    max-inline-size: 1px;
    max-block-size: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    contain: strict;
    white-space: nowrap;
  }

  .autumn-users-table thead tr,
  .autumn-users-table thead th {
    position: absolute;
    inset: 0;
    inline-size: 1px;
    block-size: 1px;
    min-inline-size: 0;
    min-block-size: 0;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
  }

  .autumn-users-table tbody tr {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas:
      "name name"
      "role status"
      "login login";
    gap: 14px 18px;
    min-inline-size: 0;
    padding: 18px 20px;
    border-block-end: 1px solid color-mix(in srgb, var(--autumn-border), transparent 24%);
  }

  .autumn-users-table tbody tr > td {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 5px;
    block-size: auto;
    min-block-size: 44px;
    min-inline-size: 0;
    padding: 0;
    border: 0;
    text-align: start !important;
  }

  .autumn-users-table tbody tr.autumn-users-empty-row > td {
    grid-column: 1 / -1;
  }

  .autumn-users-table tbody tr > td::before {
    content: attr(data-label);
    color: var(--autumn-text-muted);
    font-size: var(--autumn-ui-text-xs);
    font-weight: 600;
    line-height: 1.35;
  }

  .autumn-users-table tbody tr.selected {
    box-shadow: inset 4px 0 var(--autumn-accent-primary);
  }

  html[dir="rtl"] .autumn-users-table tbody tr.selected {
    box-shadow: inset -4px 0 var(--autumn-accent-primary);
  }

  .autumn-users-table tbody tr > td:first-child,
  .autumn-users-table tbody tr.selected > td:first-child {
    border-inline-start: 0;
  }

  .autumn-users-table tbody tr > td.autumn-user-identity-cell {
    grid-area: name;
    padding-inline-end: 56px;
  }

  .autumn-user-identity-cell::before,
  .autumn-user-actions-cell::before {
    display: none;
  }

  .autumn-user-role-cell { grid-area: role; }
  .autumn-user-status-cell { grid-area: status; }
  .autumn-user-login-cell { grid-area: login; }
  .autumn-user-actions-cell {
    position: absolute;
    inset-block-start: 18px;
    inset-inline-end: 20px;
    display: block;
    min-block-size: 40px;
  }

  .autumn-user-role,
  .autumn-user-status {
    justify-self: start;
    max-inline-size: 100%;
    margin-inline: 0;
    white-space: normal;
  }

  .autumn-user-login-cell [data-technical],
  .approved-user-action-menu {
    margin-inline: 0;
  }

  .autumn-users-new-button {
    margin: 20px;
  }
}

@media (max-width: 430px) {
  .autumn-users-table tbody tr {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "name"
      "role"
      "status"
      "login";
    gap: 12px 14px;
    padding: 17px 16px;
  }

  .autumn-users-table tbody tr > td:not(.autumn-user-identity-cell):not(.autumn-user-actions-cell) {
    grid-template-columns: minmax(86px, 96px) minmax(0, 1fr);
    align-items: center;
    gap: 10px;
  }

  .autumn-user-actions-cell {
    inset-block-start: 17px;
    inset-inline-end: 16px;
  }

  .autumn-user-identity {
    justify-content: flex-start;
    gap: 12px;
  }

  .autumn-user-identity > span {
    flex-basis: 44px;
    inline-size: 44px;
    block-size: 44px;
  }

  .autumn-user-identity strong {
    font-size: var(--autumn-ui-text-md);
  }

  .autumn-user-identity small {
    font-size: var(--autumn-ui-text-sm);
  }

  .autumn-users-new-button {
    justify-self: stretch;
    inline-size: auto;
    min-inline-size: 0;
  }
}

/* --------------------------------------------------------------------------
   Schedules — shared Calendar / Daily media chooser

   This portal owns only the new shared chooser and its nested time editor.
   Existing schedule panels, the sidebar, and media rendered by Players remain
   outside this layer.
   -------------------------------------------------------------------------- */
html[data-autumn-appearance="true"] body .autumn-schedule-media-modal {
  position: fixed !important;
  z-index: 2800 !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center !important;
  inline-size: 100vw !important;
  block-size: 100dvh !important;
  margin: 0 !important;
  padding: 12px !important;
  overflow: hidden !important;
  color: var(--autumn-text) !important;
  background: color-mix(in srgb, var(--premium-surface-scrim), transparent 10%) !important;
  font-family: var(--autumn-ui-font-family) !important;
  isolation: isolate !important;
}

html[data-autumn-appearance="true"] body .corrected-clock-modal.asm-clock-overlay {
  z-index: 2920 !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal,
html[data-autumn-appearance="true"] body .autumn-schedule-media-modal *,
html[data-autumn-appearance="true"] body .autumn-schedule-media-modal *::before,
html[data-autumn-appearance="true"] body .autumn-schedule-media-modal *::after {
  box-sizing: border-box;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal > .asm-dialog {
  display: flex !important;
  flex-direction: column !important;
  inline-size: calc(100vw - 24px) !important;
  max-inline-size: calc(100vw - 24px) !important;
  min-inline-size: 0 !important;
  block-size: calc(100dvh - 24px) !important;
  min-block-size: 0 !important;
  max-block-size: calc(100dvh - 24px) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid color-mix(in srgb, var(--autumn-border), transparent 6%) !important;
  border-radius: var(--premium-radius-dialog) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-surface-elevated) !important;
  background-image: none !important;
  box-shadow: 0 28px 72px color-mix(in srgb, var(--autumn-shadow-color), transparent 4%) !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-header {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: var(--premium-space-4) !important;
  flex: 0 0 auto !important;
  min-block-size: 64px !important;
  margin: 0 !important;
  padding: 12px 18px !important;
  border: 0 !important;
  border-block-end: 1px solid var(--autumn-border) !important;
  background: color-mix(in srgb, var(--autumn-surface), var(--autumn-surface-elevated) 48%) !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-header > div {
  min-inline-size: 0 !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-header h2 {
  margin: 0 !important;
  color: var(--autumn-text) !important;
  font-family: var(--autumn-ui-font-family) !important;
  font-size: var(--autumn-ui-text-lg) !important;
  font-weight: 750 !important;
  line-height: 1.3 !important;
  letter-spacing: -.015em !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-header p {
  margin: 3px 0 0 !important;
  color: var(--autumn-text-muted) !important;
  font-size: var(--autumn-ui-text-sm) !important;
  line-height: 1.45 !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal button,
html[data-autumn-appearance="true"] body :is(.approved-standalone-schedules, .approved-standalone-daily) button.asm-open-picker {
  position: static !important;
  isolation: auto !important;
  min-inline-size: 0 !important;
  min-block-size: var(--autumn-ui-control-height) !important;
  margin: 0 !important;
  padding: 0 var(--premium-space-4) !important;
  overflow: visible !important;
  border: 1px solid var(--autumn-border) !important;
  border-radius: var(--premium-radius-control) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-control-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  font: 700 var(--autumn-ui-text-sm)/1.2 var(--autumn-ui-font-family) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  transform: none !important;
  cursor: pointer !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal button::before,
html[data-autumn-appearance="true"] body :is(.approved-standalone-schedules, .approved-standalone-daily) button.asm-open-picker::before {
  display: none !important;
  content: none !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal button:not(:disabled):hover,
html[data-autumn-appearance="true"] body :is(.approved-standalone-schedules, .approved-standalone-daily) button.asm-open-picker:not(:disabled):hover {
  border-color: var(--autumn-accent-primary) !important;
  color: var(--autumn-accent-primary-hover) !important;
  background: var(--autumn-hover-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal button:focus-visible,
html[data-autumn-appearance="true"] body .autumn-schedule-media-modal :is(select, input):focus-visible,
html[data-autumn-appearance="true"] body :is(.approved-standalone-schedules, .approved-standalone-daily) button.asm-open-picker:focus-visible {
  outline: var(--autumn-ui-focus-width) solid color-mix(in srgb, var(--autumn-focus), transparent 24%) !important;
  outline-offset: 2px !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal button:disabled {
  cursor: not-allowed !important;
  opacity: .46 !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal button.asm-close {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 var(--premium-icon-button-size) !important;
  inline-size: var(--premium-icon-button-size) !important;
  block-size: var(--premium-icon-button-size) !important;
  min-block-size: var(--premium-icon-button-size) !important;
  padding: 0 !important;
  border-radius: var(--premium-radius-control) !important;
  color: var(--autumn-text-muted) !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-toolbar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: end !important;
  justify-content: space-between !important;
  gap: var(--premium-space-3) !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 10px 18px !important;
  border: 0 !important;
  border-block-end: 1px solid color-mix(in srgb, var(--autumn-border), transparent 22%) !important;
  background: var(--autumn-surface-elevated) !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-filters {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(150px, 1fr)) !important;
  align-items: end !important;
  gap: var(--premium-space-3) !important;
  flex: 1 1 auto !important;
  min-inline-size: 0 !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-field {
  display: grid !important;
  gap: var(--premium-space-2) !important;
  min-inline-size: 0 !important;
  margin: 0 !important;
  color: var(--autumn-text-muted) !important;
  font-size: var(--autumn-ui-text-xs) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-field select {
  inline-size: 100% !important;
  min-inline-size: 0 !important;
  block-size: var(--premium-control-height) !important;
  min-block-size: var(--premium-control-height) !important;
  margin: 0 !important;
  padding: 0 var(--premium-space-3) !important;
  border: 1px solid var(--autumn-border) !important;
  border-radius: var(--premium-radius-control) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-control-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
  font: 600 var(--autumn-ui-text-sm)/1 var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: var(--premium-space-2) !important;
  flex: 0 0 auto !important;
  min-inline-size: max-content !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal :is(button.asm-primary, .asm-footer button.asm-primary),
html[data-autumn-appearance="true"] body :is(.approved-standalone-schedules, .approved-standalone-daily) button.asm-open-picker {
  border-color: var(--premium-brand-accent) !important;
  color: var(--autumn-accent-on-primary) !important;
  background: var(--premium-brand-accent) !important;
  background-image: none !important;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--premium-brand-accent), transparent 76%) !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal :is(button.asm-primary, .asm-footer button.asm-primary):not(:disabled):hover,
html[data-autumn-appearance="true"] body :is(.approved-standalone-schedules, .approved-standalone-daily) button.asm-open-picker:not(:disabled):hover {
  border-color: var(--premium-brand-accent-hover) !important;
  color: var(--autumn-accent-on-primary) !important;
  background: var(--premium-brand-accent-hover) !important;
  background-image: none !important;
  box-shadow: 0 9px 20px color-mix(in srgb, var(--premium-brand-accent), transparent 70%) !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal button.asm-secondary {
  border-color: var(--autumn-border) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-control-surface) !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-scroll {
  direction: ltr !important;
  flex: 1 1 auto !important;
  min-block-size: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  background: color-mix(in srgb, var(--autumn-surface), var(--autumn-canvas) 20%) !important;
  scrollbar-color: color-mix(in srgb, var(--premium-brand-accent), var(--autumn-border) 55%) transparent !important;
  scrollbar-width: auto !important;
  scrollbar-gutter: stable !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-scroll::-webkit-scrollbar {
  inline-size: 12px !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-scroll::-webkit-scrollbar-track {
  background: transparent !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-scroll::-webkit-scrollbar-thumb {
  border: 3px solid transparent !important;
  border-radius: var(--premium-radius-round) !important;
  background: color-mix(in srgb, var(--premium-brand-accent), var(--autumn-border) 55%) !important;
  background-clip: padding-box !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-grid {
  direction: ltr !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
  align-content: start !important;
  gap: 12px !important;
  inline-size: 100% !important;
  min-inline-size: 0 !important;
  min-block-size: 0 !important;
  margin: 0 !important;
  padding: 14px 18px 20px !important;
  overflow: visible !important;
  background: transparent !important;
}

html[dir="rtl"][data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-grid {
  direction: rtl !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal article.asm-media-card {
  position: relative !important;
  display: grid !important;
  align-content: start !important;
  gap: 7px !important;
  min-inline-size: 0 !important;
  margin: 0 !important;
  padding: 8px !important;
  overflow: visible !important;
  border: 1px solid var(--autumn-border) !important;
  border-radius: var(--premium-radius-control) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-surface-elevated) !important;
  background-image: none !important;
  box-shadow: 0 3px 10px color-mix(in srgb, var(--autumn-shadow-color), transparent 72%) !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal article.asm-media-card[data-selected="true"] {
  border-color: var(--premium-brand-accent) !important;
  background: color-mix(in srgb, var(--premium-brand-accent-soft), var(--autumn-surface-elevated) 64%) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--premium-brand-accent), transparent 80%),
    0 5px 14px color-mix(in srgb, var(--autumn-shadow-color), transparent 66%) !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-media-preview {
  position: relative !important;
  display: block !important;
  inline-size: 100% !important;
  min-inline-size: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal button.asm-media-choice,
html[data-autumn-appearance="true"] body .autumn-schedule-media-modal button.asm-media-choice:hover {
  position: relative !important;
  display: block !important;
  box-sizing: border-box !important;
  flex: none !important;
  grid: none !important;
  gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: clamp(260px, 20vw, 300px) !important;
  min-height: clamp(260px, 20vw, 300px) !important;
  max-height: clamp(260px, 20vw, 300px) !important;
  inline-size: 100% !important;
  min-inline-size: 0 !important;
  max-inline-size: none !important;
  block-size: clamp(260px, 20vw, 300px) !important;
  min-block-size: clamp(260px, 20vw, 300px) !important;
  max-block-size: clamp(260px, 20vw, 300px) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid color-mix(in srgb, var(--autumn-border), transparent 12%) !important;
  border-radius: 7px !important;
  color: var(--autumn-text) !important;
  background: color-mix(in srgb, var(--autumn-surface), var(--autumn-canvas) 18%) !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  line-height: 0 !important;
  text-align: center !important;
  transform: none !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-media-choice > img,
html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-media-choice > .asm-placeholder {
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  max-height: 100% !important;
  inline-size: 100% !important;
  min-inline-size: 100% !important;
  max-inline-size: 100% !important;
  block-size: 100% !important;
  min-block-size: 100% !important;
  max-block-size: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--autumn-text-muted) !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-media-choice > img {
  object-fit: contain !important;
  object-position: center !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-placeholder {
  font-size: var(--autumn-ui-text-xs) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  text-align: center !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-media-name {
  display: block !important;
  inline-size: 100% !important;
  min-inline-size: 0 !important;
  margin: 0 !important;
  padding: 1px 2px 2px !important;
  overflow: visible !important;
  color: var(--autumn-text) !important;
  font-size: var(--autumn-ui-text-sm) !important;
  font-weight: 750 !important;
  line-height: 1.42 !important;
  overflow-wrap: anywhere !important;
  text-align: start !important;
  text-overflow: clip !important;
  white-space: normal !important;
  word-break: break-word !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal input.asm-check {
  position: absolute !important;
  z-index: 2 !important;
  inset-block-start: 12px !important;
  inset-inline-end: 12px !important;
  display: block !important;
  inline-size: 24px !important;
  block-size: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  accent-color: var(--premium-brand-accent) !important;
  box-shadow: 0 4px 10px color-mix(in srgb, var(--autumn-shadow-color), transparent 35%) !important;
  cursor: pointer !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal input.asm-check:focus-visible {
  outline-offset: 3px !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal button.asm-time {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  justify-self: start !important;
  gap: 6px !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  inline-size: auto !important;
  min-inline-size: 0 !important;
  max-inline-size: 100% !important;
  block-size: 30px !important;
  min-block-size: 30px !important;
  max-block-size: 30px !important;
  padding: 0 10px !important;
  border-color: color-mix(in srgb, var(--autumn-border), transparent 8%) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-control-surface) !important;
  box-shadow: none !important;
  font-size: var(--autumn-ui-text-xs) !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-time-value {
  color: inherit !important;
  font-variant-numeric: tabular-nums !important;
  font-weight: 750 !important;
  white-space: nowrap !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-footer {
  direction: ltr !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  flex: 0 0 auto !important;
  min-block-size: 60px !important;
  margin: 0 !important;
  padding: 10px 18px !important;
  border: 0 !important;
  border-block-start: 1px solid var(--autumn-border) !important;
  background: var(--autumn-surface-elevated) !important;
  box-shadow: none !important;
}

html[dir="rtl"][data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-footer > * {
  direction: rtl !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-footer-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex: 0 0 auto !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal button.asm-danger {
  border-color: color-mix(in srgb, var(--autumn-danger), transparent 42%) !important;
  color: var(--autumn-danger) !important;
  background: var(--autumn-danger-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal button.asm-danger:not(:disabled):hover {
  border-color: var(--autumn-danger) !important;
  color: #ffffff !important;
  background: var(--autumn-danger) !important;
  background-image: none !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-summary {
  flex: 1 1 auto !important;
  min-inline-size: 0 !important;
  margin: 0 !important;
  color: var(--autumn-text-muted) !important;
  font-size: var(--autumn-ui-text-sm) !important;
  line-height: 1.4 !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-error,
html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-empty {
  grid-column: 1 / -1 !important;
  display: grid !important;
  place-items: center !important;
  min-block-size: 220px !important;
  margin: 0 !important;
  padding: var(--premium-space-8) !important;
  border: 1px dashed var(--autumn-border) !important;
  border-radius: var(--premium-radius-panel) !important;
  color: var(--autumn-text-muted) !important;
  background: color-mix(in srgb, var(--autumn-control-surface), transparent 10%) !important;
  box-shadow: none !important;
  font-size: var(--autumn-ui-text-sm) !important;
  line-height: 1.55 !important;
  text-align: center !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-error {
  min-block-size: 0 !important;
  margin: 0 !important;
  padding: var(--premium-space-3) var(--premium-space-6) !important;
  border-color: color-mix(in srgb, var(--autumn-danger), transparent 50%) !important;
  color: var(--autumn-danger) !important;
  background: var(--autumn-danger-soft) !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal [hidden] {
  display: none !important;
}

html[data-autumn-appearance="true"] body .corrected-clock-modal.asm-clock-overlay .asm-clock-error {
  display: block !important;
  margin: 8px 0 0 !important;
  padding: 9px 11px !important;
  border: 1px solid color-mix(in srgb, var(--autumn-danger), transparent 46%) !important;
  border-radius: var(--premium-radius-control) !important;
  color: var(--autumn-danger) !important;
  background: var(--autumn-danger-soft) !important;
  font: 650 var(--autumn-ui-text-xs)/1.45 var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body .corrected-clock-modal.asm-clock-overlay .asm-clock-error[hidden] {
  display: none !important;
}

html[data-autumn-appearance="true"] body :is(.approved-standalone-schedules, .approved-standalone-daily) button.asm-open-picker {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: var(--premium-space-2) !important;
  min-block-size: var(--premium-control-height) !important;
  white-space: nowrap !important;
}

/* Calendar keeps only its view switch and mini calendar in the side rail. */
@media (min-width: 851px) {
  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view
  .standalone-schedule-workspace > .approved-schedule-side.asm-calendar-only {
    grid-template-rows: 64px auto !important;
    align-content: start !important;
  }

  html[data-autumn-appearance="true"] body:has(.approved-standalone-schedules)
  #app#app#app#app.premium-v1-shell #view#view#view#view
  .approved-schedule-side.asm-calendar-only > .approved-mini-calendar {
    grid-row: 2 !important;
    align-self: start !important;
    block-size: auto !important;
    min-block-size: 0 !important;
    max-block-size: none !important;
  }
}

/* Daily keeps a compact target summary in the rail; media selection lives in the modal. */
html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
.autumn-daily-side-stack > .schedule-right:has(> .asm-daily-entry) {
  box-sizing: border-box !important;
  display: block !important;
  align-self: start !important;
  block-size: auto !important;
  min-block-size: 0 !important;
  max-block-size: none !important;
  margin: 0 !important;
  padding: var(--premium-space-5) var(--premium-space-4) !important;
  overflow: visible !important;
  border: 0 !important;
  border-block-start: 1px solid var(--autumn-border) !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view .asm-daily-entry {
  display: grid !important;
  gap: var(--premium-space-2) !important;
  inline-size: 100% !important;
  min-inline-size: 0 !important;
  margin: 0 !important;
  padding: var(--premium-space-4) !important;
  border: 1px solid var(--autumn-border) !important;
  border-radius: var(--premium-radius-card) !important;
  color: var(--autumn-text) !important;
  background: var(--autumn-surface-elevated) !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view .asm-daily-entry > :is(strong, .asm-daily-target) {
  min-inline-size: 0 !important;
  overflow: hidden !important;
  color: var(--autumn-text) !important;
  font-size: var(--autumn-ui-text-sm) !important;
  font-weight: 750 !important;
  line-height: 1.35 !important;
  text-overflow: ellipsis !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view .asm-daily-entry > :is(p, small, .asm-daily-caption) {
  margin: 0 !important;
  color: var(--autumn-text-muted) !important;
  font-size: var(--autumn-ui-text-xs) !important;
  line-height: 1.45 !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
.approved-standalone-daily .fallback-timeline > header:has(button.asm-open-picker) {
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  justify-content: stretch !important;
  place-content: initial !important;
  gap: var(--premium-space-4) !important;
  text-align: start !important;
}

html[data-autumn-appearance="true"] body:has(.approved-standalone-daily)
#app#app#app#app.premium-v1-shell #view#view#view#view
.approved-standalone-daily .fallback-timeline > header:has(button.asm-open-picker) > div {
  justify-items: start !important;
  min-inline-size: 0 !important;
}

/* Selected content and the current folder scroll independently. */
html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-workspace {
  direction: ltr !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) clamp(300px, 29vw, 420px) !important;
  flex: 1 1 auto !important;
  min-inline-size: 0 !important;
  min-block-size: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--autumn-surface) !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal :is(.asm-selected-panel, .asm-folder-panel) {
  display: flex !important;
  flex-direction: column !important;
  min-inline-size: 0 !important;
  min-block-size: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--autumn-text) !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[dir="rtl"][data-autumn-appearance="true"] body .autumn-schedule-media-modal :is(.asm-selected-panel, .asm-folder-panel) {
  direction: rtl !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-folder-panel {
  border-left: 1px solid var(--autumn-border) !important;
  background: color-mix(in srgb, var(--autumn-canvas), var(--autumn-surface-elevated) 58%) !important;
  box-shadow: -6px 0 18px color-mix(in srgb, var(--autumn-shadow-color), transparent 82%) !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-panel-header {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: stretch !important;
  gap: 5px !important;
  flex: 0 0 auto !important;
  min-inline-size: 0 !important;
  min-block-size: 86px !important;
  margin: 0 !important;
  padding: 12px 18px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--autumn-border) !important;
  background: color-mix(in srgb, var(--autumn-surface-elevated), transparent 12%) !important;
  box-shadow: none !important;
  text-align: start !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-panel-header :is(h3, strong) {
  margin: 0 !important;
  color: var(--autumn-text) !important;
  font: 750 var(--autumn-ui-text-md)/1.35 var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-panel-header :is(p, small) {
  margin: 0 !important;
  color: var(--autumn-text-muted) !important;
  font: 500 var(--autumn-ui-text-sm)/1.45 var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-folder-scroll {
  background: transparent !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-folder-panel .asm-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  padding: 14px 12px 20px !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-folder-panel button.asm-media-choice,
html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-folder-panel button.asm-media-choice:hover {
  height: clamp(160px, 15vw, 220px) !important;
  min-height: clamp(160px, 15vw, 220px) !important;
  max-height: clamp(160px, 15vw, 220px) !important;
  block-size: clamp(160px, 15vw, 220px) !important;
  min-block-size: clamp(160px, 15vw, 220px) !important;
  max-block-size: clamp(160px, 15vw, 220px) !important;
}

html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-folder-panel .asm-media-name {
  font-size: var(--autumn-ui-text-xs) !important;
}

/* [hidden] must beat the explicit display rules on buttons and empty states. */
html[data-autumn-appearance="true"] body .autumn-schedule-media-modal :is(button.asm-time, .asm-empty, .asm-error)[hidden] {
  display: none !important;
}

@media (max-width: 1000px) {
  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-workspace {
    grid-template-columns: minmax(0, 1fr) 300px !important;
  }

  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-toolbar {
    align-items: stretch !important;
    flex-direction: column !important;
  }

  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-selected-panel .asm-grid {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important;
  }

  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-selected-panel button.asm-media-choice,
  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-selected-panel button.asm-media-choice:hover {
    height: 240px !important;
    min-height: 240px !important;
    max-height: 240px !important;
    block-size: 240px !important;
    min-block-size: 240px !important;
    max-block-size: 240px !important;
  }
}

@media (max-width: 620px) {
  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal {
    padding: 6px !important;
  }

  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal > .asm-dialog {
    inline-size: calc(100vw - 12px) !important;
    max-inline-size: calc(100vw - 12px) !important;
    block-size: calc(100dvh - 12px) !important;
    max-block-size: calc(100dvh - 12px) !important;
  }

  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal :is(.asm-header, .asm-toolbar, .asm-panel-header, .asm-footer) {
    padding-inline: 10px !important;
  }

  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-workspace {
    grid-template-columns: minmax(0, 1fr) minmax(145px, 43%) !important;
  }

  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal :is(.asm-selected-panel, .asm-folder-panel) .asm-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
    padding: 10px 8px 16px !important;
  }

  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-panel-header {
    min-block-size: 90px !important;
  }

  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-panel-header :is(p, small) {
    font-size: var(--autumn-ui-text-xs) !important;
  }

  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-actions {
    min-inline-size: 0 !important;
    flex-wrap: wrap !important;
  }

  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-empty {
    min-block-size: 160px !important;
    padding: 14px 8px !important;
  }

  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-selected-panel button.asm-media-choice,
  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal .asm-selected-panel button.asm-media-choice:hover {
    height: 210px !important;
    min-height: 210px !important;
    max-height: 210px !important;
    block-size: 210px !important;
    min-block-size: 210px !important;
    max-block-size: 210px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-autumn-appearance="true"] body .autumn-schedule-media-modal * {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}

/* AUTUMN SETTINGS — shared page bounds, Calendar controls, screensaver editor. */
html[data-autumn-appearance="true"]:has(body #view > :is(.autumn-saas-settings, .settings-advanced-page)),
html[data-autumn-appearance="true"] body:has(#view > :is(.autumn-saas-settings, .settings-advanced-page)) {
  block-size: 100dvh !important;
  overflow: clip !important;
  scrollbar-gutter: auto !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view:has(> :is(.autumn-saas-settings, .settings-advanced-page)) {
  box-sizing: border-box !important;
  inline-size: 100% !important;
  min-inline-size: 0 !important;
  block-size: 100dvh !important;
  min-block-size: 0 !important;
  max-block-size: 100dvh !important;
  margin: 0 !important;
  padding: var(--autumn-ui-card-padding) !important;
  background: var(--autumn-surface-elevated) !important;
  overflow: clip !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view > :is(.autumn-saas-settings, .settings-advanced-page) {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  gap: var(--autumn-ui-gap) !important;
  inline-size: 100% !important;
  max-inline-size: none !important;
  min-inline-size: 0 !important;
  block-size: 100% !important;
  min-block-size: 0 !important;
  max-block-size: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: clip !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--autumn-surface-elevated) !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view :is(.autumn-saas-settings__heading, .settings-advanced-page > .settings-page-heading) {
  display: none !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view :is(.autumn-saas-settings > [data-autumn-appearance-host], .settings-advanced-page > .settings-advanced-grid) {
  flex: 1 1 0 !important;
  min-inline-size: 0 !important;
  min-block-size: 0 !important;
  margin: 0 !important;
  padding: 0 calc(4px * var(--autumn-ui-scale)) calc(4px * var(--autumn-ui-scale)) 0 !important;
  overflow: clip !important;
  align-content: start !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-advanced-page > .settings-advanced-grid {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  grid-template-rows: none !important;
  grid-auto-rows: max-content !important;
  align-items: start !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .autumn-saas-settings .autumn-appearance-studio {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  block-size: 100% !important;
  min-block-size: 0 !important;
  inline-size: 100% !important;
  max-inline-size: none !important;
  min-inline-size: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: clip !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view :is(.autumn-saas-settings, .settings-advanced-page) > .autumn-saas-settings__tabs {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  flex: 0 0 auto !important;
  gap: calc(8px * var(--autumn-ui-scale)) !important;
  inline-size: min(100%, calc(140px * var(--autumn-ui-scale))) !important;
  block-size: calc(38px * var(--autumn-ui-scale)) !important;
  min-block-size: calc(38px * var(--autumn-ui-scale)) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view :is(.autumn-saas-settings, .settings-advanced-page) :is(.autumn-saas-settings__tabs button, .autumn-appearance-primary, .autumn-appearance-secondary, .autumn-appearance-studio__actions button, .settings-actions button, .settings-screensaver-editor button, .autumn-appearance-segments span) {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: calc(8px * var(--autumn-ui-scale)) !important;
  min-inline-size: 0 !important;
  max-inline-size: 100% !important;
  block-size: calc(38px * var(--autumn-ui-scale)) !important;
  min-block-size: calc(38px * var(--autumn-ui-scale)) !important;
  margin: 0 !important;
  padding: 0 calc(16px * var(--autumn-ui-scale)) !important;
  border: 1px solid var(--calendar-reference-border, var(--autumn-border)) !important;
  border-radius: calc(10px * var(--autumn-ui-scale)) !important;
  color: var(--calendar-reference-text, var(--autumn-text)) !important;
  background: var(--calendar-reference-control, var(--autumn-control-surface)) !important;
  background-image: none !important;
  box-shadow: none !important;
  font: 700 calc(13px * var(--autumn-ui-scale))/calc(13px * var(--autumn-ui-scale)) var(--autumn-ui-font-family) !important;
  text-transform: none !important;
  white-space: nowrap !important;
  transform: none !important;
  filter: none !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view :is(.autumn-saas-settings, .settings-advanced-page) :is(.autumn-saas-settings__tabs button, .autumn-appearance-primary, .autumn-appearance-secondary, .autumn-appearance-studio__actions button, .settings-actions button, .settings-screensaver-editor button, .autumn-appearance-segments span):hover:not(:disabled) {
  border-color: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
  background: var(--autumn-hover-surface) !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view :is(.autumn-saas-settings, .settings-advanced-page) :is(.autumn-saas-settings__tabs button.active, .autumn-saas-settings__tabs button[aria-selected="true"], .autumn-appearance-primary, .settings-save-action, .screensaver-actions button[type="submit"], .autumn-appearance-segments input:checked + span) {
  border-color: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-calendar-accent, var(--autumn-accent-primary)) !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view :is(.autumn-saas-settings, .settings-advanced-page) :is(.autumn-saas-settings__tabs button.active, .autumn-saas-settings__tabs button[aria-selected="true"], .autumn-appearance-primary, .settings-save-action, .screensaver-actions button[type="submit"], .autumn-appearance-segments input:checked + span):hover:not(:disabled) {
  border-color: var(--autumn-calendar-accent-hover, var(--autumn-accent-primary-hover)) !important;
  color: var(--autumn-accent-on-primary) !important;
  background: var(--autumn-calendar-accent-hover, var(--autumn-accent-primary-hover)) !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view :is(.autumn-saas-settings, .settings-advanced-page) :is(button, input, select):focus-visible {
  outline: var(--autumn-ui-focus-width) solid var(--autumn-focus) !important;
  outline-offset: calc(2px * var(--autumn-ui-scale)) !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view :is(.autumn-saas-settings, .settings-advanced-page) button:disabled {
  opacity: .5 !important;
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: none !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view :is(.autumn-saas-settings, .settings-advanced-page) :is(.autumn-saas-settings__tabs button, .autumn-appearance-primary, .autumn-appearance-secondary, .settings-actions button, .settings-screensaver-editor button, .autumn-appearance-segments span)::before,
html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view :is(.autumn-saas-settings, .settings-advanced-page) :is(.autumn-saas-settings__tabs button, .autumn-appearance-primary, .autumn-appearance-secondary, .settings-actions button, .settings-screensaver-editor button, .autumn-appearance-segments span)::after {
  display: none !important;
  content: none !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .autumn-saas-settings__tabs svg {
  flex: 0 0 auto !important;
  inline-size: calc(16px * var(--autumn-ui-scale)) !important;
  block-size: calc(16px * var(--autumn-ui-scale)) !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .autumn-saas-settings__tabs :is(svg, svg *) {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-advanced-page > .settings-actions {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view :is(.settings-advanced-page, .autumn-saas-settings) .settings-screensaver-editor {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-rows: auto auto !important;
  grid-auto-rows: max-content !important;
  grid-column: auto !important;
  grid-row: auto / span 1 !important;
  align-self: start !important;
  height: auto !important;
  min-height: min-content !important;
  max-height: none !important;
  block-size: auto !important;
  min-block-size: min-content !important;
  max-block-size: none !important;
  min-inline-size: 0 !important;
  padding: var(--autumn-ui-gap) 0 0 !important;
  border-block-start: 1px solid var(--autumn-border) !important;
  container: autumn-screensaver / inline-size;
  color: var(--calendar-reference-text, var(--autumn-text)) !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor :is(.screensaver-form, .screensaver-editor-grid, .screensaver-fields) {
  display: grid !important;
  grid-template-rows: none !important;
  grid-auto-rows: max-content !important;
  block-size: auto !important;
  min-block-size: min-content !important;
  max-block-size: none !important;
  min-inline-size: 0 !important;
  gap: var(--autumn-ui-gap) !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-editor-grid {
  grid-template-columns: minmax(0, calc(424px * var(--autumn-ui-scale))) minmax(0, calc(360px * var(--autumn-ui-scale))) !important;
  justify-content: start !important;
  align-items: start !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-fields {
  grid-template-columns: repeat(2, minmax(0, calc(160px * var(--autumn-ui-scale)))) !important;
  justify-content: start !important;
  align-items: start !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor :is(label, .screensaver-image) {
  min-inline-size: 0 !important;
  color: var(--calendar-reference-text, var(--autumn-text)) !important;
  font-size: var(--autumn-ui-text-sm) !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view :is(.settings-screensaver-editor :is(input:not([type="checkbox"]), select), .settings-security-duration input[type="number"]) {
  box-sizing: border-box !important;
  inline-size: var(--autumn-settings-input-width, 100%) !important;
  min-inline-size: 0 !important;
  block-size: calc(38px * var(--autumn-ui-scale)) !important;
  min-block-size: calc(38px * var(--autumn-ui-scale)) !important;
  padding: 0 calc(10px * var(--autumn-ui-scale)) !important;
  border: 1px solid var(--calendar-reference-border, var(--autumn-border)) !important;
  border-radius: calc(10px * var(--autumn-ui-scale)) !important;
  color: var(--calendar-reference-text, var(--autumn-text)) !important;
  background: var(--calendar-reference-control, var(--autumn-control-surface)) !important;
  font: 500 var(--autumn-ui-text-sm)/1.4 var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor input[type="checkbox"] {
  flex: 0 0 auto !important;
  inline-size: calc(18px * var(--autumn-ui-scale)) !important;
  block-size: calc(18px * var(--autumn-ui-scale)) !important;
  min-inline-size: calc(18px * var(--autumn-ui-scale)) !important;
  min-block-size: calc(18px * var(--autumn-ui-scale)) !important;
  margin: 0 !important;
  accent-color: var(--autumn-calendar-accent, var(--autumn-accent-primary));
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-days {
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0, calc(44px * var(--autumn-ui-scale)))) !important;
  justify-content: start !important;
  gap: calc(6px * var(--autumn-ui-scale)) !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-days label {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: calc(8px * var(--autumn-ui-scale)) !important;
  padding: calc(8px * var(--autumn-ui-scale)) calc(2px * var(--autumn-ui-scale)) !important;
  font-size: var(--autumn-ui-text-xs) !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-targets {
  display: grid !important;
  gap: calc(6px * var(--autumn-ui-scale)) !important;
  max-block-size: calc(180px * var(--autumn-ui-scale)) !important;
  block-size: auto !important;
  min-block-size: 0 !important;
  padding: calc(4px * var(--autumn-ui-scale)) !important;
  overflow: auto !important;
  overscroll-behavior: contain;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor :is(.screensaver-target-row, .screensaver-target-actions, .screensaver-upload-row, .screensaver-actions) {
  display: flex !important;
  align-items: center !important;
  gap: calc(10px * var(--autumn-ui-scale)) !important;
  min-inline-size: 0 !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor :is(.screensaver-target-actions, .screensaver-actions) {
  flex-wrap: wrap !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-target-row {
  min-block-size: calc(32px * var(--autumn-ui-scale)) !important;
  overflow-wrap: anywhere;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-upload-row select {
  flex: 1 1 0 !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-upload-row button {
  flex: 0 0 auto !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-image-preview {
  display: grid !important;
  place-items: center !important;
  inline-size: min(100%, var(--screensaver-preview-width, 240px)) !important;
  block-size: auto !important;
  max-block-size: 240px !important;
  aspect-ratio: auto;
  margin-block-start: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-image-preview:has(img) {
  aspect-ratio: var(--screensaver-preview-ratio, 1);
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-image-preview img {
  inline-size: 100% !important;
  block-size: 100% !important;
  min-block-size: 0 !important;
  max-block-size: 100% !important;
  object-fit: contain !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor :is(.screensaver-status, .screensaver-target-actions span) {
  color: var(--autumn-text-muted) !important;
  font-size: var(--autumn-ui-text-sm) !important;
  overflow-wrap: anywhere;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-status[data-error="true"] {
  color: var(--autumn-danger, var(--premium-status-danger)) !important;
  font-weight: 700 !important;
}

@container autumn-settings-layout (max-width: 85em) {
  [data-autumn-settings-extras] {
    grid-template-columns: minmax(0, 1fr);
  }
}

@container autumn-screensaver (max-width: 56em) {
  html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-editor-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (max-width: 480px) {
  html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-fields {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-upload-row {
    flex-wrap: wrap !important;
  }

  html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-upload-row select {
    flex-basis: 100% !important;
  }
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-fields-root {
  min-inline-size: 0 !important;
  block-size: auto !important;
  min-block-size: min-content !important;
  max-block-size: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-fields-root > legend.sr-only {
  position: absolute !important;
  inline-size: 1px !important;
  block-size: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor :is(.screensaver-schedule, .screensaver-fields > label, .screensaver-image > label) {
  display: grid !important;
  gap: var(--autumn-ui-gap) !important;
  min-inline-size: 0 !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor :is(.screensaver-fields > label, .screensaver-image > label) {
  gap: calc(6px * var(--autumn-ui-scale)) !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-enabled {
  display: flex !important;
  align-items: center !important;
  gap: calc(10px * var(--autumn-ui-scale)) !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-days {
  min-inline-size: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-days legend {
  padding: 0 0 calc(6px * var(--autumn-ui-scale)) !important;
  color: var(--calendar-reference-text, var(--autumn-text)) !important;
  font: 700 var(--autumn-ui-text-sm)/1.4 var(--autumn-ui-font-family) !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-hint {
  margin: 0 !important;
  color: var(--autumn-text-muted) !important;
  font-size: var(--autumn-ui-text-xs) !important;
  line-height: 1.5 !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-image {
  display: grid !important;
  inline-size: 100% !important;
  max-inline-size: calc(360px * var(--autumn-ui-scale)) !important;
  align-content: start !important;
  gap: var(--autumn-ui-gap) !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-actions {
  inline-size: min(100%, var(--screensaver-preview-width, 240px)) !important;
  justify-content: flex-end !important;
}

html[data-autumn-appearance="true"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view .settings-screensaver-editor .screensaver-status:empty {
  display: none !important;
}

html[data-autumn-appearance="true"][data-autumn-theme="dark"] body #app#app#app#app#app#app.shell #view#view#view#view#view#view :is(.autumn-appearance-studio, .settings-screensaver-editor input),
html[data-autumn-appearance="true"] body.sf-theme-dark #app#app#app#app#app#app.shell #view#view#view#view#view#view :is(.autumn-appearance-studio, .settings-screensaver-editor input) {
  color-scheme: dark !important;
}

/* END AUTUMN SETTINGS */