/* Miwa design system — tokens + components. Generated from the Miwa design system; do not edit by hand. */
@font-face{font-family:"Vazirmatn";src:url("../fonts/Vazirmatn-Variable.woff2") format("woff2-variations"),url("../fonts/Vazirmatn-Variable.woff2") format("woff2");font-weight:100 900;font-display:swap}
:root,[data-theme="light"]{
  --surface:#fafaf7;
  --surface-raised:#ffffff;
  --surface-grouped:#f2f3ef;
  --fill-secondary:#e9ebe5;
  --material-bar:rgba(250, 250, 247, 0.82);
  --line:#e3e6df;
  --ink:#1a1f1a;
  --ink-muted:#5d665b;
  --leaf:#066832;
  --leaf-soft:#e3f1e7;
  --on-leaf:#ffffff;
  --citrus:#e4800d;
  --berry:#c2344a;
  --berry-soft:#fbe9ec;
  --warn:#8a5200;
  --warn-soft:#fdf0dc;
  --info:#1d5fa8;
  --info-soft:#e7f0fb;
  --progress:#6a3fb0;
  --progress-soft:#f1eafb;
  --focus-ring:var(--leaf);
  --shadow-sm:0 1px 2px rgba(26, 31, 26, 0.06), 0 1px 3px rgba(26, 31, 26, 0.08);
  --shadow-md:0 4px 12px rgba(26, 31, 26, 0.08), 0 1px 3px rgba(26, 31, 26, 0.06);
  --shadow-lg:0 16px 40px rgba(26, 31, 26, 0.14), 0 4px 12px rgba(26, 31, 26, 0.06);
}
[data-theme="dark"]{
  --surface:#121512;
  --surface-raised:#1b1f1b;
  --surface-grouped:#0b0d0b;
  --fill-secondary:#262b26;
  --material-bar:rgba(18, 21, 18, 0.82);
  --line:#2e342d;
  --ink:#eef1ec;
  --ink-muted:#a3ad9f;
  --leaf:#4db36f;
  --leaf-soft:#183a23;
  --on-leaf:#121512;
  --citrus:#f0953a;
  --berry:#f07186;
  --berry-soft:#3d1a20;
  --warn:#f5b454;
  --warn-soft:#3a2a10;
  --info:#86b8f2;
  --info-soft:#15263a;
  --progress:#c4a6f5;
  --progress-soft:#2a1d3d;
  --focus-ring:var(--leaf);
  --shadow-sm:0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md:0 4px 12px rgba(0, 0, 0, 0.5);
  --shadow-lg:0 16px 40px rgba(0, 0, 0, 0.6);
}
:root{
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --space-6:24px;
  --space-8:32px;
  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:20px;
  --radius-full:9999px;
  --tap-min:44px;
  --control-sm:32px;
  --font-sans:IRANSans, "IRANSansX", Vazirmatn, Tahoma, system-ui, sans-serif;
}
.large-title{font-family:var(--font-sans);font-size:34px;line-height:48px;font-weight:700}
.title-1{font-family:var(--font-sans);font-size:28px;line-height:40px;font-weight:700}
.title-2{font-family:var(--font-sans);font-size:22px;line-height:34px;font-weight:700}
.title-3{font-family:var(--font-sans);font-size:20px;line-height:30px;font-weight:600}
.headline{font-family:var(--font-sans);font-size:17px;line-height:28px;font-weight:600}
.body{font-family:var(--font-sans);font-size:17px;line-height:28px;font-weight:400}
.callout{font-family:var(--font-sans);font-size:16px;line-height:26px;font-weight:400}
.subheadline{font-family:var(--font-sans);font-size:15px;line-height:24px;font-weight:500}
.footnote{font-family:var(--font-sans);font-size:13px;line-height:22px;font-weight:400}
.caption{font-family:var(--font-sans);font-size:12px;line-height:20px;font-weight:500}
/* Motion — durations and curves (tokens.json has no motion family, so they live here) */
:root{--dur-instant:60ms;--dur-fast:120ms;--dur-base:240ms;--dur-slow:400ms;--dur-count:700ms;--ease-out:cubic-bezier(.2,.8,.2,1);--ease-in-out:cubic-bezier(.65,0,.35,1);--ease-spring:cubic-bezier(.34,1.56,.64,1)}
.mw-btn{font-family:var(--font-sans);white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-1);border:0;cursor:pointer;border-radius:var(--radius-md);font-weight:600;transition:transform var(--dur-fast) var(--ease-spring),filter var(--dur-fast) ease,background-color var(--dur-base) ease,color var(--dur-base) ease;-webkit-tap-highlight-color:transparent}
.mw-btn:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.mw-btn:active{transform:scale(.96);transition-duration:60ms}
.mw-btn[disabled]{opacity:.4;cursor:default;transform:none}
.mw-btn--lg{min-height:var(--tap-min);padding:0 var(--space-5);font-size:17px;line-height:28px}
.mw-btn--sm{min-height:var(--control-sm);padding:0 var(--space-3);font-size:15px;line-height:24px;border-radius:var(--radius-sm)}
.mw-btn--block{display:flex;width:100%}
.mw-btn--filled{background:var(--leaf);color:var(--on-leaf)}
.mw-btn--filled:hover{filter:brightness(1.08)}
.mw-btn--tinted{background:var(--leaf-soft);color:var(--leaf)}
.mw-btn--plain{background:transparent;color:var(--leaf)}
.mw-btn--plain:hover,.mw-btn--tinted:hover{filter:brightness(.97)}
.mw-btn--destructive.mw-btn--filled{background:var(--berry);color:var(--on-leaf)}
.mw-btn--destructive.mw-btn--tinted{background:var(--berry-soft);color:var(--berry)}
.mw-btn--destructive.mw-btn--plain{color:var(--berry)}
.mw-badge{font-family:var(--font-sans);display:inline-flex;align-items:center;gap:var(--space-1);padding:2px var(--space-2);border-radius:var(--radius-sm);font-size:12px;line-height:20px;font-weight:600;white-space:nowrap}
.mw-badge--fresh{background:var(--leaf-soft);color:var(--leaf)}
.mw-badge--discount{background:var(--citrus);color:var(--ink)}
.mw-badge--out{background:var(--berry-soft);color:var(--berry)}
.mw-badge--neutral{background:var(--fill-secondary);color:var(--ink)}
.mw-badge__dot{width:6px;height:6px;border-radius:var(--radius-full);background:currentColor}
.mw-price{font-family:var(--font-sans);display:inline-flex;align-items:baseline;gap:var(--space-1);flex-wrap:wrap;color:var(--ink)}
.mw-price__amount{font-size:17px;line-height:28px;font-weight:700;font-feature-settings:"tnum"}
.mw-price--lg .mw-price__amount{font-size:22px;line-height:34px}
.mw-price__cur{font-size:13px;line-height:22px;font-weight:500}
.mw-price__unit{font-size:13px;line-height:22px;color:var(--ink-muted)}
.mw-price__old{font-size:13px;line-height:22px;color:var(--ink-muted);text-decoration:line-through;margin-inline-start:var(--space-1)}
.mw-card{font-family:var(--font-sans);background:var(--surface-raised);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden;display:flex;flex-direction:column;color:var(--ink);transition:box-shadow var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out)}
.mw-card:hover{box-shadow:var(--shadow-md);transform:translateY(-3px)}
.mw-card__media img{transition:transform var(--dur-slow) var(--ease-out)}
.mw-card:hover .mw-card__media img:not(.mw-card__ph){transform:scale(1.04)}
.mw-card__media{position:relative;aspect-ratio:4/3;background:var(--leaf-soft);display:flex;align-items:center;justify-content:center}
.mw-card__media img{width:100%;height:100%;object-fit:cover}
.mw-card__media img.mw-card__ph{width:40%;height:auto;object-fit:contain;opacity:.9}
.mw-card__badge{position:absolute;top:var(--space-3);inset-inline-start:var(--space-3)}
.mw-card__body{padding:var(--space-3) var(--space-4) var(--space-4);display:flex;flex-direction:column;gap:var(--space-1)}
.mw-card__name{margin:0;font-size:17px;line-height:28px;font-weight:600}
.mw-card__meta{margin:0;font-size:13px;line-height:22px;color:var(--ink-muted)}
.mw-card__foot{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);margin-top:var(--space-2)}
.mw-card--out .mw-card__media img{filter:grayscale(1);opacity:.5}

