/* MEM Studios — visual stability, responsive loading and restrained motion.
   Loaded after existing workspace CSS; no layout or branding replacement. */
:root {
  --ws-accent-gradient:var(--mem-accent-gradient);
  --ws-motion-ease:var(--mem-easing-standard);
}
/* Native hidden elements must not reappear due to display:flex/grid rules. */
:where([hidden]) { display:none !important; }

/* Rich accent reserved for progress and small microinteractions. */
.ws-load-indicator { position:fixed; inset:0 0 auto; z-index:9999; height:0.1875rem; overflow:hidden; background:rgba(181,181,255,.10); pointer-events:none; }
.ws-load-indicator::before { content:''; display:block; position:absolute; top:0; bottom:0; left:0; width:33%; background:var(--ws-accent-gradient); animation:ws-navigation-progress 1.15s ease-in-out infinite; }
@keyframes ws-navigation-progress { from { transform:translateX(-110%); } to { transform:translateX(310%); } }
.ws-nav__item.is-active { position:relative; }
.ws-nav__item.is-active::before { content:''; position:absolute; top:0.5rem; bottom:0.5rem; left:0; width:0.125rem; background:var(--ws-accent-gradient); }
.ws-btn--primary, .btn--primary { transition:background-color .22s ease, color .22s ease, border-color .22s ease, transform .25s var(--ws-motion-ease); }
@media (hover:hover) and (pointer:fine) {
  .ws-btn--primary:hover, .btn--primary:hover { transform:translateY(-1px); }
  .ws-row, .today-item, .uw-row, .hub-list__row { transition:background-color .20s ease, border-color .20s ease; }
}

/* Critical content stays readable throughout an entrance; never start at opacity:0. */
@keyframes ws-content-enter { from { opacity:.78; transform:translate3d(0, 0.5625rem, 0); } to { opacity:1; transform:none; } }
@keyframes ws-subtle-enter { from { opacity:.75; transform:translate3d(0, 0.3125rem, 0); } to { opacity:1; transform:none; } }
@media (prefers-reduced-motion:no-preference) {
  html.ws-motion-ready .ws-main > :is(.ws-page-head,.uw-hero,.h1-title,.card,.ws-section,.today-cols,.grid,.client-grid,.ws-notice) {
    animation:ws-content-enter .43s var(--ws-motion-ease) both;
  }
  html.ws-motion-ready .ws-main > :is(.ws-page-head,.uw-hero,.h1-title) { animation-duration:.34s; }
  html.ws-motion-ready .ws-main > :is(.today-cols,.grid,.client-grid) { animation-delay:.065s; }
  html.ws-motion-ready .ws-palette[open] .ws-palette__box { animation:ws-subtle-enter .22s var(--ws-motion-ease) both; }
  html.ws-motion-ready .ws-toast { animation:ws-subtle-enter .24s var(--ws-motion-ease) both; }
}

/* Form submits: do not disable native buttons; their name/value must be submitted. */
form.ws-is-submitting .ws-submitter-loading { cursor:progress; }
form.ws-is-submitting button.ws-submitter-loading { position:relative; padding-right:2.0625rem; }
form.ws-is-submitting button.ws-submitter-loading::after { content:''; position:absolute; width:0.75rem; height:0.75rem; top:calc(50% - 0.4375rem); right:0.625rem; border-radius:var(--mem-radius-circle); border:1.5px solid currentColor; border-bottom-color:transparent; animation:ws-spinner .75s linear infinite; }
@keyframes ws-spinner { to { transform:rotate(360deg); } }

/* Search has a real async wait, rendered before results arrive. */
.ws-palette__loading { padding:1.3125rem var(--mem-space-6); display:flex; align-items:center; gap:var(--mem-space-3); font-size:var(--mem-type-sm); color:var(--ws-muted,var(--mem-color-text-muted)); }
.ws-palette__loading::before { content:''; display:block; width:0.9375rem; height:0.9375rem; border:1.5px solid var(--ws-lilac,var(--mem-color-lilac)); border-right-color:transparent; border-radius:var(--mem-radius-circle); animation:ws-spinner .85s linear infinite; }
.ws-palette__loading--error::before { border:none; width:0.1875rem; border-radius:var(--mem-radius-none); background:var(--ws-accent-gradient); animation:none; }

/* Classic invoice: project choices fetched when the client changes. */
.ws-inline-loading { display:block; margin:var(--mem-space-1-5) 0 0; color:var(--ws-muted,var(--mem-color-text-muted)); font-size:var(--mem-type-xs); min-height:1.4em; }
.ws-inline-loading[data-state=loading]::before { content:''; display:inline-block; vertical-align:-0.125rem; width:0.625rem; height:0.625rem; margin-right:var(--mem-space-2); border:1.5px solid var(--ws-lilac,var(--mem-color-lilac)); border-bottom-color:transparent; border-radius:var(--mem-radius-circle); animation:ws-spinner .8s linear infinite; }
.ws-inline-loading[data-state=error] { color:var(--ws-red-text,var(--mem-color-red-text)); }

/* Invoice editor may be server-rendered before JS rows are initialised. */
.ie-initial-loader__line { background:var(--ws-accent-gradient); background-size:260% 100%; opacity:.35; animation:ws-skeleton 1.6s ease-in-out infinite; }
@keyframes ws-skeleton { 0%,100%{background-position:0 50%;opacity:.24} 50%{background-position:100% 50%;opacity:.55} }

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  html.ws-motion-ready .ws-main > *, html.ws-motion-ready .ws-toast, html.ws-motion-ready .ws-palette[open] .ws-palette__box,
  .ws-palette__loading::before,.ws-inline-loading[data-state=loading]::before,form.ws-is-submitting button.ws-submitter-loading::after,.ie-initial-loader__line { animation:none !important; }
  .ws-btn--primary,.btn--primary,.ws-row,.today-item,.uw-row,.hub-list__row { transition:none !important; transform:none !important; }
}
