/* A shared vocabulary: settle, acknowledge, lift. Reading stays still. */
:root { --micro-ease: cubic-bezier(.22, .61, .36, 1); --micro-time: 220ms; }
.music-track-credit, .music-library-note, .music-playback-status {
  font: 400 11px/1.75 var(--font-sans, 'Inter', sans-serif);
  color: inherit; overflow-wrap: anywhere; max-width: 42em; margin: 18px auto 0;
}
.music-track-credit a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.music-playback-status:empty { display: none; }
.studio-workbench #btnMusicPreview { width: 100%; min-height: 44px; margin-top: 16px; }
.studio-workbench .audio-track-info { min-width: 0; width: 100%; }
.studio-workbench #selectMusicTrack { min-width: 0; width: 100%; min-height: 44px; }
.audio-sound-wave:not(.is-playing) .wave-bar { animation-play-state: paused; }
.work-more-menu .user-profile-hud { margin: 12px 0 0 !important; padding: 12px 0 0 !important; border-left: 0 !important; border-top: 1px solid var(--work-line); }
.work-more-menu #btnLogout { min-height: 44px !important; }
html[data-micro-motion="active"] [data-micro-control] {
  transition: color var(--micro-time) ease, background-color var(--micro-time) ease,
    border-color var(--micro-time) ease, box-shadow var(--micro-time) ease;
}
html[data-micro-motion="active"] [data-micro-control] > svg {
  transition: translate 280ms var(--micro-ease), scale 220ms var(--micro-ease);
}
html[data-micro-motion="active"] .studio-workbench :is(input, textarea, select) {
  transition: border-color 220ms ease, background-color 220ms ease, box-shadow 220ms ease;
}
/* The picture lifts inside a stable button; the button stays easy to touch. */
html[data-micro-motion="active"] .studio-workbench :is(.atelier-sample, .opt-preview, .photo-slot-thumb) {
  transition: translate 420ms var(--micro-ease), scale 520ms var(--micro-ease), box-shadow 300ms ease;
}
html[data-micro-motion="active"] .studio-workbench .collection-check {
  transition: opacity 220ms ease, scale 280ms var(--micro-ease); scale: .85;
}
html[data-micro-motion="active"] .studio-workbench .atelier-collection[aria-pressed="true"] .collection-check { scale: 1; }
html[data-micro-motion="active"] .studio-workbench .work-toolrail button[aria-pressed="true"] > svg { translate: 0 -1px; }
@media (hover: hover) and (pointer: fine) {
  html[data-micro-motion="active"] [data-micro-control]:not(:disabled):not([aria-disabled="true"]):hover > svg { translate: 0 -1.5px; }
  html[data-micro-motion="active"] .studio-workbench .atelier-collection:hover .atelier-sample {
    translate: 0 -2px; box-shadow: 0 5px 12px #26322612;
  }
  html[data-micro-motion="active"] .studio-workbench .horizontal-item-card:hover .opt-preview { translate: 0 -1.5px; }
  html[data-micro-motion="active"] .studio-workbench .photo-slot-card:hover .photo-slot-thumb { scale: 1.012; }
}
html[data-micro-motion="active"] [data-micro-control]:focus-visible > svg { translate: 0 -1px; }
html[data-micro-motion="active"] [data-micro-control]:not(:disabled):not([aria-disabled="true"]):active > svg { translate: 0 0; scale: .94; }
html[data-micro-motion="active"] .studio-workbench .atelier-collection:active .atelier-sample { translate: 0 0; scale: .99; }
@media (pointer: coarse) {
  .studio-workbench :is(.work-more summary, .atelier-close, .work-options-close, .atelier-tabs button, .field-group-tab) { min-width: 44px; min-height: 44px; }
  .studio-workbench :is(input:not([type="range"]):not([type="checkbox"]):not([type="color"]), textarea, select) { font-size: 16px; }
}
@media (max-width: 700px) {
  .studio-workbench .atelier-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: visible; gap: 0 5px; padding-inline: 12px; }
  .studio-workbench .atelier-tabs button { padding: 10px 4px; min-height: 44px; }
  .studio-workbench .studio-hud-actions { min-width: 0; overflow: visible; }
  .studio-workbench .studio-navbar-floating { gap: 6px; padding-inline: 10px; }
  .studio-workbench .brand-text-title > span:not(.work-brand-symbol) { display: none; }
  .studio-workbench :is(#btnStudioUndo, #btnStudioRedo) { min-width: 36px; min-height: 44px; }
  .studio-workbench #btnSaveStudio { min-height: 44px; }
  .studio-workbench .work-more summary { min-width: 36px; padding-inline: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  [data-micro-control], [data-micro-control] > svg,
  .studio-workbench :is(.atelier-sample, .opt-preview, .photo-slot-thumb, .collection-check) { transition: none !important; }
}