/* Segmented control with a sliding thumb */
.mw-seg{font-family:var(--font-sans);position:relative;display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:2px;padding:2px;background:var(--fill-secondary);border-radius:var(--radius-sm);--w:calc((100% - 4px - (var(--n) - 1) * 2px) / var(--n))}
.mw-seg__thumb{position:absolute;top:2px;bottom:2px;width:var(--w);inset-inline-start:calc(2px + var(--i) * (var(--w) + 2px));background:var(--surface-raised);box-shadow:var(--shadow-sm);border-radius:6px;transition:inset-inline-start var(--dur-slow) var(--ease-spring)}
.mw-seg__item{position:relative;z-index:1;border:0;background:transparent;color:var(--ink-muted);font:inherit;font-size:13px;line-height:22px;font-weight:500;padding:0 var(--space-3);min-height:28px;border-radius:6px;cursor:pointer;transition:color var(--dur-base) ease}
.mw-seg__item[aria-checked="true"]{color:var(--ink);font-weight:600}
.mw-seg__item:active{transform:scale(.95)}
.mw-seg__item:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}

/* Badge: the fresh dot breathes */
.mw-badge--fresh .mw-badge__dot{position:relative}
.mw-badge--fresh .mw-badge__dot::after{content:"";position:absolute;inset:0;border-radius:inherit;background:currentColor;animation:mw-ping 1.8s var(--ease-out) infinite}
@keyframes mw-ping{0%{transform:scale(1);opacity:.6}80%,100%{transform:scale(2.6);opacity:0}}
.mw-badge--pop{animation:mw-pop var(--dur-slow) var(--ease-spring)}
@keyframes mw-pop{0%{transform:scale(.6);opacity:0}100%{transform:scale(1);opacity:1}}

/* PriceTag: rolling number + flash on change */
.mw-price__amount{display:inline-block;border-radius:6px;padding:0 2px;margin:0 -2px;transition:background-color var(--dur-slow) ease,color var(--dur-slow) ease}
.mw-price--down .mw-price__amount{background:var(--leaf-soft);color:var(--leaf)}
.mw-price--up .mw-price__amount{background:var(--berry-soft);color:var(--berry)}
.mw-price__old{animation:mw-strike var(--dur-slow) var(--ease-out) both}
@keyframes mw-strike{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* ProductCard: staggered entrance + add-to-cart confirmation */
.mw-enter{animation:mw-rise var(--dur-slow) var(--ease-out) both;animation-delay:calc(var(--i, 0) * 70ms)}
@keyframes mw-rise{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
.mw-btn--done{background:var(--leaf);color:var(--on-leaf)}
.mw-btn__check{display:inline-block;animation:mw-pop var(--dur-slow) var(--ease-spring)}
.mw-card--added .mw-card__media::after{content:"";position:absolute;inset:0;background:var(--leaf);opacity:0;animation:mw-glow 700ms var(--ease-out)}
@keyframes mw-glow{0%{opacity:.18}100%{opacity:0}}
.mw-card--added .mw-card__media img{animation:mw-bounce 600ms var(--ease-spring)}
@keyframes mw-bounce{0%{transform:scale(1)}35%{transform:scale(.9)}100%{transform:scale(1)}}

/* Loader: three leaves sprout in turn (the logo motif) */
.mw-loader{display:inline-flex;flex-direction:column;align-items:center;gap:var(--space-2);font-family:var(--font-sans);color:var(--ink-muted);font-size:13px;line-height:22px}
.mw-loader svg{overflow:visible}
.mw-loader__leaf{fill:var(--leaf);transform-box:fill-box;transform-origin:50% 100%;animation:mw-sprout 1.4s var(--ease-spring) infinite}
.mw-loader__leaf:nth-child(2){animation-delay:.15s}
.mw-loader__leaf:nth-child(3){animation-delay:.3s;fill:var(--citrus)}
@keyframes mw-sprout{0%,100%{transform:scale(.55);opacity:.4}40%,60%{transform:scale(1);opacity:1}}

/* Skeleton shimmer while data loads */
.mw-skel{position:relative;overflow:hidden;background:var(--fill-secondary);border-radius:var(--radius-sm)}
.mw-skel::after{content:"";position:absolute;inset:0;transform:translateX(100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);animation:mw-shimmer 1.4s var(--ease-in-out) infinite}
[data-theme="dark"] .mw-skel::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.07),transparent)}
@keyframes mw-shimmer{to{transform:translateX(-100%)}}
.mw-skel-card{background:var(--surface-raised);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden}
.mw-skel-card__media{aspect-ratio:4/3;border-radius:0}
.mw-skel-card__body{padding:var(--space-3) var(--space-4) var(--space-4);display:flex;flex-direction:column;gap:var(--space-2)}


