/* V88_24_6: a shared, low-motion presentation layer. Screen only; print is untouched. */
:root{--ux-fast:140ms;--ux-normal:220ms;--ux-slow:300ms;--ux-ease:cubic-bezier(.2,.7,.2,1)}
@media screen{
 .portal-page .transition-all,.portal-page .premium-input,.portal-page .sub-nav-btn,.portal-page .btn-solid-red,.portal-page .drop-zone,.portal-page .step-circle{transition-property:color,background-color,border-color,opacity,transform,box-shadow;transition-duration:var(--ux-normal);transition-timing-function:var(--ux-ease)}
 body.portal-page{transition:none!important}
 .portal-page .app-shell-enter{animation:ux-enter var(--ux-slow) var(--ux-ease) both;will-change:auto}
 .portal-page [data-portal-header],.portal-page [data-portal-header] *{animation:none!important;will-change:auto}
 .portal-page .kpi-card,.portal-page .accelerated-section,.portal-page .tab-section,.portal-page .glass-lock-overlay{will-change:auto}
 .portal-page .shimmer-bg{background:#e8edf3;animation:ux-breathe 1.8s ease-in-out 3}
 .portal-page .animate-pulse{animation:ux-breathe 1.8s ease-in-out 3}
 .portal-page dialog[open]{animation:ux-dialog var(--ux-normal) var(--ux-ease)}
 .portal-page dialog::backdrop{animation:ux-fade var(--ux-fast) ease-out}
 .portal-page :is(#recipeModalPanel,#itemModalPanel,#statusModalPanel){transition-property:opacity,transform;transition-duration:var(--ux-normal);transition-timing-function:var(--ux-ease);will-change:auto}
 .portal-page button{touch-action:manipulation}
 .portal-page button:disabled{cursor:not-allowed}
 .portal-page button[aria-busy=true]{opacity:.65;cursor:progress}
 .portal-page :is(summary,button,a,input,select,textarea):focus-visible{outline:3px solid #b7000c;outline-offset:3px}
 .ux-sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .ux-skip{position:fixed;left:16px;top:12px;clip-path:inset(50%);width:1px;height:1px;overflow:hidden;z-index:100010;background:#172033;color:white;padding:12px 20px;border-radius:10px}.ux-skip:focus{clip-path:none;width:auto;height:auto}
 .ux-button{border:1px solid #cbd5e1;border-radius:10px;padding:10px 16px;min-height:44px;background:white;color:#172033;font-size:13px;font-weight:650;cursor:pointer}
 .ux-button:hover:not(:disabled){background:#f6f8fb}
 .ux-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:20px 0}
 .ux-stat{border:1px solid #e2e8f0;border-radius:16px;background:#fafbfc;padding:20px;min-width:0}
 .ux-stat-label{font-size:12px;font-weight:600;color:#526174;margin:0 0 12px}.ux-stat-value{display:block;font-size:clamp(24px,2.8vw,34px);font-weight:800;letter-spacing:-.045em;line-height:1.2;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
 .ux-stat-note{color:#64748b;font-size:11px;margin:10px 0 0;line-height:1.6}.ux-stat-attention{border-color:#f4d5a6;background:#fffbf4}.ux-stat-attention .ux-stat-value{color:#946000}.ux-stat-ok .ux-stat-value{color:#146c43}
 .ux-section-title{font-size:16px;font-weight:750;margin:24px 0 8px}.ux-muted{font-size:12px;color:#64748b;line-height:1.6}.ux-chips{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
 .ux-chip,.ux-status{display:inline-flex;align-items:center;border-radius:8px;border:1px solid #dce3eb;background:#f6f8fb;color:#475569;font-size:11px;font-weight:650;padding:5px 9px;gap:6px}
 .ux-status[data-status=SHIPPED],.ux-status[data-status=COMPLETED]{color:#146c43;background:#edf8f1;border-color:#cce8d6}.ux-status[data-status=CANCELED]{color:#64748b}.ux-status[data-status=PENDING]{color:#946000;background:#fffbef;border-color:#ecdbae}
 .ux-skeleton{display:grid;gap:12px;padding:24px;min-height:168px}.ux-skeleton-line{height:24px;background:#e8edf3;border-radius:8px;animation:ux-breathe 1.8s ease-in-out 3}.ux-skeleton-line:nth-child(3){width:75%}.ux-skeleton-line:last-child{width:50%}
 .ux-empty{text-align:center;border:1px dashed #cbd5e1;border-radius:16px;padding:28px 20px;margin:16px 0;min-height:160px}.ux-empty-icon{display:block;color:#94a3b8;font-size:28px}.ux-empty h3{font-size:15px;font-weight:750;margin:8px}.ux-empty p{font-size:13px;color:#64748b;max-width:560px;margin:10px auto;line-height:1.7;overflow-wrap:anywhere}
 .ux-sync{border:1px solid #dae5df;border-radius:14px;background:#f5faf7;padding:14px 16px;margin:0 0 20px;font-size:12px;color:#475569;overflow-wrap:anywhere}.ux-sync[hidden]{display:none!important}.ux-sync-head{display:flex;align-items:center;gap:8px;color:#263b30}.ux-sync-dot{width:8px;height:8px;background:#35825a;border-radius:50%;flex-shrink:0}.ux-sync p{margin:6px 0;line-height:1.65}.ux-sync[data-state=waiting],.ux-sync[data-state=attention]{background:#fffbf3;border-color:#ecd9b7}.ux-sync[data-state=attention] .ux-sync-dot,.ux-sync[data-state=waiting] .ux-sync-dot{background:#ad750a}.ux-sync summary{cursor:pointer;min-height:44px;display:flex;align-items:center;text-decoration:underline;text-underline-offset:3px}.ux-queue-row{padding:12px 0;border-top:1px solid #e5ddce;display:grid;gap:6px}.ux-sync .ux-button{margin-top:8px}
 .ux-table-scroll{overflow:auto;max-height:460px;overscroll-behavior:contain;scrollbar-gutter:stable}
 .ux-data-table{width:100%;min-width:650px;border-collapse:separate;border-spacing:0;text-align:left}
 .ux-data-table th{position:sticky;top:0;z-index:2;background:#f6f8fb;padding:12px;font-size:11px}
 .ux-data-table :is(th,td):first-child{position:sticky;left:0;background:#fafbfc;z-index:1;max-width:170px;overflow-wrap:anywhere}.ux-data-table th:first-child{z-index:3}
 .ux-data-table td{padding:12px;border-bottom:1px solid #edf0f4;vertical-align:top;font-size:12px;overflow-wrap:anywhere;max-width:420px;white-space:pre-wrap}.ux-data-table tbody tr:hover td{background:#f7f9fc}
 .ux-table-caption{font-size:11px;color:#64748b;padding:8px 16px}.ux-log-detail{white-space:pre-wrap;overflow-wrap:anywhere}.ux-log-detail summary{background:transparent!important;padding:4px!important;min-height:32px;font-weight:500!important}
 .portal-page .order-history-card>summary{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;cursor:pointer;padding:18px 20px;background:white}.ux-order-id{font-family:ui-monospace,monospace;font-size:11px;color:#64748b;overflow-wrap:anywhere;flex-basis:100%}.ux-order-client{font-size:15px;font-weight:750;flex:1;min-width:0}.ux-order-total{font-size:18px;font-weight:800;font-variant-numeric:tabular-nums}.ux-order-toggle{font-size:11px;color:#64748b}.order-history-card[open] .ux-order-toggle{color:#b7000c}
 .ux-stepper{list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:20px!important;margin:0!important;counter-reset:step}.ux-stepper li{position:relative;font-size:11px;color:#64748b;line-height:1.5;padding-top:32px}.ux-stepper li:before{counter-increment:step;content:counter(step);position:absolute;top:0;left:0;border:1px solid #cbd5e1;border-radius:50%;width:24px;height:24px;display:grid;place-items:center;background:white;font-weight:700;z-index:1}.ux-stepper li:not(:last-child):after{content:'';position:absolute;height:2px;background:#e2e8f0;top:11px;left:26px;right:-8px}.ux-stepper li[data-done=true]:before{background:#172033;color:white;border-color:#172033}.ux-stepper li[aria-current=step]{color:#b7000c;font-weight:750}.ux-stepper li[aria-current=step]:before{background:#e3000f;color:#fff;border-color:#e3000f}
 .ux-order-totals{display:flex;justify-content:flex-end;gap:20px;flex-wrap:wrap;padding:16px 20px;border-top:1px solid #e2e8f0;background:#fafbfc;font-size:12px}.ux-order-totals strong{display:block;font-size:16px;color:#172033;font-variant-numeric:tabular-nums}.ux-order-totals span{color:#64748b}
 .ux-stock-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:16px 0}.ux-stock-summary .ux-stat{padding:16px}.ux-stock-summary .ux-stat-value{font-size:26px}
 .ux-stock-meter{height:5px;border-radius:6px;background:#e2e8f0;overflow:hidden;margin-top:8px}.ux-stock-meter>span{display:block;height:100%;background:#b7000c;width:var(--reserved-width,0%)}
 #orderFilterQuery{flex:1;min-width:180px}
 .ux-filter-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:12px 0;font-size:12px;color:#64748b}.ux-filter-bar button{min-height:44px;border:1px solid #dce3eb;padding:8px 12px;border-radius:10px;background:white;color:#172033}.ux-filter-bar input,.ux-filter-bar select{min-height:44px;max-width:100%;border:1px solid #cbd5e1;border-radius:10px;padding:8px 12px;background:white;font-size:14px}
 .ux-sync-outside{width:calc(100% - 32px);max-width:1536px;margin:20px auto 0}
 @media(max-width:1023px){#invoiceControls{position:static;top:auto}}
 @media(max-width:900px){.ux-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
 @media(max-width:600px){.ux-stat{padding:14px}.ux-stat-value{font-size:25px}.ux-stock-summary{gap:6px}.ux-stock-summary .ux-stat{padding:12px 8px}.ux-stock-summary .ux-stat-label{font-size:10px}.ux-stock-summary .ux-stat-value{font-size:22px}.ux-stock-summary .ux-stat-note{font-size:10px}.ux-stepper{gap:5px;padding:16px!important}.ux-stepper li{font-size:10px}.ux-order-totals{justify-content:space-between;gap:12px}.portal-page .order-history-card>summary{padding:16px;gap:10px}.ux-order-client{font-size:13px}.ux-order-total{font-size:16px}.ux-stepper li:before{width:22px;height:22px}.ux-table-scroll.ux-mobile-cards{max-height:600px}.ux-mobile-cards .ux-data-table{min-width:0}.ux-mobile-cards .ux-data-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.ux-mobile-cards .ux-data-table tbody{display:block}.ux-mobile-cards .ux-data-table tr{display:block;margin:10px;border:1px solid #e2e8f0;border-radius:12px;background:white;overflow:hidden}.ux-mobile-cards .ux-data-table td{display:grid;grid-template-columns:minmax(76px,30%) minmax(0,1fr);gap:10px;position:static!important;max-width:none!important;padding:10px 12px;background:white!important}.ux-mobile-cards .ux-data-table td:before{content:attr(data-label);font-size:11px;font-weight:650;color:#64748b}.ux-mobile-cards .ux-data-table td>div{min-width:0}.ux-filter-bar{align-items:stretch}.ux-filter-bar input{width:100%}}
 @keyframes ux-enter{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
 @keyframes ux-dialog{from{opacity:0;transform:translateY(8px) scale(.99)}to{opacity:1;transform:none}}
 @keyframes ux-fade{from{opacity:0}to{opacity:1}}
 @keyframes ux-breathe{0%,100%{opacity:1}50%{opacity:.55}}
 @media(prefers-reduced-motion:reduce){.portal-page *,.portal-page *::before,.portal-page *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.portal-page .app-shell-enter,.portal-page .cinematic-enter{opacity:1!important;transform:none!important}}
}
@media print{.ux-skip,.ux-sync,.ux-filter-bar{display:none!important}}
