/* CamuflaAds motion layer: interface chrome only; authored media is never animated. */
html.platform-motion-enabled {
  --pm-ease: cubic-bezier(.2, .7, .25, 1);
  --pm-fast: 170ms;
  --pm-medium: 260ms;
  --pm-brand-cycle: 7.6s;
  --pm-brand-ease: cubic-bezier(.37, 0, .63, 1);
}

/* A restrained optical camouflage pass, followed by a clear resting phase.
   All geometry stays at native size: no scaling, rotation, blur or bitmap copy. */
.pm-brand-symbol { position: relative; display: inline-flex; flex: none; line-height: 0; font-style: normal; }
.pm-brand-symbol > img { display: block; }
.mobile-brand .pm-brand-symbol { margin-right: 3px; }
.mobile-brand .pm-brand-symbol > img { margin-right: 0; }
.pm-brand-symbol > svg { display: none; position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
@supports selector(:has(*)) {
html.platform-motion-enabled .pm-brand-symbol:has(> img:is([src="/assets/brand-mark.svg"], [src="./assets/brand-mark.svg"]):not(.personalized-logo)) > svg { display: block; }
html.platform-motion-enabled .pm-brand-symbol > img:is([src="/assets/brand-mark.svg"], [src="./assets/brand-mark.svg"]):not(.personalized-logo) {
  opacity: 0;
  animation: pm-brand-ghost var(--pm-brand-cycle) var(--pm-brand-ease) infinite;
}
html.platform-motion-enabled .pm-brand-symbol > svg path {
  stroke-dasharray: 100;
  stroke-dashoffset: 0;
  animation: pm-brand-contour var(--pm-brand-cycle) var(--pm-brand-ease) infinite;
  animation-delay: var(--pm-layer-delay, 0ms);
}
}
html[data-color-mode="light"] .pm-brand-symbol > svg { filter: brightness(.3); }
@supports ((mask-image: linear-gradient(black, black)) or (-webkit-mask-image: linear-gradient(black, black))) {
  html.platform-motion-enabled :is(.brand, .mobile-brand, .brand-lockup) {
    -webkit-mask-image: linear-gradient(112deg, #000 0%, #000 38%, #000b 43%, #0005 46%, #0009 49%, #000 51%, #000b 53%, #000 56%, #000 100%);
    mask-image: linear-gradient(112deg, #000 0%, #000 38%, #000b 43%, #0005 46%, #0009 49%, #000 51%, #000b 53%, #000 56%, #000 100%);
    -webkit-mask-size: 300% 100%;
    mask-size: 300% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: 100% 50%;
    mask-position: 100% 50%;
    mask-mode: alpha;
    animation: pm-brand-reveal var(--pm-brand-cycle) var(--pm-brand-ease) infinite;
  }
}
@keyframes pm-brand-reveal {
  0%, 15% { -webkit-mask-position: 100% 50%; mask-position: 100% 50%; }
  83%, 100% { -webkit-mask-position: 0% 50%; mask-position: 0% 50%; }
}
@keyframes pm-brand-contour {
  0%, 4%, 78%, 100% { stroke-dashoffset: 0; }
  33% { stroke-dashoffset: 100; }
}
@keyframes pm-brand-ghost {
  0%, 6%, 81%, 100% { opacity: 0; }
  33% { opacity: .18; }
}
/* On pause or keyboard focus, show the intact brand instead of a frozen fragment. */
html.platform-motion-enabled.platform-motion-paused :is(.brand, .mobile-brand, .brand-lockup),
html.platform-motion-enabled :is(.brand, .mobile-brand, .brand-lockup):focus-visible {
  animation: none;
  -webkit-mask-image: none;
  mask-image: none;
}
html.platform-motion-enabled :is(.brand, .mobile-brand, .brand-lockup):focus-visible .pm-brand-symbol > :is(img, svg) {
  animation: none;
}
html.platform-motion-enabled.platform-motion-paused .pm-brand-symbol > img:is([src="/assets/brand-mark.svg"], [src="./assets/brand-mark.svg"]):not(.personalized-logo) {
  animation: none;
  opacity: 1;
}
html.platform-motion-enabled.platform-motion-paused .pm-brand-symbol:has(> img:is([src="/assets/brand-mark.svg"], [src="./assets/brand-mark.svg"]):not(.personalized-logo)) > svg { display: none; }
html.platform-motion-enabled.platform-motion-paused .pm-brand-symbol > svg path,
html.platform-motion-enabled :is(.brand, .mobile-brand, .brand-lockup):focus-visible .pm-brand-symbol > svg path {
  animation: none;
  stroke-dashoffset: 0;
}
@media (prefers-reduced-motion: reduce), (forced-colors: active) {
  html.platform-motion-enabled :is(.brand, .mobile-brand, .brand-lockup) {
    animation: none;
    -webkit-mask-image: none;
    mask-image: none;
  }
  html.platform-motion-enabled .pm-brand-symbol > img:is([src="/assets/brand-mark.svg"], [src="./assets/brand-mark.svg"]):not(.personalized-logo) { animation: none; opacity: 1; }
  html.platform-motion-enabled .pm-brand-symbol:has(> img:is([src="/assets/brand-mark.svg"], [src="./assets/brand-mark.svg"]):not(.personalized-logo)) > svg { display: none; }
  html.platform-motion-enabled .pm-brand-symbol > svg path { animation: none; }
}

/* No transforms on editor controls, drag handles or any interactive media area. */
html.platform-motion-enabled :is(button, a.button, .ud-primary-link, .choose-file):where(:not(.ve-surface *, .ve-dialog *, .pg-surface *, .pg-dialog *, #platform-intro *, [draggable])) {
  transition: color var(--pm-fast) ease, background-color var(--pm-fast) ease,
    border-color var(--pm-fast) ease, box-shadow var(--pm-medium) ease,
    opacity var(--pm-fast) ease, transform var(--pm-fast) var(--pm-ease);
}

html.platform-motion-enabled :is(.nav-link, .account-bridge-link, .commerce-nav > a, .sidebar-studio):where(:not(.ve-surface *, .pg-surface *)) {
  transition: color var(--pm-fast) ease, background-color var(--pm-fast) ease,
    box-shadow var(--pm-medium) ease, transform var(--pm-medium) var(--pm-ease);
}
html.platform-motion-enabled :is(.nav-link, .account-bridge-link, .commerce-nav > a, .sidebar-studio):where(:not(.ve-surface *, .pg-surface *)) :is(.icon, .c-icon) {
  transition: opacity var(--pm-fast) ease, transform var(--pm-medium) var(--pm-ease);
}

html.platform-motion-enabled :is(.ud-shortcut, .plan-card, .integration-card, .metric-card, .ud-usage, .aa-stat, .aa-net-card):where(:not(.ve-surface *, .pg-surface *, [draggable])) {
  transition: border-color var(--pm-medium) ease, box-shadow var(--pm-medium) ease,
    background-color var(--pm-medium) ease, transform var(--pm-medium) var(--pm-ease);
}
html.platform-motion-enabled :is(.video-profiles .profile, .media-profiles label, .green-levels label > span):where(:not(.ve-surface *, .pg-surface *)) {
  transition: border-color var(--pm-fast) ease, background-color var(--pm-fast) ease,
    color var(--pm-fast) ease, box-shadow var(--pm-medium) ease;
}
html.platform-motion-enabled :is(.preview-switch button, .section-tabs a, .section-tabs button, [role="tab"]):where(:not(.ve-surface *, .ve-dialog *, .pg-surface *, .pg-dialog *, #platform-intro *)) {
  transition: background-color var(--pm-fast) ease, border-color var(--pm-fast) ease,
    color var(--pm-fast) ease, box-shadow var(--pm-fast) ease;
}
html.platform-motion-enabled :is(.green-switch, .switch):where(:not(.ve-surface *, .pg-surface *)),
html.platform-motion-enabled :is(.green-switch, .switch):where(:not(.ve-surface *, .pg-surface *))::after {
  transition: transform 220ms var(--pm-ease), background-color 220ms ease, border-color 220ms ease;
}
html.platform-motion-enabled :is(.form-field input, .form-field textarea, .form-field select,
  .search-input, .period-select, .video-output-field select, .media-select-label select):where(:not(.ve-surface *, .ve-dialog *, .pg-surface *, .pg-dialog *, #platform-intro *)) {
  transition: border-color var(--pm-fast) ease, background-color var(--pm-fast) ease,
    box-shadow var(--pm-medium) ease;
}
html.platform-motion-enabled :is(.form-field input, .form-field textarea, .form-field select,
  .search-input, .period-select, .video-output-field select, .media-select-label select):where(:not(.ve-surface *, .ve-dialog *, .pg-surface *, .pg-dialog *, #platform-intro *)):focus-visible {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--pd-text, #e8e8e8) 9%, transparent);
}

/* Text controls have their own markup. Feedback never moves the typing area. */
html.platform-motion-enabled #text-workspace :is(.text-card, .text-options, .text-page-note,
  .format-option, .checkbox-label, .text-details summary, .text-area, .text-image-settings select) {
  transition: border-color var(--pm-fast) ease, background-color var(--pm-fast) ease,
    color var(--pm-fast) ease, box-shadow var(--pm-medium) ease;
}
html.platform-motion-enabled #text-workspace :is(.text-area, .text-image-settings select):focus-visible,
html.platform-motion-enabled #text-workspace .format-option:has(input:focus-visible) {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--pd-text, #e8e8e8) 9%, transparent);
}
html.platform-motion-enabled #text-workspace :is(.text-card, .text-options):focus-within {
  border-color: color-mix(in srgb, var(--pd-text, #e8e8e8) 36%, var(--pd-border, #303030));
}
html.platform-motion-enabled #text-workspace .text-details[open] > p,
html.platform-motion-enabled #text-workspace .text-message:not([hidden]),
html.platform-motion-enabled #text-workspace :is(#text-image-options, #text-unicode-options):not([hidden]) {
  animation: pm-text-feedback 200ms ease backwards;
}
@keyframes pm-text-feedback { from { opacity: .35; } to { opacity: 1; } }

@media (hover: hover) and (pointer: fine) {
  html.platform-motion-enabled :is(button, a.button, .ud-primary-link):where(:not(.ve-surface *, .ve-dialog *, .pg-surface *, .pg-dialog *, #platform-intro *, [draggable],
    [role="tab"], .preview-switch *, .section-tabs *, .color-mode-toggle)):not(:disabled, [aria-disabled="true"]):hover {
    transform: translateY(-1px);
  }
  html.platform-motion-enabled :is(.nav-link, .account-bridge-link, .commerce-nav > a, .sidebar-studio):where(:not(.ve-surface *, .pg-surface *)):hover {
    transform: translateX(2px);
  }
  html.platform-motion-enabled :is(.nav-link, .account-bridge-link, .commerce-nav > a, .sidebar-studio):where(:not(.ve-surface *, .pg-surface *)):hover :is(.icon, .c-icon) {
    opacity: 1;
    transform: translateX(1px);
  }
  html.platform-motion-enabled .ud-shortcut:where(:not(.ve-surface *, .pg-surface *)):hover {
    transform: translateY(-3px);
  }
  html.platform-motion-enabled :is(.plan-card, .integration-card, .metric-card, .ud-usage, .aa-stat, .aa-net-card):where(:not(.ve-surface *, .pg-surface *, [draggable])):hover {
    border-color: color-mix(in srgb, var(--pd-text, #e8e8e8) 24%, var(--pd-border, #303030));
    box-shadow: 0 6px 24px #00000010;
  }
  html.platform-motion-enabled :is(.text-link, .auth-toplink, .ud-plan-link):where(:not(.ve-surface *, .pg-surface *)):hover {
    text-decoration-color: currentColor;
  }
  html.platform-motion-enabled #text-workspace :is(.text-card, .text-options, .format-option):hover {
    border-color: color-mix(in srgb, var(--pd-text, #e8e8e8) 24%, var(--pd-border, #303030));
  }
  html.platform-motion-enabled #text-workspace :is(.checkbox-label, .text-details summary):hover {
    color: var(--pd-text, #e8e8e8);
  }
}

html.platform-motion-enabled :is(button, a.button, .ud-primary-link):where(:not(.ve-surface *, .ve-dialog *, .pg-surface *, .pg-dialog *, #platform-intro *, [draggable],
  [role="tab"], .preview-switch *, .section-tabs *)):not(:disabled, [aria-disabled="true"]):active {
  transform: translateY(0) scale(.975);
  transition-duration: 90ms;
}
html.platform-motion-enabled .ud-shortcut:where(:not(.ve-surface *, .pg-surface *)):active {
  transform: translateY(0) scale(.99);
}

/* Editor actions receive color feedback only: geometry and drag targets stay fixed. */
html.platform-motion-enabled :is(.ve-button, .pg-button):not([draggable]) {
  transition: background-color var(--pm-fast) ease, border-color var(--pm-fast) ease,
    color var(--pm-fast) ease, box-shadow var(--pm-fast) ease;
}
html.platform-motion-enabled :is(.ve-button, .pg-button):not([draggable], :disabled, [aria-disabled="true"]):active {
  box-shadow: inset 0 0 0 1px currentColor;
}

/* Animate only generic chrome dialogs; fullscreen project previews are excluded. */
html.platform-motion-enabled :is(.commerce-dialog, .mobile-navigation, #help-dialog, #text-help-dialog, #media-help-dialog)[open] {
  animation: pm-dialog-enter 250ms var(--pm-ease) backwards;
}
html.platform-motion-enabled :is(.commerce-dialog, .mobile-navigation, #help-dialog, #text-help-dialog, #media-help-dialog)[open]::backdrop {
  animation: pm-backdrop-enter 220ms ease backwards;
}
html.platform-motion-enabled .user-menu[open] > .user-menu-popover {
  animation: pm-popover-enter 180ms var(--pm-ease) backwards;
}
html.platform-motion-enabled .toast {
  animation: pm-toast-enter 260ms var(--pm-ease) backwards;
}
@keyframes pm-dialog-enter {
  from { opacity: 0; transform: translateY(8px) scale(.99); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes pm-backdrop-enter { from { opacity: 0; } to { opacity: 1; } }
@keyframes pm-popover-enter {
  from { opacity: 0; transform: translateY(-5px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes pm-toast-enter {
  from { opacity: 0; transform: translateY(7px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Pausing hidden pages and the introductory film avoids competing animations. */
html.platform-motion-enabled.platform-motion-paused :is(
  .brand, .mobile-brand,
  .brand-lockup, .commerce-dialog, .mobile-navigation, #help-dialog, #text-help-dialog, #media-help-dialog,
  .user-menu-popover, .toast) {
  animation-play-state: paused;
}
html.platform-motion-enabled.platform-motion-paused :is(.commerce-dialog, .mobile-navigation, #help-dialog, #text-help-dialog, #media-help-dialog)::backdrop {
  animation-play-state: paused;
}
html.platform-motion-enabled.platform-motion-paused :is(button, a.button, .ud-primary-link, .choose-file,
  .nav-link, .account-bridge-link, .commerce-nav > a, .sidebar-studio,
  .ud-shortcut, .plan-card, .integration-card, .metric-card, .ud-usage, .aa-stat, .aa-net-card,
  .video-profiles .profile, .media-profiles label, .green-levels label > span,
  .section-tabs a, [role="tab"], .green-switch, .switch,
  .form-field input, .form-field textarea, .form-field select, .search-input,
  .period-select, .video-output-field select, .media-select-label select):where(:not(.ve-surface *, .ve-dialog *, .pg-surface *, .pg-dialog *, #platform-intro *)) {
  transition-duration: 0s;
}
html.platform-motion-enabled.platform-motion-paused #text-workspace :is(.text-card, .text-options, .text-page-note,
  .format-option, .checkbox-label, .text-details summary, .text-area, .text-image-settings select) {
  transition-duration: 0s;
}
html.platform-motion-enabled.platform-motion-paused #text-workspace :is(.text-details > p, .text-message, #text-image-options, #text-unicode-options) {
  animation-play-state: paused;
}
html.platform-motion-enabled.platform-motion-paused :is(.ve-button, .pg-button),
html.platform-motion-enabled.platform-motion-paused :is(.green-switch, .switch)::after,
html.platform-motion-enabled.platform-motion-paused :is(.nav-link, .account-bridge-link, .commerce-nav > a, .sidebar-studio) :is(.icon, .c-icon) {
  transition-duration: 0s;
}

@media (prefers-reduced-motion: reduce) {
  html.platform-motion-enabled :is(
    .brand, .mobile-brand,
    .brand-lockup, .commerce-dialog, .mobile-navigation, #help-dialog, #text-help-dialog, #media-help-dialog,
    .user-menu-popover, .toast) { animation: none; }
  html.platform-motion-enabled :is(.commerce-dialog, .mobile-navigation, #help-dialog, #text-help-dialog, #media-help-dialog)::backdrop { animation: none; }
  html.platform-motion-enabled :is(button, a.button, .ud-primary-link, .choose-file,
    .nav-link, .account-bridge-link, .commerce-nav > a, .sidebar-studio,
    .ud-shortcut, .plan-card, .integration-card, .metric-card, .ud-usage, .aa-stat, .aa-net-card,
    .video-profiles .profile, .media-profiles label, .green-levels label > span,
    .section-tabs a, [role="tab"], .green-switch, .switch,
    .form-field input, .form-field textarea, .form-field select, .search-input,
    .period-select, .video-output-field select, .media-select-label select):where(:not(.ve-surface *, .ve-dialog *, .pg-surface *, .pg-dialog *, #platform-intro *)) {
    transition: none;
  }
  html.platform-motion-enabled :is(button, a.button, .ud-primary-link, .ud-shortcut,
    .nav-link, .account-bridge-link, .commerce-nav > a, .sidebar-studio):where(:not(.ve-surface *, .ve-dialog *, .pg-surface *, .pg-dialog *, #platform-intro *)):is(:hover, :active) {
    transform: none;
  }
  html.platform-motion-enabled :is(.nav-link, .account-bridge-link, .commerce-nav > a, .sidebar-studio)
  :is(.icon, .c-icon) { transition: none; transform: none; }
  html.platform-motion-enabled :is(.green-switch, .switch)::after { transition: none; }
  html.platform-motion-enabled :is(.ve-button, .pg-button) { transition: none; }
  html.platform-motion-enabled #text-workspace :is(.text-card, .text-options, .text-page-note,
    .format-option, .checkbox-label, .text-details summary, .text-area, .text-image-settings select) { transition: none; }
  html.platform-motion-enabled #text-workspace :is(.text-details > p, .text-message, #text-image-options, #text-unicode-options) { animation: none; }
}