/* ===== Effects ===== */
/* Glass: frosted translucent material with a hairline highlight */
.mw-glass{background:var(--material-bar);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);box-shadow:inset 0 0.5px 0 rgba(255,255,255,.7),inset 0 0 0 0.5px rgba(26,31,26,.08),var(--shadow-sm)}
[data-theme="dark"] .mw-glass{box-shadow:inset 0 0.5px 0 rgba(255,255,255,.12),inset 0 0 0 0.5px rgba(255,255,255,.06),var(--shadow-sm)}
.mw-bar{font-family:var(--font-sans);position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:var(--space-3);min-height:52px;padding:0 var(--space-4);color:var(--ink)}
.mw-bar--float{margin:var(--space-3);border-radius:var(--radius-lg)}
.mw-bar__logo{height:28px;width:auto;display:block}
.mw-bar__title{margin:0;font-size:17px;line-height:28px;font-weight:600;flex:1}
.mw-bar__actions{display:flex;gap:var(--space-2);align-items:center}

/* Spotlight: a soft leaf glow follows the pointer */
.mw-fx-spot{position:relative;isolation:isolate}
.mw-fx-spot::before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:2;pointer-events:none;opacity:0;transition:opacity var(--dur-base) ease;background:radial-gradient(220px circle at var(--mx,50%) var(--my,50%),rgba(77,179,111,.16),transparent 70%)}
.mw-fx-spot:hover::before,.mw-fx-spot.is-fx::before{opacity:1}
.mw-fx-spot::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:3;pointer-events:none;opacity:0;transition:opacity var(--dur-base) ease;padding:1px;background:radial-gradient(160px circle at var(--mx,50%) var(--my,50%),var(--leaf),transparent 70%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.mw-fx-spot:hover::after,.mw-fx-spot.is-fx::after{opacity:.7}

/* Tilt: Apple-TV-style parallax with a moving sheen */
.mw-fx-tilt{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--lift,0px));transition:transform var(--dur-slow) var(--ease-spring),box-shadow var(--dur-base) ease;will-change:transform}
.mw-fx-tilt.is-fx{transition:transform 80ms linear,box-shadow var(--dur-base) ease;--lift:-4px;box-shadow:var(--shadow-lg)}
.mw-fx-tilt .mw-card__media::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity var(--dur-base) ease;background:linear-gradient(calc(var(--sheen,120deg)),rgba(255,255,255,0) 30%,rgba(255,255,255,.45) 50%,rgba(255,255,255,0) 70%)}
.mw-fx-tilt.is-fx .mw-card__media::before{opacity:1}
.mw-fx-tilt.is-fx .mw-card__media img{transform:translate(calc(var(--px,0) * -6px),calc(var(--py,0) * -6px)) scale(1.06)}

/* Leaf confetti (Miwa.celebrate) */
.mw-confetti{position:fixed;inset:0;pointer-events:none;z-index:9999;overflow:hidden}
.mw-confetti svg{position:absolute;left:0;top:0;will-change:transform,opacity}

