@trismegisto/core 2.1.1 → 3.0.0

package/dist/core.css

@@ -768,6 +768,9 @@ hm-button:has(> .hm-btn--block),
   color: var(--hm-disabled-text);
   cursor: not-allowed;
 }
+.hm-btn:is(:disabled, [aria-disabled=true]):not(.hm-btn--loading-loading, .hm-btn--loading-success, .hm-btn--loading-error).hm-btn--medium {
+  border-color: var(--hm-disabled-text);
+}
 .hm-btn:is(:disabled, [aria-disabled=true]):not(.hm-btn--loading-loading, .hm-btn--loading-success, .hm-btn--loading-error).hm-btn--minimal {
   border-color: transparent;
   background: transparent;
@@ -846,10 +849,14 @@ hm-button:has(> .hm-btn--block),
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-btn {
+  :where(:root:not([data-motion])) .hm-btn {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-btn {
+  transition: none;
+}
+
 @media (forced-colors: active) {
   .hm-btn {
     border-color: ButtonText;
@@ -958,13 +965,20 @@ hm-button:has(> .hm-btn--block),
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-spinner, .hm-btn__spinner {
+  :where(:root:not([data-motion])) .hm-spinner, :where(:root:not([data-motion])) .hm-btn__spinner {
     animation-duration: 1.4s;
   }
-  .hm-btn__icon--resolved {
+  :where(:root:not([data-motion])) .hm-btn__icon--resolved {
     animation: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-spinner, :where(:root[data-motion=reduce]) .hm-btn__spinner {
+  animation-duration: 1.4s;
+}
+:where(:root[data-motion=reduce]) .hm-btn__icon--resolved {
+  animation: none;
+}
+
 /* Alto contraste: o anel é borda translúcida + topo em currentcolor; o navegador pintaria as quatro
    bordas da mesma cor e o giro ficaria invisível. Trilha em GrayText, arco em CanvasText. */
 @media (forced-colors: active) {
@@ -1107,10 +1121,14 @@ hm-icon-button,
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-icon-btn {
+  :where(:root:not([data-motion])) .hm-icon-btn {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-icon-btn {
+  transition: none;
+}
+
 @media (forced-colors: active) {
   .hm-icon-btn {
     border-color: ButtonText;
@@ -1997,15 +2015,24 @@ hm-alert[hidden] {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-alert {
+  :where(:root:not([data-motion])) .hm-alert {
     transition-duration: 1ms;
   }
   @starting-style {
-    .hm-alert {
+    :where(:root:not([data-motion])) .hm-alert {
       transform: none;
     }
   }
 }
+:where(:root[data-motion=reduce]) .hm-alert {
+  transition-duration: 1ms;
+}
+@starting-style {
+  :where(:root[data-motion=reduce]) .hm-alert {
+    transform: none;
+  }
+}
+
 /* ── Faixa paginada ──────────────────────────────────────────────────────────────────────────── */
 .hm-alert-group {
   --hm-alert-tone: var(--hm-info);
@@ -2382,13 +2409,20 @@ hm-theme-picker {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-theme-picker__option {
+  :where(:root:not([data-motion])) .hm-theme-picker__option {
     transition: none;
   }
-  .hm-theme-picker__option:hover {
+  :where(:root:not([data-motion])) .hm-theme-picker__option:hover {
     translate: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-theme-picker__option {
+  transition: none;
+}
+:where(:root[data-motion=reduce]) .hm-theme-picker__option:hover {
+  translate: none;
+}
+
 @media (forced-colors: active) {
   .hm-theme-picker__option {
     border-color: ButtonBorder;
@@ -2479,10 +2513,14 @@ hm-geometric-texture,
 }
 
 @media (prefers-reduced-motion: no-preference) {
-  .hm-texture {
+  :where(:root:not([data-motion])) .hm-texture {
     animation: hm-texture-cycle var(--texture-cycle) var(--hm-ease-standard) infinite both;
   }
 }
+:where(:root[data-motion=full]) .hm-texture {
+  animation: hm-texture-cycle var(--texture-cycle) var(--hm-ease-standard) infinite both;
+}
+
 @keyframes hm-texture-cycle {
   0% {
     opacity: 0;
@@ -2550,10 +2588,14 @@ hm-loading-square, .hm-loading-square-host {
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-square-loader {
+  :where(:root:not([data-motion])) .hm-square-loader {
     animation-duration: 2s;
   }
 }
+:where(:root[data-motion=reduce]) .hm-square-loader {
+  animation-duration: 2s;
+}
+
 /* Alto contraste: os quatro quadrados são desenhados só com `box-shadow`, que o navegador remove —
    o carregador sumiria inteiro. `forced-color-adjust: none` é justificado aqui: não há outro jeito
    de manter as sombras; as cores passam a ser de sistema (CanvasText = quadrado aceso, GrayText =
@@ -2683,11 +2725,15 @@ hm-skeleton,
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-skeleton__line {
+  :where(:root:not([data-motion])) .hm-skeleton__line {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-skeleton__line {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-skeleton__line {
     forced-color-adjust: none;
@@ -2713,11 +2759,15 @@ hm-skeleton,
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-skeleton__icon {
+  :where(:root:not([data-motion])) .hm-skeleton__icon {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-skeleton__icon {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-skeleton__icon {
     forced-color-adjust: none;
@@ -2745,11 +2795,15 @@ hm-skeleton,
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-skeleton__badge {
+  :where(:root:not([data-motion])) .hm-skeleton__badge {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-skeleton__badge {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-skeleton__badge {
     forced-color-adjust: none;
@@ -2777,11 +2831,15 @@ hm-skeleton,
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-skeleton__chip {
+  :where(:root:not([data-motion])) .hm-skeleton__chip {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-skeleton__chip {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-skeleton__chip {
     forced-color-adjust: none;
@@ -2809,11 +2867,15 @@ hm-skeleton,
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-skeleton__row {
+  :where(:root:not([data-motion])) .hm-skeleton__row {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-skeleton__row {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-skeleton__row {
     forced-color-adjust: none;
@@ -2840,11 +2902,15 @@ hm-skeleton,
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-skeleton__heading {
+  :where(:root:not([data-motion])) .hm-skeleton__heading {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-skeleton__heading {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-skeleton__heading {
     forced-color-adjust: none;
@@ -2871,11 +2937,15 @@ hm-skeleton,
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-skeleton__panel {
+  :where(:root:not([data-motion])) .hm-skeleton__panel {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-skeleton__panel {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-skeleton__panel {
     forced-color-adjust: none;
@@ -2953,11 +3023,15 @@ hm-account-avatar, .hm-account-avatar-host {
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-avatar__skeleton {
+  :where(:root:not([data-motion])) .hm-avatar__skeleton {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-avatar__skeleton {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-avatar__skeleton {
     forced-color-adjust: none;
@@ -3194,10 +3268,13 @@ hm-bubble {
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-bubble__reaction {
+  :where(:root:not([data-motion])) .hm-bubble__reaction {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-bubble__reaction {
+  transition: none;
+}
 .hm-bubble__count {
   font-variant-numeric: tabular-nums;
 }
@@ -3222,10 +3299,13 @@ hm-bubble {
   animation-delay: calc(var(--hm-duration-quick) * 2);
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-bubble__typing > span {
+  :where(:root:not([data-motion])) .hm-bubble__typing > span {
     animation: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-bubble__typing > span {
+  animation: none;
+}
 
 @keyframes hm-bubble-typing {
   0%, 60%, 100% {
@@ -3391,10 +3471,13 @@ hm-message-scroller {
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-message-scroller__jump {
+  :where(:root:not([data-motion])) .hm-message-scroller__jump {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-message-scroller__jump {
+  transition: none;
+}
 .hm-message-scroller__count {
   font-variant-numeric: tabular-nums;
   white-space: nowrap;
@@ -3591,14 +3674,22 @@ hm-header {
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-header__search {
+  :where(:root:not([data-motion])) .hm-header__search {
     animation: none;
   }
-  .hm-header__nav-toggle,
-  .hm-header__search {
+  :where(:root:not([data-motion])) .hm-header__nav-toggle,
+  :where(:root:not([data-motion])) .hm-header__search {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-header__search {
+  animation: none;
+}
+:where(:root[data-motion=reduce]) .hm-header__nav-toggle,
+:where(:root[data-motion=reduce]) .hm-header__search {
+  transition: none;
+}
+
 @media (forced-colors: active) {
   .hm-header__nav-toggle,
   .hm-header__search {
@@ -4042,24 +4133,42 @@ hm-sidebar-group,
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-sidebar,
-  .hm-sidebar.hm-sidebar--overlaid,
-  .hm-sidebar.hm-sidebar--open,
-  .hm-sidebar-group__panel,
-  .hm-sidebar-group__body,
-  .hm-sidebar-group__chevron {
+  :where(:root:not([data-motion])) .hm-sidebar,
+  :where(:root:not([data-motion])) .hm-sidebar.hm-sidebar--overlaid,
+  :where(:root:not([data-motion])) .hm-sidebar.hm-sidebar--open,
+  :where(:root:not([data-motion])) .hm-sidebar-group__panel,
+  :where(:root:not([data-motion])) .hm-sidebar-group__body,
+  :where(:root:not([data-motion])) .hm-sidebar-group__chevron {
     transition-duration: 0s;
     transition-delay: 0s;
   }
-  .hm-sidebar__level--enter {
+  :where(:root:not([data-motion])) .hm-sidebar__level--enter {
     animation: none;
   }
-  .hm-sidebar:not(.hm-sidebar--compact) .hm-sidebar__fade,
-  .hm-sidebar:not(.hm-sidebar--compact) .hm-sidebar-link__text,
-  .hm-sidebar:not(.hm-sidebar--compact) .hm-sidebar-group__label {
+  :where(:root:not([data-motion])) .hm-sidebar:not(.hm-sidebar--compact) .hm-sidebar__fade,
+  :where(:root:not([data-motion])) .hm-sidebar:not(.hm-sidebar--compact) .hm-sidebar-link__text,
+  :where(:root:not([data-motion])) .hm-sidebar:not(.hm-sidebar--compact) .hm-sidebar-group__label {
     animation: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-sidebar,
+:where(:root[data-motion=reduce]) .hm-sidebar.hm-sidebar--overlaid,
+:where(:root[data-motion=reduce]) .hm-sidebar.hm-sidebar--open,
+:where(:root[data-motion=reduce]) .hm-sidebar-group__panel,
+:where(:root[data-motion=reduce]) .hm-sidebar-group__body,
+:where(:root[data-motion=reduce]) .hm-sidebar-group__chevron {
+  transition-duration: 0s;
+  transition-delay: 0s;
+}
+:where(:root[data-motion=reduce]) .hm-sidebar__level--enter {
+  animation: none;
+}
+:where(:root[data-motion=reduce]) .hm-sidebar:not(.hm-sidebar--compact) .hm-sidebar__fade,
+:where(:root[data-motion=reduce]) .hm-sidebar:not(.hm-sidebar--compact) .hm-sidebar-link__text,
+:where(:root[data-motion=reduce]) .hm-sidebar:not(.hm-sidebar--compact) .hm-sidebar-group__label {
+  animation: none;
+}
+
 @media (forced-colors: active) {
   .hm-sidebar {
     border-inline-end-color: CanvasText;
@@ -4132,10 +4241,13 @@ hm-menu {
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-menu {
+  :where(:root:not([data-motion])) .hm-menu {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-menu {
+  transition: none;
+}
 .hm-menu {
   z-index: calc(var(--hm-z-menu) + 1);
 }
@@ -4323,10 +4435,13 @@ hm-menu {
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-menu__sub {
+  :where(:root:not([data-motion])) .hm-menu__sub {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-menu__sub {
+  transition: none;
+}
 .hm-menu__sub {
   z-index: calc(var(--hm-z-menu) + 2);
 }
@@ -4411,10 +4526,13 @@ hm-menu {
   cursor: not-allowed;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-menu__item {
+  :where(:root:not([data-motion])) .hm-menu__item {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-menu__item {
+  transition: none;
+}
 
 .hm-menu__label {
   flex: 1 1 auto;
@@ -4532,10 +4650,13 @@ hm-menu-button,
   border-radius: 50%;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-menu-button {
+  :where(:root:not([data-motion])) .hm-menu-button {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-menu-button {
+  transition: none;
+}
 @media (forced-colors: active) {
   .hm-menu-button:focus-visible {
     outline-color: Highlight;
@@ -4594,10 +4715,13 @@ hm-menu-button,
   cursor: not-allowed;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-menubar__trigger {
+  :where(:root:not([data-motion])) .hm-menubar__trigger {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-menubar__trigger {
+  transition: none;
+}
 
 @media (forced-colors: active) {
   .hm-menubar {
@@ -4830,14 +4954,22 @@ hm-menu-button,
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-navigation-menu__trigger,
-  .hm-navigation-menu__link,
-  .hm-navigation-menu__chevron,
-  .hm-navigation-menu__panel,
-  .hm-navigation-menu-link {
+  :where(:root:not([data-motion])) .hm-navigation-menu__trigger,
+  :where(:root:not([data-motion])) .hm-navigation-menu__link,
+  :where(:root:not([data-motion])) .hm-navigation-menu__chevron,
+  :where(:root:not([data-motion])) .hm-navigation-menu__panel,
+  :where(:root:not([data-motion])) .hm-navigation-menu-link {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-navigation-menu__trigger,
+:where(:root[data-motion=reduce]) .hm-navigation-menu__link,
+:where(:root[data-motion=reduce]) .hm-navigation-menu__chevron,
+:where(:root[data-motion=reduce]) .hm-navigation-menu__panel,
+:where(:root[data-motion=reduce]) .hm-navigation-menu-link {
+  transition: none;
+}
+
 @media (forced-colors: active) {
   .hm-navigation-menu__panel {
     border-color: CanvasText;
@@ -5026,13 +5158,20 @@ hm-tab-bar,
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-tab-bar__tab,
-  .hm-tab-bar__close,
-  .hm-tab-bar__new {
+  :where(:root:not([data-motion])) .hm-tab-bar__tab,
+  :where(:root:not([data-motion])) .hm-tab-bar__close,
+  :where(:root:not([data-motion])) .hm-tab-bar__new {
     transition: none;
     animation: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-tab-bar__tab,
+:where(:root[data-motion=reduce]) .hm-tab-bar__close,
+:where(:root[data-motion=reduce]) .hm-tab-bar__new {
+  transition: none;
+  animation: none;
+}
+
 @media (forced-colors: active) {
   .hm-tab-bar__tab--active {
     forced-color-adjust: none;
@@ -5250,11 +5389,16 @@ hm-toast,
 }
 
 @media (prefers-reduced-motion: reduce) {
-  hm-toast,
-  .hm-toast {
+  :where(:root:not([data-motion])) hm-toast,
+  :where(:root:not([data-motion])) .hm-toast {
     animation: none;
   }
 }
+:where(:root[data-motion=reduce]) hm-toast,
+:where(:root[data-motion=reduce]) .hm-toast {
+  animation: none;
+}
+
 @media (forced-colors: active) {
   .hm-toast__timer {
     forced-color-adjust: none;
@@ -5300,10 +5444,13 @@ hm-toast,
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-tooltip {
+  :where(:root:not([data-motion])) .hm-tooltip {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-tooltip {
+  transition: none;
+}
 
 .hm-toggletip {
   display: inline-flex;
@@ -5348,10 +5495,13 @@ hm-toast,
   visibility: hidden;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-toggletip__bubble {
+  :where(:root:not([data-motion])) .hm-toggletip__bubble {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-toggletip__bubble {
+  transition: none;
+}
 @media (forced-colors: active) {
   .hm-toggletip__bubble {
     border-color: CanvasText;
@@ -5389,10 +5539,13 @@ hm-toast,
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-popover {
+  :where(:root:not([data-motion])) .hm-popover {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-popover {
+  transition: none;
+}
 .hm-popover:focus {
   outline: none;
 }
@@ -5743,11 +5896,15 @@ hm-breadcrumb {
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-breadcrumb__skeleton-step {
+  :where(:root:not([data-motion])) .hm-breadcrumb__skeleton-step {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-breadcrumb__skeleton-step {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-breadcrumb__skeleton-step {
     forced-color-adjust: none;
@@ -5769,11 +5926,16 @@ hm-breadcrumb {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-breadcrumb__link,
-  .hm-breadcrumb__expand {
+  :where(:root:not([data-motion])) .hm-breadcrumb__link,
+  :where(:root:not([data-motion])) .hm-breadcrumb__expand {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-breadcrumb__link,
+:where(:root[data-motion=reduce]) .hm-breadcrumb__expand {
+  transition: none;
+}
+
 @media (forced-colors: active) {
   .hm-breadcrumb__link:focus-visible,
   .hm-breadcrumb__expand:focus-visible {
@@ -5872,14 +6034,21 @@ hm-progress {
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-progress__fill {
+  :where(:root:not([data-motion])) .hm-progress__fill {
     transition: none;
   }
-  .hm-progress--indeterminate .hm-progress__fill {
+  :where(:root:not([data-motion])) .hm-progress--indeterminate :where(:root:not([data-motion])) .hm-progress__fill {
     inset-inline-start: 30%;
     animation: hm-progress-pulse 1600ms ease-in-out infinite;
   }
 }
+:where(:root[data-motion=reduce]) .hm-progress__fill {
+  transition: none;
+}
+:where(:root[data-motion=reduce]) .hm-progress--indeterminate :where(:root[data-motion=reduce]) .hm-progress__fill {
+  inset-inline-start: 30%;
+  animation: hm-progress-pulse 1600ms ease-in-out infinite;
+}
 
 @keyframes hm-progress-sweep {
   from {
@@ -6631,14 +6800,22 @@ hm-timeline-item,
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-timeline__arc {
+  :where(:root:not([data-motion])) .hm-timeline__arc {
     animation: none;
   }
-  .hm-timeline__mark--pulse::after {
+  :where(:root:not([data-motion])) .hm-timeline__mark--pulse::after {
     content: none;
     animation: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-timeline__arc {
+  animation: none;
+}
+:where(:root[data-motion=reduce]) .hm-timeline__mark--pulse::after {
+  content: none;
+  animation: none;
+}
+
 @media (forced-colors: active) {
   .hm-timeline .hm-timeline__mark {
     border-color: CanvasText;
@@ -6932,10 +7109,13 @@ hm-dual-list {
   background: var(--hm-skeleton-base);
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-dual-list__option {
+  :where(:root:not([data-motion])) .hm-dual-list__option {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-dual-list__option {
+  transition: none;
+}
 @media (forced-colors: active) {
   .hm-dual-list__pane {
     border-color: CanvasText;
@@ -7162,10 +7342,13 @@ hm-reorder-list {
   color: var(--hm-disabled-text);
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-reorder-list__item {
+  :where(:root:not([data-motion])) .hm-reorder-list__item {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-reorder-list__item {
+  transition: none;
+}
 @media (forced-colors: active) {
   .hm-reorder-list__item {
     border-color: CanvasText;
@@ -7193,6 +7376,178 @@ hm-reorder-list {
   }
 }
 
+hm-list-editor {
+  display: block;
+  width: 100%;
+}
+
+.hm-list-editor {
+  container: hm-list-editor/inline-size;
+  display: grid;
+  grid-template-columns: minmax(0, 1fr);
+  gap: var(--hm-space-xs);
+  width: 100%;
+}
+.hm-list-editor__header {
+  display: grid;
+  gap: var(--hm-space-micro);
+}
+.hm-list-editor__label-row {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: baseline;
+  gap: var(--hm-space-nano);
+}
+.hm-list-editor__label {
+  color: var(--hm-text);
+  font-size: var(--hm-font-size-sm);
+  font-weight: var(--hm-font-weight-semibold);
+}
+.hm-list-editor__required, .hm-list-editor__count {
+  color: var(--hm-muted);
+  font-size: var(--hm-font-size-xs);
+}
+.hm-list-editor__count {
+  margin-inline-start: auto;
+  font-variant-numeric: tabular-nums;
+}
+.hm-list-editor__add {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  gap: var(--hm-space-xs);
+}
+.hm-list-editor__fields {
+  display: flex;
+  flex: 1 1 12rem;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  gap: var(--hm-space-xs);
+  min-width: 0;
+}
+.hm-list-editor__field {
+  flex: 1 1 12rem;
+  min-width: 0;
+}
+.hm-list-editor__actions {
+  display: flex;
+  flex-wrap: nowrap;
+  align-items: center;
+  gap: var(--hm-space-xs);
+}
+.hm-list-editor--pair .hm-list-editor__add, .hm-list-editor--pair .hm-list-editor__fields {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr);
+  gap: var(--hm-space-xs);
+}
+.hm-list-editor__row {
+  display: flex;
+  align-items: center;
+  gap: var(--hm-space-xs);
+  min-width: 0;
+}
+.hm-list-editor__text {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  gap: var(--hm-space-nano);
+  min-width: 0;
+  padding-block: var(--hm-space-micro);
+}
+.hm-list-editor__title {
+  color: var(--hm-text);
+  font-size: var(--hm-font-size-sm);
+  font-weight: var(--hm-font-weight-semibold);
+  overflow-wrap: anywhere;
+}
+.hm-list-editor__description {
+  color: var(--hm-muted);
+  font-size: var(--hm-font-size-xs);
+  overflow-wrap: anywhere;
+}
+.hm-list-editor .hm-reorder-list__item:has(.hm-list-editor__row--editing) {
+  border-color: var(--hm-action);
+}
+.hm-list-editor__edit {
+  flex-shrink: 0;
+}
+.hm-list-editor__static {
+  display: flex;
+  flex-direction: column;
+  gap: var(--hm-space-micro);
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+.hm-list-editor__static-item {
+  display: flex;
+  flex-direction: column;
+  gap: var(--hm-space-nano);
+  border: var(--hm-border-hairline) solid var(--hm-divider);
+  border-radius: var(--hm-radius-control);
+  padding: var(--hm-space-xs) var(--hm-space-sm);
+  background: var(--hm-surface-raised);
+}
+.hm-list-editor__empty, .hm-list-editor__hint {
+  margin: 0;
+  color: var(--hm-muted);
+  font-size: var(--hm-font-size-sm);
+}
+.hm-list-editor__hint {
+  font-size: var(--hm-font-size-xs);
+}
+.hm-list-editor__error {
+  display: flex;
+  align-items: center;
+  gap: var(--hm-space-micro);
+  margin: 0;
+  color: var(--hm-danger);
+  font-size: var(--hm-font-size-xs);
+}
+.hm-list-editor--invalid .hm-reorder-list__item {
+  border-color: var(--hm-danger);
+}
+.hm-list-editor--disabled .hm-list-editor__title, .hm-list-editor--disabled .hm-list-editor__description {
+  color: var(--hm-disabled-text);
+}
+@media (forced-colors: active) {
+  .hm-list-editor .hm-reorder-list__item:has(.hm-list-editor__row--editing) {
+    border: var(--hm-border-thin) solid Highlight;
+  }
+  .hm-list-editor__static-item {
+    border-color: CanvasText;
+  }
+}
+
+@container hm-list-editor (min-width: 36rem) {
+  .hm-list-editor--pair .hm-list-editor__add {
+    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) auto;
+    grid-template-rows: auto auto auto;
+    gap: 0 var(--hm-space-xs);
+  }
+  .hm-list-editor--pair .hm-list-editor__fields {
+    display: contents;
+  }
+  .hm-list-editor--pair .hm-list-editor__field {
+    display: grid;
+    grid-row: 1/span 3;
+    grid-template-rows: subgrid;
+  }
+  .hm-list-editor--pair .hm-list-editor__field > .hm-field {
+    display: contents;
+  }
+  .hm-list-editor--pair .hm-list-editor__field .hm-field__label-row {
+    padding-block-end: var(--hm-space-micro);
+  }
+  .hm-list-editor--pair .hm-list-editor__field .hm-field__error {
+    padding-block-start: var(--hm-space-micro);
+  }
+  .hm-list-editor--pair .hm-list-editor__actions {
+    grid-row: 2;
+    grid-column: 3;
+    align-self: center;
+  }
+}
 .hm-draggable {
   cursor: grab;
   touch-action: manipulation;
@@ -7285,11 +7640,16 @@ hm-reorder-list {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-drag-placeholder,
-  .hm-drop-zone {
+  :where(:root:not([data-motion])) .hm-drag-placeholder,
+  :where(:root:not([data-motion])) .hm-drop-zone {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-drag-placeholder,
+:where(:root[data-motion=reduce]) .hm-drop-zone {
+  transition: none;
+}
+
 @media (forced-colors: active) {
   .hm-draggable:focus-visible,
   .hm-drag-handle:focus-visible,
@@ -7524,12 +7884,18 @@ hm-kanban {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-kanban-column,
-  .hm-kanban-column__chevron,
-  .hm-kanban-card {
+  :where(:root:not([data-motion])) .hm-kanban-column,
+  :where(:root:not([data-motion])) .hm-kanban-column__chevron,
+  :where(:root:not([data-motion])) .hm-kanban-card {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-kanban-column,
+:where(:root[data-motion=reduce]) .hm-kanban-column__chevron,
+:where(:root[data-motion=reduce]) .hm-kanban-card {
+  transition: none;
+}
+
 @media (forced-colors: active) {
   .hm-kanban-column {
     border-color: CanvasText;
@@ -8321,10 +8687,14 @@ hm-property-view {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-property-view__chevron {
+  :where(:root:not([data-motion])) .hm-property-view__chevron {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-property-view__chevron {
+  transition: none;
+}
+
 @media (forced-colors: active) {
   .hm-property-view__group {
     border-color: CanvasText;
@@ -8409,11 +8779,15 @@ hm-card-container {
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-card-container__skeleton-title {
+  :where(:root:not([data-motion])) .hm-card-container__skeleton-title {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-card-container__skeleton-title {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-card-container__skeleton-title {
     forced-color-adjust: none;
@@ -8438,11 +8812,15 @@ hm-card-container {
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-card-container__skeleton-line {
+  :where(:root:not([data-motion])) .hm-card-container__skeleton-line {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-card-container__skeleton-line {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-card-container__skeleton-line {
     forced-color-adjust: none;
@@ -9013,11 +9391,15 @@ hm-stat-card,
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-stat-card__bone--value {
+  :where(:root:not([data-motion])) .hm-stat-card__bone--value {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-stat-card__bone--value {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-stat-card__bone--value {
     forced-color-adjust: none;
@@ -9042,11 +9424,15 @@ hm-stat-card,
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-stat-card__bone--line {
+  :where(:root:not([data-motion])) .hm-stat-card__bone--line {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-stat-card__bone--line {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-stat-card__bone--line {
     forced-color-adjust: none;
@@ -9209,11 +9595,15 @@ hm-stat-group,
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-stat-group__bone {
+  :where(:root:not([data-motion])) .hm-stat-group__bone {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-stat-group__bone {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-stat-group__bone {
     forced-color-adjust: none;
@@ -9411,10 +9801,14 @@ hm-drawer, .hm-drawer-host {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-drawer__window {
+  :where(:root:not([data-motion])) .hm-drawer__window {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-drawer__window {
+  transition: none;
+}
+
 /* Alto contraste: sem sombra, a borda do lado livre marca onde o painel termina (no fixado, separa o
    painel do conteúdo). */
 @media (forced-colors: active) {
@@ -9957,12 +10351,18 @@ hm-carousel {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-carousel__track,
-  .hm-carousel__dot,
-  .hm-carousel__dot::before {
+  :where(:root:not([data-motion])) .hm-carousel__track,
+  :where(:root:not([data-motion])) .hm-carousel__dot,
+  :where(:root:not([data-motion])) .hm-carousel__dot::before {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-carousel__track,
+:where(:root[data-motion=reduce]) .hm-carousel__dot,
+:where(:root[data-motion=reduce]) .hm-carousel__dot::before {
+  transition: none;
+}
+
 @media (forced-colors: active) {
   .hm-carousel__dot::before {
     forced-color-adjust: none;
@@ -10134,11 +10534,16 @@ hm-paginator {
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-paginator__page,
-  .hm-paginator__select-input {
+  :where(:root:not([data-motion])) .hm-paginator__page,
+  :where(:root:not([data-motion])) .hm-paginator__select-input {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-paginator__page,
+:where(:root[data-motion=reduce]) .hm-paginator__select-input {
+  transition: none;
+}
+
 @media (forced-colors: active) {
   .hm-paginator__select-input {
     border-color: CanvasText;
@@ -11501,10 +11906,13 @@ hm-data-grid {
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-data-grid-column-filter {
+  :where(:root:not([data-motion])) .hm-data-grid-column-filter {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-data-grid-column-filter {
+  transition: none;
+}
 .hm-data-grid-column-filter:focus {
   outline: none;
 }
@@ -12086,11 +12494,15 @@ hm-workspace-node {
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-combobox__skeleton-label {
+  :where(:root:not([data-motion])) .hm-combobox__skeleton-label {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-combobox__skeleton-label {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-combobox__skeleton-label {
     forced-color-adjust: none;
@@ -12116,11 +12528,15 @@ hm-workspace-node {
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-combobox__skeleton-frame {
+  :where(:root:not([data-motion])) .hm-combobox__skeleton-frame {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-combobox__skeleton-frame {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-combobox__skeleton-frame {
     forced-color-adjust: none;
@@ -12155,10 +12571,13 @@ hm-workspace-node {
   translate: -50% 0;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-combobox__popover {
+  :where(:root:not([data-motion])) .hm-combobox__popover {
     animation-name: hm-combobox-fade;
   }
 }
+:where(:root[data-motion=reduce]) .hm-combobox__popover {
+  animation-name: hm-combobox-fade;
+}
 .hm-combobox__list {
   position: relative;
   margin: 0;
@@ -12444,10 +12863,13 @@ hm-workspace-node {
   translate: -50% 0;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-combobox-multi__popover {
+  :where(:root:not([data-motion])) .hm-combobox-multi__popover {
     animation-name: hm-combobox-fade;
   }
 }
+:where(:root[data-motion=reduce]) .hm-combobox-multi__popover {
+  animation-name: hm-combobox-fade;
+}
 .hm-combobox-multi__search {
   display: flex;
   align-items: center;
@@ -13265,12 +13687,18 @@ hm-tab {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-tabs__tab,
-  .hm-tabs__tab::after,
-  .hm-tabs__more {
+  :where(:root:not([data-motion])) .hm-tabs__tab,
+  :where(:root:not([data-motion])) .hm-tabs__tab::after,
+  :where(:root:not([data-motion])) .hm-tabs__more {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-tabs__tab,
+:where(:root[data-motion=reduce]) .hm-tabs__tab::after,
+:where(:root[data-motion=reduce]) .hm-tabs__more {
+  transition: none;
+}
+
 @media (forced-colors: active) {
   .hm-tabs__tab::after {
     forced-color-adjust: none;
@@ -13471,11 +13899,15 @@ hm-tab {
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-textarea__ghost {
+  :where(:root:not([data-motion])) .hm-textarea__ghost {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-textarea__ghost {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-textarea__ghost {
     forced-color-adjust: none;
@@ -13491,11 +13923,16 @@ hm-tab {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-textarea__control,
-  .hm-textarea__frame--grouped {
+  :where(:root:not([data-motion])) .hm-textarea__control,
+  :where(:root:not([data-motion])) .hm-textarea__frame--grouped {
     transition-duration: 1ms;
   }
 }
+:where(:root[data-motion=reduce]) .hm-textarea__control,
+:where(:root[data-motion=reduce]) .hm-textarea__frame--grouped {
+  transition-duration: 1ms;
+}
+
 @media (forced-colors: active) {
   .hm-textarea__control {
     border-color: CanvasText;
@@ -13721,11 +14158,15 @@ hm-tab {
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-rich-text__ghost {
+  :where(:root:not([data-motion])) .hm-rich-text__ghost {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-rich-text__ghost {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-rich-text__ghost {
     forced-color-adjust: none;
@@ -13741,10 +14182,14 @@ hm-tab {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-rich-text__frame {
+  :where(:root:not([data-motion])) .hm-rich-text__frame {
     transition-duration: 1ms;
   }
 }
+:where(:root[data-motion=reduce]) .hm-rich-text__frame {
+  transition-duration: 1ms;
+}
+
 @media (forced-colors: active) {
   .hm-rich-text__frame {
     border-color: CanvasText;
@@ -14178,11 +14623,16 @@ hm-radio {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-radio__control,
-  .hm-radio--card .hm-radio__row {
+  :where(:root:not([data-motion])) .hm-radio__control,
+  :where(:root:not([data-motion])) .hm-radio--card .hm-radio__row {
     transition-duration: 1ms;
   }
 }
+:where(:root[data-motion=reduce]) .hm-radio__control,
+:where(:root[data-motion=reduce]) .hm-radio--card .hm-radio__row {
+  transition-duration: 1ms;
+}
+
 @media (forced-colors: active) {
   .hm-radio__control {
     forced-color-adjust: none;
@@ -14406,11 +14856,15 @@ hm-switch {
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-switch__ghost-track {
+  :where(:root:not([data-motion])) .hm-switch__ghost-track {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-switch__ghost-track {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-switch__ghost-track {
     forced-color-adjust: none;
@@ -14437,11 +14891,15 @@ hm-switch {
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-switch__ghost-label {
+  :where(:root:not([data-motion])) .hm-switch__ghost-label {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-switch__ghost-label {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-switch__ghost-label {
     forced-color-adjust: none;
@@ -14459,11 +14917,16 @@ hm-switch {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-switch__thumb,
-  .hm-switch__track {
+  :where(:root:not([data-motion])) .hm-switch__thumb,
+  :where(:root:not([data-motion])) .hm-switch__track {
     transition-duration: 1ms;
   }
 }
+:where(:root[data-motion=reduce]) .hm-switch__thumb,
+:where(:root[data-motion=reduce]) .hm-switch__track {
+  transition-duration: 1ms;
+}
+
 @media (forced-colors: active) {
   .hm-switch__track {
     forced-color-adjust: none;
@@ -14608,10 +15071,14 @@ hm-switch {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-segmented__option {
+  :where(:root:not([data-motion])) .hm-segmented__option {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-segmented__option {
+  transition: none;
+}
+
 /* Alto contraste: a opção marcada se distinguia por superfície elevada + sombra (ou cor de ação no
    `--action`), e as não marcadas têm borda transparente — que o navegador torna visível, deixando
    todas iguais. Marcada → Highlight/HighlightText; desabilitada → GrayText; foco → Highlight. */
@@ -14849,9 +15316,11 @@ hm-settings-dialog {
 @media (max-width: 767px) {
   .hm-settings {
     padding: 0;
+    /* minmax(0, 1fr): sem isso a faixa de navegação (uma linha só, larga) alarga a coluna além da tela e o
+       conteúdo sai cortado pela direita. */
   }
   .hm-settings__window {
-    grid-template-columns: 1fr;
+    grid-template-columns: minmax(0, 1fr);
     grid-template-rows: auto minmax(0, 1fr);
     max-width: none;
     height: 100%;
@@ -14902,6 +15371,12 @@ hm-settings-dialog {
 }
 .hm-settings-section__header {
   padding-bottom: var(--hm-space-xxxs);
+  /* Tela estreita: o X de fechar fica por cima do topo do conteúdo; o título não passa por baixo dele. */
+}
+@media (max-width: 767px) {
+  .hm-settings-section__header {
+    padding-inline-end: calc(var(--hm-control-height) + var(--hm-space-xxxs));
+  }
 }
 .hm-settings-section__heading {
   margin: 0;
@@ -14930,6 +15405,7 @@ hm-settings-dialog {
 .hm-settings-row--stacked {
   flex-direction: column;
   align-items: stretch;
+  gap: var(--hm-space-xs);
 }
 .hm-settings-row__text {
   display: flex;
@@ -14938,6 +15414,18 @@ hm-settings-dialog {
   flex-direction: column;
   gap: var(--hm-space-micro);
 }
+.hm-settings-row {
+  /* Rótulo + ajuda opcional (`rowHelp`, em geral um hm-toggletip) na mesma linha. */
+}
+.hm-settings-row__label-line {
+  display: flex;
+  align-items: center;
+  gap: var(--hm-space-nano);
+  /* O botão do toggletip é mais alto que a linha de texto: não deixa ele empurrar a linha. */
+}
+.hm-settings-row__label-line .hm-toggletip {
+  margin-block: calc(-1 * var(--hm-space-xxxs));
+}
 .hm-settings-row__label {
   color: var(--hm-text);
   font-size: var(--hm-font-size-sm);
@@ -15102,12 +15590,18 @@ hm-accordion-panel,
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-accordion-panel__trigger,
-  .hm-accordion-panel__chevron,
-  .hm-accordion-panel__body {
+  :where(:root:not([data-motion])) .hm-accordion-panel__trigger,
+  :where(:root:not([data-motion])) .hm-accordion-panel__chevron,
+  :where(:root:not([data-motion])) .hm-accordion-panel__body {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-accordion-panel__trigger,
+:where(:root[data-motion=reduce]) .hm-accordion-panel__chevron,
+:where(:root[data-motion=reduce]) .hm-accordion-panel__body {
+  transition: none;
+}
+
 @media (forced-colors: active) {
   .hm-accordion-panel__trigger:focus-visible {
     outline-color: Highlight;
@@ -15265,11 +15759,16 @@ hm-accordion-panel,
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-tree__item,
-  .hm-tree__chevron {
+  :where(:root:not([data-motion])) .hm-tree__item,
+  :where(:root:not([data-motion])) .hm-tree__chevron {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-tree__item,
+:where(:root[data-motion=reduce]) .hm-tree__chevron {
+  transition: none;
+}
+
 @media (forced-colors: active) {
   .hm-tree__item--active {
     background: Highlight;
@@ -16351,6 +16850,8 @@ hm-event-calendar {
   display: inline-flex;
   align-items: stretch;
   vertical-align: middle;
+  /* Os z-index dos botões (abaixo) valem só dentro do grupo, sem passar por cima de cabeçalho fixo etc. */
+  isolation: isolate;
 }
 .hm-btn-group > hm-button,
 .hm-btn-group > .hm-button-host {
@@ -16371,11 +16872,15 @@ hm-event-calendar {
   margin-inline-start: calc(var(--hm-border-hairline) * -1);
 }
 .hm-btn-group {
-  /* O botão focado/ativo fica por cima dos vizinhos (a borda dele não some sob a do lado). */
+  /* Na borda compartilhada vale a do habilitado (a do desabilitado é cinza); o focado/ativo fica por cima de
+     todos (a borda dele não some sob a do lado). */
+}
+.hm-btn-group .hm-btn:not(:disabled, [aria-disabled=true]) {
+  z-index: 1;
 }
 .hm-btn-group .hm-btn:hover,
 .hm-btn-group .hm-btn:focus-visible {
-  z-index: 1;
+  z-index: 2;
 }
 .hm-btn-group {
   /* Pontas: o primeiro e o último VISÍVEIS (os `inMenu` ficam com display:none). */
@@ -18144,10 +18649,13 @@ hm-slider {
   translate: 0 -50%;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-slider__thumb, .hm-slider__tooltip {
+  :where(:root:not([data-motion])) .hm-slider__thumb, :where(:root:not([data-motion])) .hm-slider__tooltip {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-slider__thumb, :where(:root[data-motion=reduce]) .hm-slider__tooltip {
+  transition: none;
+}
 
 @media (forced-colors: active) {
   .hm-slider__rail {
@@ -18236,10 +18744,14 @@ hm-slider {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-time-picker__list {
+  :where(:root:not([data-motion])) .hm-time-picker__list {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-time-picker__list {
+  transition: none;
+}
+
 /* Alto contraste: o cartão ganha borda, a ativa contorno Highlight e a escolhida o par do sistema. */
 @media (forced-colors: active) {
   .hm-time-picker__list {
@@ -18492,16 +19004,26 @@ hm-slider {
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-fab,
-  .hm-fab__button,
-  .hm-fab__icon,
-  .hm-fab__action-icon {
+  :where(:root:not([data-motion])) .hm-fab,
+  :where(:root:not([data-motion])) .hm-fab__button,
+  :where(:root:not([data-motion])) .hm-fab__icon,
+  :where(:root:not([data-motion])) .hm-fab__action-icon {
     transition: none;
   }
-  .hm-fab__menu {
+  :where(:root:not([data-motion])) .hm-fab__menu {
     animation: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-fab,
+:where(:root[data-motion=reduce]) .hm-fab__button,
+:where(:root[data-motion=reduce]) .hm-fab__icon,
+:where(:root[data-motion=reduce]) .hm-fab__action-icon {
+  transition: none;
+}
+:where(:root[data-motion=reduce]) .hm-fab__menu {
+  animation: none;
+}
+
 @media (forced-colors: active) {
   .hm-fab__button,
   .hm-fab__action-icon,
@@ -18637,11 +19159,15 @@ hm-search-field {
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-search-field__skeleton-label {
+  :where(:root:not([data-motion])) .hm-search-field__skeleton-label {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-search-field__skeleton-label {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-search-field__skeleton-label {
     forced-color-adjust: none;
@@ -18667,11 +19193,15 @@ hm-search-field {
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-search-field__skeleton-control {
+  :where(:root:not([data-motion])) .hm-search-field__skeleton-control {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-search-field__skeleton-control {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-search-field__skeleton-control {
     forced-color-adjust: none;
@@ -18706,16 +19236,25 @@ hm-search-field {
 }
 
 @media (prefers-reduced-motion: no-preference) {
-  .hm-reveal--pending:not(:focus-within) {
+  :where(:root:not([data-motion])) .hm-reveal--pending:not(:focus-within) {
     opacity: 0;
     translate: 0 var(--hm-space-md);
   }
 }
+:where(:root[data-motion=full]) .hm-reveal--pending:not(:focus-within) {
+  opacity: 0;
+  translate: 0 var(--hm-space-md);
+}
+
 @media (prefers-reduced-motion: reduce) {
-  .hm-reveal {
+  :where(:root:not([data-motion])) .hm-reveal {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-reveal {
+  transition: none;
+}
+
 @media print {
   .hm-reveal--pending,
   .hm-reveal--pending:not(:focus-within) {
@@ -19144,11 +19683,15 @@ hm-page-header {
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-page-header__summary--loading::before {
+  :where(:root:not([data-motion])) .hm-page-header__summary--loading::before {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-page-header__summary--loading::before {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-page-header__summary--loading::before {
     forced-color-adjust: none;
@@ -19183,11 +19726,15 @@ hm-page-header {
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-page-header__skeleton-title {
+  :where(:root:not([data-motion])) .hm-page-header__skeleton-title {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-page-header__skeleton-title {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-page-header__skeleton-title {
     forced-color-adjust: none;
@@ -19760,11 +20307,15 @@ hm-file-upload {
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-file-upload__skeleton-label {
+  :where(:root:not([data-motion])) .hm-file-upload__skeleton-label {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-file-upload__skeleton-label {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-file-upload__skeleton-label {
     forced-color-adjust: none;
@@ -19790,11 +20341,15 @@ hm-file-upload {
   animation: hm-skeleton-sweep calc(var(--hm-duration-slow) * 3) linear infinite;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-file-upload__skeleton-zone {
+  :where(:root:not([data-motion])) .hm-file-upload__skeleton-zone {
     animation: none;
     background-position: 50% 0;
   }
 }
+:where(:root[data-motion=reduce]) .hm-file-upload__skeleton-zone {
+  animation: none;
+  background-position: 50% 0;
+}
 @media (forced-colors: active) {
   .hm-file-upload__skeleton-zone {
     forced-color-adjust: none;
@@ -19815,10 +20370,14 @@ hm-file-upload {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-file-upload__zone {
+  :where(:root:not([data-motion])) .hm-file-upload__zone {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-file-upload__zone {
+  transition: none;
+}
+
 @media (forced-colors: active) {
   .hm-file-upload__zone {
     border-color: ButtonBorder;
@@ -20283,10 +20842,14 @@ hm-image-crop {
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .hm-image-crop__guides {
+  :where(:root:not([data-motion])) .hm-image-crop__guides {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-image-crop__guides {
+  transition: none;
+}
+
 @media (forced-colors: active) {
   .hm-image-crop__frame {
     border-color: Highlight;
@@ -20849,10 +21412,14 @@ hm-code-diff {
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .hm-code-viewer__copy--floating {
+  :where(:root:not([data-motion])) .hm-code-viewer__copy--floating {
     transition: none;
   }
 }
+:where(:root[data-motion=reduce]) .hm-code-viewer__copy--floating {
+  transition: none;
+}
+
 @media (forced-colors: active) {
   .hm-code-viewer__line--highlighted .hm-code-viewer__number {
     border-inline-start-color: CanvasText;