/* Shake for errors (Miwa.shake) */
.mw-shake{animation:mw-shake 420ms var(--ease-out)}
@keyframes mw-shake{0%,100%{transform:none}20%{transform:translateX(-6px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}

@media (prefers-reduced-motion: reduce){.mw-fx-tilt,.mw-fx-tilt.is-fx{transform:none!important}.mw-fx-tilt.is-fx .mw-card__media img{transform:none!important}}


/* ===================== ERP components ===================== */
/* Form fields */
.mw-field{font-family:var(--font-sans);display:flex;flex-direction:column;gap:var(--space-1);min-width:0}
.mw-field__label{font-size:15px;line-height:24px;font-weight:500;color:var(--ink)}
.mw-field__req{color:var(--berry);margin-inline-start:2px}
.mw-input,.mw-select{font-family:var(--font-sans);font-size:17px;line-height:28px;min-height:var(--tap-min);width:100%;padding:0 var(--space-3);border-radius:var(--radius-sm);border:0;background:var(--fill-secondary);color:var(--ink);transition:box-shadow var(--dur-fast) ease,background-color var(--dur-fast) ease}
.mw-input::placeholder{color:var(--ink-muted)}
textarea.mw-input{padding:var(--space-2) var(--space-3);min-height:96px;resize:vertical}
.mw-input:focus,.mw-select:focus{outline:none;background:var(--surface-raised);box-shadow:0 0 0 2px var(--surface),0 0 0 4px var(--focus-ring)}
.mw-input--num{text-align:end;font-feature-settings:"tnum";direction:ltr}
.mw-input-wrap{position:relative;display:flex;align-items:center}
.mw-input-wrap .mw-input{padding-inline-end:56px}
.mw-input-wrap__suffix{position:absolute;inset-inline-end:var(--space-3);font-size:13px;line-height:22px;color:var(--ink-muted);pointer-events:none}
.mw-select{appearance:none;-webkit-appearance:none;padding-inline-end:36px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235d665b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 12px center}
.mw-field__msg{font-size:13px;line-height:22px;color:var(--ink-muted)}
.mw-field--error .mw-input,.mw-field--error .mw-select{box-shadow:0 0 0 2px var(--berry)}
.mw-field--error .mw-field__msg{color:var(--berry)}
.mw-form{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--space-4)}

/* Switch (Apple-style) and checkbox */
.mw-switch{font-family:var(--font-sans);display:inline-flex;align-items:center;gap:var(--space-3);cursor:pointer;font-size:17px;line-height:28px;color:var(--ink);min-height:var(--tap-min)}
.mw-switch input{position:absolute;opacity:0;pointer-events:none}
.mw-switch__track{position:relative;width:51px;height:31px;border-radius:var(--radius-full);background:var(--fill-secondary);transition:background-color var(--dur-base) ease;flex:none}
.mw-switch__track::after{content:"";position:absolute;top:2px;inset-inline-start:2px;width:27px;height:27px;border-radius:var(--radius-full);background:#ffffff;box-shadow:0 3px 8px rgba(0,0,0,.15),0 1px 1px rgba(0,0,0,.16);transition:inset-inline-start var(--dur-slow) var(--ease-spring),width var(--dur-fast) ease}
.mw-switch input:checked + .mw-switch__track{background:var(--leaf)}
.mw-switch input:checked + .mw-switch__track::after{inset-inline-start:22px}
.mw-switch:active .mw-switch__track::after{width:31px}
.mw-switch input:checked:active + .mw-switch__track::after{inset-inline-start:18px}
.mw-switch input:focus-visible + .mw-switch__track{outline:2px solid var(--focus-ring);outline-offset:2px}
.mw-switch input:disabled + .mw-switch__track{opacity:.4}
.mw-check{appearance:none;-webkit-appearance:none;width:20px;height:20px;margin:0;border-radius:6px;border:1.5px solid var(--ink-muted);background:var(--surface-raised);display:inline-grid;place-content:center;cursor:pointer;transition:background-color var(--dur-fast) ease,border-color var(--dur-fast) ease;flex:none;vertical-align:middle}
.mw-check::after{content:"";width:10px;height:6px;border-left:2px solid var(--on-leaf);border-bottom:2px solid var(--on-leaf);transform:rotate(-45deg) scale(0);transform-origin:center;margin-top:-2px;transition:transform var(--dur-base) var(--ease-spring)}
.mw-check:checked,.mw-check:indeterminate{background:var(--leaf);border-color:var(--leaf)}
.mw-check:checked::after{transform:rotate(-45deg) scale(1)}
.mw-check:indeterminate::after{width:10px;height:0;border-left:0;border-bottom:2px solid var(--on-leaf);transform:none;margin:0}
.mw-check:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}

/* Data table */
.mw-table-wrap{font-family:var(--font-sans);background:var(--surface-raised);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);overflow:auto;max-width:100%}
.mw-table{width:100%;border-collapse:separate;border-spacing:0;font-size:15px;line-height:24px;color:var(--ink)}
.mw-table th{font-weight:500;font-size:13px;line-height:22px;color:var(--ink-muted);text-align:start;padding:var(--space-2) var(--space-4);border-bottom:1px solid var(--line);white-space:nowrap;position:sticky;top:0;background:var(--surface-raised);z-index:1}
.mw-table th.is-sortable{cursor:pointer;user-select:none}
.mw-table th.is-sortable:hover{color:var(--ink)}
.mw-table__sort{display:inline-block;margin-inline-start:4px;opacity:.35;transition:transform var(--dur-base) var(--ease-spring),opacity var(--dur-fast)}
.mw-table th[aria-sort="ascending"] .mw-table__sort,.mw-table th[aria-sort="descending"] .mw-table__sort{opacity:1;color:var(--leaf)}
.mw-table th[aria-sort="descending"] .mw-table__sort{transform:rotate(180deg)}
.mw-table td{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--line);vertical-align:middle}
.mw-table tbody tr:last-child td{border-bottom:0}
.mw-table tbody tr{transition:background-color var(--dur-fast) ease}
.mw-table tbody tr:hover{background:var(--surface-grouped)}
.mw-table tbody tr.is-selected{background:var(--leaf-soft)}
.mw-table .num{text-align:end;font-feature-settings:"tnum";white-space:nowrap}
.mw-table .sel{width:44px;padding-inline-end:0}
.mw-table tfoot td{font-weight:700;border-top:1px solid var(--line);border-bottom:0;background:var(--surface-grouped)}
.mw-table--compact td{padding-top:var(--space-2);padding-bottom:var(--space-2)}
.mw-table__bar{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--leaf-soft);color:var(--leaf);font-size:15px;line-height:24px;font-weight:600;animation:mw-rise var(--dur-base) var(--ease-out)}
.mw-table__bar .mw-btn{margin-inline-start:auto}
.mw-table__bar[hidden]{display:none}

/* Stat tile (KPI) */
.mw-stat{overflow:hidden;font-family:var(--font-sans);background:var(--surface-raised);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-1);color:var(--ink);min-width:0}
.mw-stat__label{font-size:13px;line-height:22px;color:var(--ink-muted);display:flex;align-items:center;gap:var(--space-1)}
.mw-stat__label img,.mw-stat__label svg{width:18px;height:18px}
.mw-stat__row{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap;min-width:0}
.mw-stat__value{font-size:28px;line-height:40px;font-weight:700;font-feature-settings:"tnum";white-space:nowrap}
.mw-stat__unit{font-size:13px;font-weight:500;color:var(--ink-muted);margin-inline-start:4px}
.mw-stat__delta{font-size:13px;line-height:22px;font-weight:600}
.mw-stat__delta--good{color:var(--leaf)}
.mw-stat__delta--bad{color:var(--berry)}
.mw-spark{flex:none;overflow:visible}
.mw-spark path{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:400;stroke-dashoffset:400;animation:mw-draw 1s var(--ease-out) forwards}
.mw-spark--good path{stroke:var(--leaf)} .mw-spark--bad path{stroke:var(--berry)}
@keyframes mw-draw{to{stroke-dashoffset:0}}

/* Progress */
.mw-progress{font-family:var(--font-sans);display:flex;flex-direction:column;gap:var(--space-1)}
.mw-progress__head{display:flex;justify-content:space-between;font-size:13px;line-height:22px;color:var(--ink-muted)}
.mw-progress__head b{color:var(--ink);font-weight:600}
.mw-progress__track{height:8px;border-radius:var(--radius-full);background:var(--fill-secondary);overflow:hidden}
.mw-progress__fill{height:100%;border-radius:inherit;background:var(--leaf);width:var(--v,0%);transition:width 900ms var(--ease-out)}
.mw-progress--warn .mw-progress__fill{background:var(--citrus)}
.mw-progress--bad .mw-progress__fill{background:var(--berry)}

/* Tabs with sliding indicator */
.mw-tabs{font-family:var(--font-sans);position:relative;display:flex;gap:var(--space-1);border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.mw-tabs__tab{position:relative;border:0;background:transparent;font:inherit;font-size:15px;line-height:24px;font-weight:500;color:var(--ink-muted);padding:var(--space-3) var(--space-3);cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:var(--space-1);transition:color var(--dur-base) ease}
.mw-tabs__tab:hover{color:var(--ink)}
.mw-tabs__tab[aria-selected="true"]{color:var(--leaf);font-weight:600}
.mw-tabs__tab:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;border-radius:var(--radius-sm)}
.mw-tabs__count{font-size:12px;line-height:18px;padding:0 6px;border-radius:var(--radius-full);background:var(--fill-secondary);color:var(--ink)}
.mw-tabs__ink{position:absolute;bottom:-1px;height:2px;border-radius:2px;background:var(--leaf);transition:left var(--dur-slow) var(--ease-spring),width var(--dur-slow) var(--ease-spring)}

/* Sidebar navigation */
.mw-side{font-family:var(--font-sans);display:flex;flex-direction:column;gap:var(--space-1);width:248px;padding:var(--space-4) var(--space-3);background:var(--surface-grouped);border-inline-start:1px solid var(--line);height:100%;transition:width var(--dur-slow) var(--ease-spring);overflow:hidden}
.mw-side__brand{display:flex;align-items:center;gap:var(--space-2);padding:0 var(--space-2) var(--space-4);font-size:17px;line-height:28px;font-weight:700;color:var(--ink);white-space:nowrap}
.mw-side__brand img{height:32px;width:auto;flex:none}
.mw-side__section{font-size:12px;line-height:20px;font-weight:600;color:var(--ink-muted);padding:var(--space-3) var(--space-3) var(--space-1);white-space:nowrap}
.mw-side__item{position:relative;display:flex;align-items:center;gap:var(--space-3);min-height:40px;padding:0 var(--space-3);border-radius:var(--radius-sm);color:var(--ink);text-decoration:none;font-size:15px;line-height:24px;font-weight:500;white-space:nowrap;cursor:pointer;border:0;background:transparent;width:100%;text-align:start;transition:background-color var(--dur-fast) ease,color var(--dur-fast) ease}
.mw-side__item img,.mw-side__item svg{width:22px;height:22px;flex:none;opacity:.8}
.mw-side__item:hover{background:var(--fill-secondary)}
.mw-side__item[aria-current="page"]{background:var(--leaf-soft);color:var(--leaf);font-weight:600}
.mw-side__item[aria-current="page"] img,.mw-side__item[aria-current="page"] svg{opacity:1}
.mw-side__item:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px}
.mw-side__badge{margin-inline-start:auto;font-size:12px;line-height:18px;min-width:20px;text-align:center;padding:0 6px;border-radius:var(--radius-full);background:var(--berry);color:var(--on-leaf);font-weight:600}
.mw-side--collapsed{width:68px}
.mw-side--collapsed .mw-side__label,.mw-side--collapsed .mw-side__section,.mw-side--collapsed .mw-side__badge,.mw-side--collapsed .mw-side__brand span{opacity:0;pointer-events:none}
.mw-side__label,.mw-side__section,.mw-side__brand span{transition:opacity var(--dur-base) ease}
.mw-layout{display:flex;min-height:100vh}
.mw-layout__main{flex:1;min-width:0}

/* Alert banner */
.mw-alert{font-family:var(--font-sans);display:flex;gap:var(--space-3);align-items:flex-start;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-size:15px;line-height:24px;color:var(--ink)}
.mw-alert__icon{flex:none;width:22px;height:22px;margin-top:1px}
.mw-alert__title{font-weight:600;display:block}
.mw-alert__body{flex:1}
.mw-alert--info{background:var(--fill-secondary)}
.mw-alert--success{background:var(--leaf-soft)} .mw-alert--success .mw-alert__title{color:var(--leaf)}
.mw-alert--warning{background:rgba(228,128,13,.14)} .mw-alert--warning .mw-alert__icon{color:var(--citrus)}
.mw-alert--error{background:var(--berry-soft)} .mw-alert--error .mw-alert__title{color:var(--berry)}

/* Toast */
.mw-toasts{position:fixed;bottom:var(--space-6);left:50%;transform:translateX(-50%);display:flex;flex-direction:column;gap:var(--space-2);align-items:center;z-index:9000;pointer-events:none}
.mw-toast{font-family:var(--font-sans);pointer-events:auto;display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);min-height:var(--tap-min);border-radius:var(--radius-full);background:var(--ink);color:var(--surface);font-size:15px;line-height:24px;font-weight:500;box-shadow:var(--shadow-lg);animation:mw-toast-in var(--dur-slow) var(--ease-spring)}
.mw-toast.is-leaving{animation:mw-toast-out var(--dur-base) var(--ease-out) forwards}
.mw-toast__dot{width:8px;height:8px;border-radius:var(--radius-full);background:var(--leaf);flex:none}
.mw-toast--error .mw-toast__dot{background:var(--berry)}
.mw-toast--warning .mw-toast__dot{background:var(--citrus)}
.mw-toast__action{border:0;background:transparent;color:inherit;font:inherit;font-weight:700;cursor:pointer;padding:0 0 0 0;margin-inline-start:var(--space-2);text-decoration:underline;text-underline-offset:3px}
@keyframes mw-toast-in{from{opacity:0;transform:translateY(24px) scale(.9)}to{opacity:1;transform:none}}
@keyframes mw-toast-out{to{opacity:0;transform:translateY(12px) scale(.96)}}

/* Dialog / sheet */
.mw-dialog{font-family:var(--font-sans);border:0;padding:0;border-radius:var(--radius-lg);background:var(--surface-raised);color:var(--ink);box-shadow:var(--shadow-lg);width:min(480px,calc(100vw - 32px));max-height:calc(100vh - 64px)}
.mw-dialog[open]{animation:mw-dialog-in var(--dur-slow) var(--ease-spring)}
.mw-dialog::backdrop{background:rgba(10,12,10,.35);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:mw-fade var(--dur-base) ease}
.mw-dialog__head{padding:var(--space-5) var(--space-5) 0;display:flex;align-items:center;gap:var(--space-3)}
.mw-dialog__title{margin:0;font-size:20px;line-height:30px;font-weight:600;flex:1}
.mw-dialog__close{border:0;background:var(--fill-secondary);color:var(--ink-muted);width:30px;height:30px;border-radius:var(--radius-full);cursor:pointer;display:grid;place-items:center;font-size:18px;line-height:1}
.mw-dialog__body{padding:var(--space-3) var(--space-5) var(--space-5);font-size:17px;line-height:28px}
.mw-dialog__foot{display:flex;gap:var(--space-2);padding:0 var(--space-5) var(--space-5);justify-content:flex-start}
.mw-dialog__foot .mw-btn{flex:1}
@keyframes mw-dialog-in{from{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:none}}
@keyframes mw-fade{from{opacity:0}}

/* Empty state */
.mw-empty{font-family:var(--font-sans);display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-2);padding:var(--space-8) var(--space-5);color:var(--ink)}
.mw-empty__art{width:72px;height:72px;border-radius:var(--radius-full);background:var(--leaf-soft);display:grid;place-items:center;margin-bottom:var(--space-2);animation:mw-float 3s var(--ease-in-out) infinite}
.mw-empty__art img{width:36px;height:36px}
.mw-empty__title{margin:0;font-size:17px;line-height:28px;font-weight:600}
.mw-empty__text{margin:0 0 var(--space-2);font-size:15px;line-height:24px;color:var(--ink-muted);max-width:320px}
@keyframes mw-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}

/* Pagination */
.mw-pager{font-family:var(--font-sans);display:flex;align-items:center;gap:var(--space-1);flex-wrap:wrap}
.mw-pager__btn{min-width:36px;height:36px;padding:0 var(--space-2);border:0;border-radius:var(--radius-sm);background:transparent;color:var(--ink);font:inherit;font-size:15px;font-weight:500;cursor:pointer;font-feature-settings:"tnum";transition:background-color var(--dur-fast) ease}
.mw-pager__btn:hover:not([disabled]){background:var(--fill-secondary)}
.mw-pager__btn[aria-current="page"]{background:var(--leaf);color:var(--on-leaf);font-weight:700}
.mw-pager__btn[disabled]{opacity:.35;cursor:default}
.mw-pager__btn:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}
.mw-pager__info{font-size:13px;line-height:22px;color:var(--ink-muted);margin-inline-end:var(--space-3)}

.mw-flip{transform:scaleX(-1)}
.mw-pager__btn .mw-icon{vertical-align:middle}
/* Filter chips */
.mw-chips{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.mw-chip{font-family:var(--font-sans);display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 var(--space-3);border-radius:var(--radius-full);border:0;background:var(--fill-secondary);color:var(--ink);font-size:13px;line-height:22px;font-weight:500;cursor:pointer;transition:background-color var(--dur-fast) ease,color var(--dur-fast) ease,transform var(--dur-fast) var(--ease-spring)}
.mw-chip:active{transform:scale(.95)}
.mw-chip[aria-pressed="true"]{background:var(--leaf);color:var(--on-leaf)}
.mw-chip__x{font-size:15px;line-height:1;opacity:.7}
.mw-chip:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}



/* ===================== App shell (panel) ===================== */
/* Workflow status badges */
.mw-badge--pending{background:var(--warn-soft);color:var(--warn)}
.mw-badge--info{background:var(--info-soft);color:var(--info)}
.mw-badge--progress{background:var(--progress-soft);color:var(--progress)}
.mw-badge--success{background:var(--leaf-soft);color:var(--leaf)}
.mw-badge--danger{background:var(--berry-soft);color:var(--berry)}
.mw-badge--pending .mw-badge__dot,.mw-badge--progress .mw-badge__dot,.mw-badge--info .mw-badge__dot{animation:none}

/* Footer: version + product line */
.mw-footer{direction:ltr;font-family:var(--font-sans);display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:var(--space-2);padding:var(--space-3) var(--space-4) var(--space-4);border-top:1px solid var(--line);background:var(--surface-grouped);color:var(--ink-muted);font-size:12px;line-height:20px;text-align:center}
.mw-footer__ver{direction:ltr;unicode-bidi:isolate;font-weight:600;font-feature-settings:"tnum";padding:0 8px;border-radius:var(--radius-full);background:var(--fill-secondary);color:var(--ink)}
.mw-footer__text{direction:ltr;unicode-bidi:isolate}
.mw-footer__by{direction:ltr;unicode-bidi:isolate;color:var(--ink)}
@media (max-width: 800px){.mw-footer{padding-bottom:calc(72px + env(safe-area-inset-bottom))}}

/* User box (name, role, logout) */
.mw-userbox{font-family:var(--font-sans);display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);background:var(--surface-raised);box-shadow:var(--shadow-sm);color:var(--ink)}
.mw-userbox__avatar{width:36px;height:36px;border-radius:var(--radius-full);background:var(--leaf-soft);color:var(--leaf);display:grid;place-items:center;font-weight:700;font-size:15px;flex:none}
.mw-userbox__who{display:flex;flex-direction:column;min-width:0;line-height:1.35}
.mw-userbox__who strong{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mw-userbox__who span{font-size:11.5px;color:var(--ink-muted)}
.mw-userbox__out{margin-inline-start:auto;display:inline-flex;align-items:center;gap:4px;min-height:32px;padding:0 var(--space-2);border-radius:var(--radius-sm);color:var(--berry);background:var(--berry-soft);font-size:12px;font-weight:600;text-decoration:none;border:0;cursor:pointer;font-family:inherit}
.mw-userbox__out .mw-icon{width:16px;height:16px}

/* Back to top */
.mw-totop{position:fixed;left:var(--space-4);bottom:var(--space-6);z-index:32;width:var(--tap-min);height:var(--tap-min);border-radius:var(--radius-full);border:0;background:var(--surface-raised);color:var(--leaf);box-shadow:var(--shadow-md);display:grid;place-items:center;cursor:pointer;opacity:0;pointer-events:none;transform:translateY(8px) scale(.9);transition:opacity var(--dur-base) ease,transform var(--dur-slow) var(--ease-spring)}
.mw-totop.is-shown{opacity:1;pointer-events:auto;transform:none}
.mw-totop:active{transform:scale(.9)}
@media (max-width: 800px){.mw-totop{bottom:calc(76px + env(safe-area-inset-bottom))}}

/* Sidebar accordion groups + "coming soon" items */
.mw-side__group{display:flex;flex-direction:column}
.mw-side__head{position:relative;display:flex;align-items:center;gap:var(--space-3);min-height:40px;padding:0 var(--space-3);border-radius:var(--radius-sm);border:0;background:transparent;color:var(--ink);font:inherit;font-size:15px;line-height:24px;font-weight:500;cursor:pointer;width:100%;text-align:start;white-space:nowrap;transition:background-color var(--dur-fast) ease}
.mw-side__head:hover{background:var(--fill-secondary)}
.mw-side__head svg{width:22px;height:22px;flex:none;opacity:.8}
.mw-side__head.is-active{font-weight:700}
.mw-side__head.is-active svg{opacity:1;color:var(--leaf)}
.mw-side__chev{margin-inline-start:auto;width:18px!important;height:18px!important;opacity:.5!important;transition:transform var(--dur-slow) var(--ease-spring)}
.mw-side__group.is-open .mw-side__chev{transform:rotate(180deg)}
.mw-side__sub{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--dur-slow) var(--ease-out)}
.mw-side__group.is-open .mw-side__sub{grid-template-rows:1fr}
.mw-side__subinner{overflow:hidden;display:flex;flex-direction:column;gap:2px;position:relative;padding-inline-start:var(--space-5)}
.mw-side__subinner::before{content:"";position:absolute;top:4px;bottom:12px;inset-inline-start:22px;width:1.5px;border-radius:2px;background:var(--line)}
.mw-side__subinner .mw-side__item{min-height:36px;font-size:14px;padding-inline-start:var(--space-4)}
.mw-side__subinner .mw-side__item svg{width:18px;height:18px}
.mw-side__soon{opacity:.55;cursor:default}
.mw-side__soon:hover{background:transparent}
.mw-side__soon-tag{margin-inline-start:auto;font-size:10.5px;line-height:18px;font-weight:600;padding:0 7px;border-radius:var(--radius-full);background:var(--fill-secondary);color:var(--ink-muted)}
.mw-side--collapsed .mw-side__chev,.mw-side--collapsed .mw-side__soon-tag,.mw-side--collapsed .mw-side__subinner{display:none}
.mw-side__foot{margin-top:auto;padding-top:var(--space-3)}

/* ===================== Mobile & touch ===================== */
/* Bottom tab bar (phones): glass, safe-area aware */
.mw-tabbar{display:none}
.mw-tabbar__item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:var(--tap-min);padding:6px 0 4px;border:0;background:transparent;color:var(--ink-muted);font:inherit;font-size:11px;line-height:14px;font-weight:500;text-decoration:none;cursor:pointer;position:relative;-webkit-tap-highlight-color:transparent;transition:color var(--dur-fast) ease}
.mw-tabbar__item>span:not(.mw-tabbar__badge){max-width:100%;padding:0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mw-tabbar__item svg,.mw-tabbar__item img{width:26px;height:26px;transition:transform var(--dur-base) var(--ease-spring)}
.mw-tabbar__item[aria-current="page"]{color:var(--leaf);font-weight:600}
.mw-tabbar__item:active svg{transform:scale(.88)}
.mw-tabbar__badge{position:absolute;top:2px;inset-inline-end:calc(50% - 22px);min-width:18px;height:18px;padding:0 5px;border-radius:var(--radius-full);background:var(--berry);color:var(--on-leaf);font-size:11px;line-height:18px;font-weight:700;text-align:center}
.mw-drawer-backdrop{display:none}
.mw-menu-btn{display:none}

@media (max-width: 800px){
  .mw-tabbar{font-family:var(--font-sans);display:flex;position:fixed;inset-inline:0;bottom:0;z-index:30;padding:0 var(--space-2) env(safe-area-inset-bottom);background:var(--material-bar);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);box-shadow:inset 0 0.5px 0 var(--line)}
  body.mw,.mw-layout__main{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  /* Sidebar becomes a drawer, closed by default */
  .mw-layout>.mw-side{position:fixed;top:0;bottom:0;inset-inline-start:0;height:100%;width:min(300px,84vw);z-index:40;box-shadow:var(--shadow-lg);transform:translateX(105%);transition:transform var(--dur-slow) var(--ease-out);padding-top:calc(var(--space-4) + env(safe-area-inset-top))}
  [dir="ltr"] .mw-layout>.mw-side{transform:translateX(-105%)}
  .mw-layout>.mw-side.is-open{transform:none}
  .mw-layout>.mw-side.mw-side--collapsed{width:min(300px,84vw)}
  .mw-side--collapsed .mw-side__label,.mw-side--collapsed .mw-side__section,.mw-side--collapsed .mw-side__badge,.mw-side--collapsed .mw-side__brand span{opacity:1;pointer-events:auto}
  .mw-side [data-mw-side-toggle]{display:none}
  .mw-drawer-backdrop{display:block;position:fixed;inset:0;z-index:35;background:rgba(10,12,10,.35);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:opacity var(--dur-base) ease}
  .mw-drawer-backdrop.is-open{opacity:1;pointer-events:auto}
  .mw-menu-btn{display:inline-grid;place-items:center;width:var(--tap-min);height:var(--tap-min);margin-inline-start:calc(var(--space-2) * -1);border:0;background:transparent;color:var(--ink);border-radius:var(--radius-full);cursor:pointer}
  /* Page & bar */
  .mw-page{padding:var(--space-4)}
  .mw-bar{min-height:48px;padding:0 var(--space-3);gap:var(--space-2)}
  .mw-bar--float{margin:var(--space-2) var(--space-2) 0;border-radius:var(--radius-md);top:var(--space-2)}
  .mw-bar__title{font-size:17px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mw-bar__actions .mw-btn__label{display:none}
  .mw-section{margin-top:var(--space-6)}
  .large-title{font-size:28px;line-height:40px}
  /* KPI tiles: two per row, spark under the number */
  .mw-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}
  .mw-stat{padding:var(--space-3)}
  .mw-stat__value{font-size:20px;line-height:30px}
  .mw-stat__row{flex-direction:column;align-items:stretch;gap:var(--space-1)}
  .mw-stat .mw-spark{width:100%;height:24px}
  .mw-stat__delta{font-size:12px;line-height:18px}
  .mw-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}
  .mw-card__body{padding:var(--space-2) var(--space-3) var(--space-3)}
  .mw-card__name{font-size:15px;line-height:24px}
  .mw-card__foot{flex-direction:column;align-items:stretch}
  .mw-card__foot .mw-btn{width:100%;min-height:36px}
  .mw-form{grid-template-columns:1fr!important}
  .mw-toolbar{flex-direction:column;align-items:stretch}
  .mw-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 calc(var(--space-4) * -1);padding:0 var(--space-4)}
  .mw-chip{flex:none}
  .mw-pager{justify-content:center;gap:2px}
  .mw-pager__info:first-child{width:100%;text-align:center;margin:0 0 var(--space-1)}
  /* Dialog becomes a bottom sheet */
  .mw-dialog{width:100%;max-width:100%;margin:auto 0 0;border-radius:var(--radius-lg) var(--radius-lg) 0 0;padding-bottom:env(safe-area-inset-bottom);max-height:88vh}
  .mw-dialog[open]{animation:mw-sheet-in var(--dur-slow) var(--ease-out)}
  .mw-dialog__head::before{content:"";position:absolute;top:8px;left:50%;width:36px;height:5px;margin-left:-18px;border-radius:var(--radius-full);background:var(--line)}
  .mw-dialog__head{position:relative;padding-top:var(--space-6)}
  .mw-dialog__foot{flex-direction:column-reverse}
  .mw-toasts{bottom:calc(76px + env(safe-area-inset-bottom));width:calc(100% - 32px)}
  .mw-toast{max-width:100%}
}
@keyframes mw-sheet-in{from{transform:translateY(100%)}to{transform:none}}

/* Tables become cards on narrow screens (labels come from the header) */
@media (max-width: 640px){
  .mw-table-wrap{background:transparent;box-shadow:none;overflow:visible}
  .mw-table:not(.mw-table--scroll) thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .mw-table:not(.mw-table--scroll),.mw-table:not(.mw-table--scroll) tbody,.mw-table:not(.mw-table--scroll) tfoot{display:block}
  .mw-table:not(.mw-table--scroll) tr{display:grid;grid-template-columns:auto 1fr;gap:2px var(--space-3);background:var(--surface-raised);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-2);position:relative}
  .mw-table:not(.mw-table--scroll) tbody tr:hover{background:var(--surface-raised)}
  .mw-table:not(.mw-table--scroll) tbody tr.is-selected{background:var(--leaf-soft)}
  .mw-table:not(.mw-table--scroll) td{display:contents;border:0}
  .mw-table:not(.mw-table--scroll) td::before{content:attr(data-label);font-size:13px;line-height:24px;color:var(--ink-muted)}
  .mw-table:not(.mw-table--scroll) td>*,.mw-table:not(.mw-table--scroll) td{text-align:end}
  .mw-table:not(.mw-table--scroll) td.sel::before{content:none}
  .mw-table:not(.mw-table--scroll) td.sel .mw-check{position:absolute;top:var(--space-3);inset-inline-end:var(--space-3)}
  .mw-table:not(.mw-table--scroll) td[data-label=""]::before{content:none}
  .mw-table:not(.mw-table--scroll) tfoot tr{background:var(--surface-grouped);box-shadow:none}
  .mw-table:not(.mw-table--scroll) tfoot td:empty{display:none}
  .mw-table__bar{border-radius:var(--radius-md);margin-bottom:var(--space-2)}
}

/* Touch devices: no hover-only effects, bigger hit areas */
@media (hover: none){
  .mw-card:hover{transform:none;box-shadow:var(--shadow-sm)}
  .mw-card:hover .mw-card__media img:not(.mw-card__ph){transform:none}
  .mw-fx-spot::before,.mw-fx-spot::after{display:none}
  .mw-fx-tilt,.mw-fx-tilt.is-fx{transform:none!important;box-shadow:var(--shadow-sm)}
  .mw-fx-tilt .mw-card__media::before{display:none}
  .mw-table tbody tr:hover{background:inherit}
  .mw-btn--sm{min-height:36px}
  .mw-pager__btn{min-width:40px;height:40px;padding:0 4px}
  .mw-seg__item{min-height:36px}
}

/* Respect the user's reduced-motion setting */
@media (prefers-reduced-motion: reduce){
  [class*="mw-"],[class*="mw-"]::after{animation-duration:1ms!important;animation-iteration-count:1!important;animation-delay:0ms!important;transition-duration:1ms!important}
  .mw-card:hover{transform:none}
}