/* Enhanced motion experiment. All colours inherit the approved three skins. */
/* Inventory product editing uses the same native dialog surfaces as receiving. */
@media screen {
 #lunoir-app .product-editor-modal{width:min(1040px,calc(100% - 32px));height:min(820px,calc(100dvh - 64px));max-width:none;max-height:none;padding:0;border:1px solid var(--skin-line);border-radius:10px;background:var(--skin-paper);color:var(--skin-ink);overflow:hidden;box-shadow:0 24px 80px #10150e33}
 #lunoir-app .product-editor-modal[open],#lunoir-app :is(.product-editor-layout,.product-editor-layout-inner){display:flex;flex:1;min-height:0;flex-direction:column}
 #lunoir-app .product-editor-modal::backdrop{background:#14281d66;backdrop-filter:blur(2px)}
 #lunoir-app .product-editor-modal .arrival-dialog-heading{align-items:center;padding:20px 24px;border-bottom:1px solid var(--skin-line)}
 #lunoir-app .product-editor-body{padding:22px 24px;overflow:auto;min-height:0;flex:1;overscroll-behavior:contain;scrollbar-gutter:stable}
 #lunoir-app .product-editor-modal .product-editor-content>p{font-size:13px;color:var(--skin-muted);margin:0 0 14px}
 #lunoir-app .product-editor-modal .product-editor-content>.editor-card{padding:0;background:transparent;border:0;box-shadow:none;margin:0;max-width:none}
 #lunoir-app .product-editor-modal .section-heading{margin-top:20px}
 #lunoir-app .product-editor-modal .section-heading:first-of-type{margin-top:0}
 #lunoir-app .product-editor-modal .section-heading h2{font-size:15px}
 #lunoir-app .product-editor-modal .form-actions{display:none}
 #lunoir-app .product-editor-modal .arrival-dialog-footer{padding:14px 24px}
 #lunoir-app .product-editor-original{font-size:12px;margin-right:auto;color:var(--skin-muted);text-underline-offset:3px}
 #lunoir-app .product-editor-status{font-size:13px;margin:0 0 16px}
 #lunoir-app .product-editor-modal :is(input,select,textarea){max-width:100%}
 #lunoir-app .product-editor-modal .form-field{min-width:0}
 @media(max-width:600px){
  #lunoir-app .product-editor-modal{width:100%;height:100dvh;margin:0;border:0;border-radius:0}
  #lunoir-app .product-editor-modal :is(.arrival-dialog-heading,.arrival-dialog-footer){padding:14px 16px}
  #lunoir-app .product-editor-body{padding:16px}
  #lunoir-app .product-editor-modal .form-grid{grid-template-columns:minmax(0,1fr)}
 }
 @media(prefers-reduced-motion:no-preference){.product-editor-modal[open]{animation:dialog-enter .22s cubic-bezier(.2,.8,.2,1)}}
}
/* One secondary-action surface for spot and presale orders, including expanded forms. */
@media screen {
 #lunoir-app .staff-order .order-secondary-card{
  margin-top:16px;padding:0;border:1px solid var(--skin-line);border-radius:9px;
  background:var(--skin-paper);color:var(--skin-ink);overflow:hidden;min-width:0;
 }
 #lunoir-app .staff-order .order-secondary-card>summary{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 20px;min-height:52px;margin:0;list-style:none;font-size:13px;font-weight:600;color:var(--skin-ink);
 }
 #lunoir-app .order-secondary-card summary::marker,
 #lunoir-app .order-secondary-card summary::-webkit-details-marker{content:'';display:none}
 #lunoir-app .order-secondary-card>summary::after,
 #lunoir-app .order-action-disclosure>summary::after,
 #lunoir-app .order-tool-link::after{
  content:'';width:7px;height:7px;flex:0 0 7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(-45deg);opacity:.65;transition:transform .24s ease;
 }
 #lunoir-app .order-secondary-card[open]>summary::after,
 #lunoir-app .order-action-disclosure[open]>summary::after{transform:rotate(45deg)}
 #lunoir-app .order-secondary-card[open]>summary{border-bottom:1px solid var(--skin-line)}
 #lunoir-app .order-secondary-content{padding:4px 20px 8px;min-width:0}
 #lunoir-app .order-visibility-content{padding:12px 20px 16px;min-width:0;font-size:12px;line-height:1.75}
 #lunoir-app .order-visibility-content>p{margin:0 0 12px;color:var(--skin-muted);overflow-wrap:anywhere}
 #lunoir-app .order-secondary-content>.order-action-disclosure{margin:0}
 #lunoir-app .order-secondary-content>*+*{border-top:1px solid var(--skin-line)}
 #lunoir-app .staff-order .order-secondary-content .order-tool-link,
 #lunoir-app .staff-order .order-secondary-content .order-action-disclosure>summary{
  display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;
  min-height:46px;padding:12px 0;margin:0;text-decoration:none;list-style:none;
  text-align:left;font-size:13px;font-weight:500;line-height:1.65;border:0;border-radius:0;
  color:var(--skin-ink);background:transparent;transition:color .24s ease;
 }
 #lunoir-app .staff-order .order-secondary-content .order-tool-danger{color:#97533f}
 #lunoir-app .order-secondary-card :is(summary,a):focus-visible{outline:2px solid var(--skin-accent);outline-offset:-2px;border-radius:4px}
 #lunoir-app .order-secondary-content .order-action-disclosure>p{margin:0 0 12px}
 #lunoir-app .order-secondary-content .order-tool-body{padding:0 0 4px}
 #lunoir-app .order-secondary-content form{padding:0 0 16px;margin:0;border:0;background:transparent;display:grid;gap:12px;min-width:0}
 #lunoir-app .order-secondary-content form label{display:block;width:100%;min-width:0;margin:0;font-size:12px}
 #lunoir-app .order-secondary-content form :is(input:not([type=hidden]),select,textarea){width:100%;max-width:100%;margin-top:5px}
 #lunoir-app .order-secondary-content form textarea{min-height:74px;resize:vertical}
 #lunoir-app .order-secondary-content form>.btn{width:100%;min-height:40px;margin:0!important;font-size:12px}
 #lunoir-app .order-secondary-content form :is(.mb-2,.mb-3){margin-bottom:0!important}
 #lunoir-app .order-secondary-content .btn-outline-danger,
 #lunoir-app .order-visibility-content .btn-outline-danger{--bs-btn-color:#97533f;--bs-btn-border-color:#d2b8ae;--bs-btn-hover-color:#844532;--bs-btn-hover-bg:#f7eeea;--bs-btn-hover-border-color:#b1806e;--bs-btn-active-bg:#f7eeea;--bs-btn-active-color:#844532;--bs-btn-active-border-color:#b1806e}
 #lunoir-app .order-secondary-content .order-retain-item{margin:0;padding:12px;border:1px solid var(--skin-line);border-radius:6px;min-width:0;background:var(--skin-soft)}
 #lunoir-app .order-retain-item legend{float:left;width:100%;font-size:12px;font-weight:600;line-height:1.65;margin:0 0 12px;overflow-wrap:anywhere}
 #lunoir-app .order-retain-item .form-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;margin:0;clear:both}
 @media(hover:hover) and (pointer:fine){
  #lunoir-app .order-secondary-card>summary:hover{background:var(--skin-soft)}
  #lunoir-app .order-secondary-content :is(.order-tool-link,.order-action-disclosure>summary):hover{color:var(--skin-accent)}
 }
 @media(prefers-reduced-motion:reduce){#lunoir-app .order-secondary-card *::after{transition:none}}
}
@media screen {
 html[data-ui-studio=true] #lunoir-app:not(.print-view){
  --studio-ease:cubic-bezier(.22,.75,.2,1);
  --studio-depth:0 1px 0 #ffffff90,0 8px 26px #211b1308;
 }
 html[data-ui-studio=true] #lunoir-app:not(.print-view) .page-heading{
  border-bottom:1px solid var(--skin-line);padding-bottom:16px;
 }
 html[data-ui-studio=true] #lunoir-app:not(.print-view) .card{box-shadow:var(--studio-depth)}
 html[data-ui-studio=true] .order-page .order-status-summary{
  position:relative;isolation:isolate;overflow:hidden;
  background:linear-gradient(120deg,var(--skin-rail),var(--skin-rail-end))!important;
  border:0;border-radius:8px;box-shadow:inset 0 1px #ffffff20,0 4px 16px #16161112;
 }
 html[data-ui-studio=true] #lunoir-app .order-status-summary :is(small,.grand-total,.status-pill,.order-payment-badge){color:var(--skin-on-rail)!important}
 html[data-ui-studio=true] #lunoir-app .order-status-summary .status-pill{background:transparent!important;border:0}
 html[data-ui-studio=true] .order-status-summary::before{
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse at 85% 0%,var(--skin-rail-line),transparent 65%);
 }
 html[data-ui-studio=true] .order-status-summary::after{
  content:'';position:absolute;inset:0 0 auto;height:1px;
  background:linear-gradient(90deg,transparent,var(--skin-button),transparent);opacity:.45;
 }
 html[data-ui-studio=true] .staff-order .order-current-step{box-shadow:0 8px 32px #201c110a}
 html[data-ui-studio=true] .order-document-links .btn{
  position:relative;isolation:isolate;overflow:hidden;transition:background-color .24s,border-color .24s,box-shadow .24s;
 }
 html[data-ui-studio=true] .order-document-links .btn::before{
  content:'';position:absolute;z-index:-1;inset:0;pointer-events:none;opacity:0;
  background:linear-gradient(110deg,transparent 15%,var(--skin-selected) 44%,#ffffff90 50%,var(--skin-selected) 56%,transparent 85%);
  background-size:240% 100%;background-position:100% 0;
 }
 @media(hover:hover) and (pointer:fine){
  html[data-ui-studio=true] .order-document-links .btn:hover::before{animation:studio-gloss 1.25s cubic-bezier(.2,.55,.3,1) both}
  html[data-ui-studio=true] .order-document-links .btn:hover{box-shadow:inset 0 0 0 1px var(--skin-accent),0 3px 10px #271c0f0c}
 }
 html[data-ui-studio=true] .order-document-links .btn:focus-visible::before{animation:studio-gloss 1.25s cubic-bezier(.2,.55,.3,1) both}
 html[data-ui-studio=true] .stock-table{box-shadow:0 8px 26px #211b1307}
 html[data-ui-studio=true] .stock-metrics{box-shadow:inset 0 1px #fff,0 5px 18px #211b1306}
 html[data-ui-studio=true] .stock-view-tabs{border-radius:9px;box-shadow:inset 0 1px 3px #211b1306}
 html[data-ui-studio=true] .ui-tab-ink{box-shadow:inset 0 0 0 1px var(--skin-line),0 2px 5px #211b1310}
 html[data-ui-studio=true] .filter-panel{transform-origin:top right}
 html[data-ui-studio=true] .filter-more[open] .filter-panel{animation:studio-panel-in .24s var(--studio-ease)}
 html[data-ui-studio=true] .label-live-preview{
  background:linear-gradient(155deg,var(--skin-rail),var(--skin-rail-end));
  border-color:var(--skin-rail-line);box-shadow:inset 0 1px #ffffff15,0 12px 30px #211b1310;
 }
 html[data-ui-studio=true] .label-live-preview header,
 html[data-ui-studio=true] .label-live-preview header strong,
 html[data-ui-studio=true] .label-live-preview>p{color:var(--skin-on-rail)!important}
 html[data-ui-studio=true] .label-live-preview header span{color:var(--skin-rail-muted)}
 html[data-ui-studio=true] .label-live-paper{
  position:relative;isolation:isolate;margin:12px 3px 20px;box-shadow:0 16px 24px #00000025;
  border-color:#ece8de;transform-origin:center top;
 }
 html[data-ui-studio=true] .label-live-paper::before,
 html[data-ui-studio=true] .label-live-paper::after{
  content:'';position:absolute;pointer-events:none;z-index:-2;inset:auto 4px -5px;height:5px;
  background:#e8e3da;border-radius:0 0 2px 2px;box-shadow:0 1px 1px #0002;
 }
 html[data-ui-studio=true] .label-live-paper::after{z-index:-3;inset:auto 8px -10px;height:5px;background:#d7d1c7}
 html[data-ui-studio=true] .label-live-preview[data-paper-pulse] .label-live-paper{animation:studio-paper .48s var(--studio-ease)}
 html[data-ui-studio=true] .label-live-preview[data-paper-pulse] .label-live-paper::after{animation:studio-stack .48s var(--studio-ease)}
 html[data-ui-studio=true] .label-product{transition:border-color .2s,box-shadow .2s}
 html[data-ui-studio=true] .label-product:focus-within{box-shadow:inset 3px 0 var(--skin-accent),0 6px 20px #211b1308}
 html[data-ui-studio=true] .label-bag-group[data-studio-new]{animation:studio-field-in .3s var(--studio-ease)}
 @keyframes studio-gloss{0%{opacity:0;background-position:100% 0}30%{opacity:.35}100%{opacity:0;background-position:0% 0}}
 @keyframes studio-panel-in{from{opacity:0;transform:translateY(-6px) scale(.985)}to{opacity:1;transform:none}}
 @keyframes studio-field-in{from{opacity:0;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0)}}
 @keyframes studio-paper{0%{box-shadow:0 16px 24px #00000025}35%{box-shadow:0 20px 32px #00000040,0 0 0 2px #ffffff35}100%{box-shadow:0 16px 24px #00000025}}
 @keyframes studio-stack{0%{transform:translateY(0)}45%{transform:translateY(4px)}100%{transform:translateY(0)}}
 @keyframes studio-reveal{from{opacity:0;clip-path:inset(0 0 12% 0 round 10px)}to{opacity:1;clip-path:inset(0 round 10px)}}
 @keyframes studio-out{to{opacity:0}}
 html[data-ui-studio=true] .page-stock .stock-table{view-transition-name:stock-content}
 html[data-ui-studio=true] .page-stock .ui-tab-ink{view-transition-name:none}
 html[data-ui-studio=true] .staff-order .order-sheet{view-transition-name:order-content}
 html[data-ui-studio=true] .label-workbench{view-transition-name:packing-content}
 html[data-ui-studio=true]::view-transition{pointer-events:none}
 html[data-ui-studio=true]::view-transition-old(root){animation:none;opacity:0}
 html[data-ui-studio=true]::view-transition-new(root){animation:none}
 html[data-ui-studio=true]::view-transition-group(stock-content),
 html[data-ui-studio=true]::view-transition-group(order-content),
 html[data-ui-studio=true]::view-transition-group(packing-content){animation:none}
 html[data-ui-studio=true]::view-transition-old(stock-content),
 html[data-ui-studio=true]::view-transition-old(order-content),
 html[data-ui-studio=true]::view-transition-old(packing-content){animation:studio-out .12s ease both}
 html[data-ui-studio=true]::view-transition-new(stock-content),
 html[data-ui-studio=true]::view-transition-new(order-content),
 html[data-ui-studio=true]::view-transition-new(packing-content){animation:studio-reveal .36s cubic-bezier(.22,.75,.2,1) both}
 html[data-ui-studio=true]::view-transition-group(stock-selection){animation-duration:.36s;animation-timing-function:cubic-bezier(.22,.75,.2,1)}
 @media(max-width:1100px){html[data-ui-studio=true] .label-live-paper{margin:12px auto 20px}}
 @media(prefers-reduced-motion:reduce){
  html[data-ui-studio=true] *,html[data-ui-studio=true] *::before,html[data-ui-studio=true] *::after{animation:none!important;transition:none!important;view-transition-name:none!important}
 }
}

/* Approved whole-site presentation. No row heights, field values or print dimensions change. */
@media screen {
 html[data-ui-studio=true] #lunoir-app:not(.print-view) {
  --studio-ease:cubic-bezier(.22,.75,.2,1);
  --studio-depth:0 1px 0 #ffffff90,0 8px 26px #211b1308;
  font-variant-numeric:tabular-nums;
 }
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.page-heading,.head){border-color:var(--skin-line)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.page-heading h1,.head h1){letter-spacing:-.025em}
 html[data-ui-studio=true] #lunoir-app:is(.page-stock,.arrival-page,.page-customers) .page-heading h1{font-size:24px;font-weight:500;line-height:1.4}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.eyebrow,.section-kicker,.section-heading>span,.return-eyebrow){color:var(--skin-accent)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.section-heading,.return-section-heading,.customer-order-head){border-color:var(--skin-line)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.section-heading h2,.return-section-heading h2){font-weight:600;letter-spacing:.01em}
 /* A consistent paper surface for lists, editors, picker panels and customer history. */
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.table-wrap,.collection,.editor-card,.import-upload-card,.stock-receive-card,.staff-self-card,.staff-security-card,.staff-password-card,.customer-order-card,.quote-share,.auth-card){
  background:var(--skin-paper);border-color:var(--skin-line);border-radius:10px;box-shadow:var(--studio-depth);
 }
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.filter-bar,.order-finder,.quote-controls,.quote-basket,.order-header-grid,.pack-summary,.selected-customer,.catalog-entry-card,.return-optional,.return-progress){
  background:var(--skin-soft);border-color:var(--skin-line);color:var(--skin-ink);
 }
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.contact-row,.shipping-address-row,.invoice-profile-row,.selected-bean,.audience-option,.form-field:has(input[type=checkbox])){background:var(--skin-paper);border-color:var(--skin-line)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) .audience-option:has(input:checked){background:var(--skin-selected);border-color:var(--skin-accent)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(label,.form-label,.section-heading p,.available-note,.line-total,.batch-label,.list-pagination span,summary,.auth-entry-links){color:var(--skin-muted)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.line-total strong,.selected-bean-heading strong,.return-progress strong){color:var(--skin-ink)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.table-empty,.empty-note){background:var(--skin-paper)!important;color:var(--skin-muted);border-color:var(--skin-line)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.record-table,.order-lines,.order-table,.arrival-table,.batch-table,.presale-batches-table) thead th{font-weight:500;background:var(--skin-soft);color:var(--skin-muted)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.record-table,.stock-table table,.order-lines,.arrival-table,.batch-table,.presale-batches-table) tbody tr{transition:background-color .22s ease}
 /* Paint-only feedback: controls and readable text never translate or scale. */
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.btn,.text-button,.form-control,.form-select,.audience-option){transition:background-color .24s,border-color .24s,box-shadow .24s,color .24s}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.btn,.text-button):active{transform:none!important;box-shadow:inset 0 0 0 1px var(--skin-accent)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.editor-card,.quote-setup-card,.customer-order-card):focus-within{border-color:var(--skin-accent)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) .customer-order-card{transition:border-color .24s,box-shadow .24s}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) .customer-order-amount strong{font-variant-numeric:tabular-nums}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.customer-catalog-types,.auth-method-tabs){isolation:isolate;border-color:var(--skin-line)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) .ui-type-indicator{background:var(--skin-paper);z-index:0;box-shadow:inset 0 0 0 1px var(--skin-line),0 1px 3px #30261712}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) .customer-catalog-types>*:not(.ui-type-indicator){position:relative;z-index:1}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.auth-shell,.state-card){border-color:var(--skin-line);box-shadow:var(--studio-depth)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) .auth-intro{border-color:var(--skin-rail-line)}
 /* Overlays inherit the current skin, with one owner for opening/closing motion. */
 html[data-ui-studio=true] #lunoir-app :is(.modal-content,.ui-toast.toast,.filter-panel.ui-filter-sheet){background:var(--skin-paper);color:var(--skin-ink);border-color:var(--skin-line);box-shadow:0 16px 48px #15181024;border-radius:10px}
 html[data-ui-studio=true] #lunoir-app .ui-toast.toast{border-left-color:var(--skin-accent)}
 html[data-ui-studio=true] #lunoir-app .ui-toast-warning.toast{border-left-color:#a57345}
 html[data-ui-studio=true] #lunoir-app :is(.modal-header,.modal-footer){border-color:var(--skin-line)}
 html[data-ui-studio=true] #lunoir-app :is(.offcanvas,.offcanvas-backdrop,.modal-dialog,.modal.fade,.modal-backdrop){transition-duration:.28s}
 html[data-ui-studio=true] #lunoir-app .ui-result-skeleton{background:color-mix(in srgb,var(--skin-paper) 94%,transparent)}
 html[data-ui-studio=true] #lunoir-app .ui-result-skeleton i{background-image:linear-gradient(90deg,var(--skin-line),var(--skin-soft),var(--skin-line))}
 html[data-ui-studio=true] #lunoir-app :is(.ui-coffee-wait,.customer-interface .is-saving::after){background-color:var(--skin-accent)}
 html[data-ui-studio=true] #lunoir-app .lunoir-ptr--ptr{background:var(--skin-paper);color:var(--skin-muted)}
 html[data-ui-studio=true] #lunoir-app .filter-panel.ui-filter-sheet{border-radius:14px 14px 0 0}
 html[data-ui-studio=true] #lunoir-app :is(.role-nav a.active,.client-navigation .customer-links a.active){box-shadow:inset 2px 0 var(--skin-accent),inset 0 0 0 1px var(--skin-rail-line)}
 html[data-ui-studio=true] #lunoir-app :is(.role-nav a,.client-navigation .customer-links a){transition:background-color .24s,color .24s,box-shadow .24s}
 @media(hover:hover) and (pointer:fine){
  html[data-ui-studio=true] #lunoir-app:not(.print-view) .customer-order-card:hover{border-color:var(--skin-accent);box-shadow:0 8px 26px #211b130e}
  html[data-ui-studio=true] #lunoir-app:not(.print-view) :is(.audience-option,summary):hover{color:var(--skin-ink)}
 }
 @media(prefers-reduced-motion:reduce){
  html[data-ui-studio=true] #lunoir-app *,html[data-ui-studio=true] #lunoir-app *::before,html[data-ui-studio=true] #lunoir-app *::after{animation:none!important;transition:none!important}
 }
}

@media screen {
 html[data-ui-studio=true] #lunoir-app:not(.print-view){--bs-secondary-color:var(--skin-muted)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) .equipment-choices li{background:var(--skin-soft)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) .equipment-product-image{border:1px solid var(--skin-line);border-radius:8px;background:var(--skin-paper)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) .return-progress .return-step.is-current{background:var(--skin-selected);border-color:var(--skin-accent)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) .return-help{background:var(--skin-paper);color:var(--skin-accent);border-color:var(--skin-line)}
 /* A single cross-page fade on ordinary lists and forms; no scaling or geometry interpolation. */
 html[data-ui-studio=true] body:not(.print-view):not(.sample-client) #main-content:has(>.page-heading){view-transition-name:workspace-content}
 html[data-ui-studio=true]::view-transition-group(workspace-content){animation:none}
 html[data-ui-studio=true]::view-transition-old(workspace-content){animation:studio-out .12s ease both}
 html[data-ui-studio=true]::view-transition-new(workspace-content){animation:studio-workspace-in .28s ease both}
 @keyframes studio-workspace-in{from{opacity:0}to{opacity:1}}
 @media(prefers-reduced-motion:reduce){html[data-ui-studio=true] body:not(.print-view) #main-content{view-transition-name:none!important}}
}

@media screen {
 html[data-ui-studio=true] #lunoir-app:not(.print-view) .page-heading .btn-primary{background:var(--skin-paper);border-color:var(--skin-line);color:var(--skin-ink);box-shadow:inset 0 1px #ffffff80}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) .customer-catalog-types :is(.is-current,[aria-current=page],[aria-pressed=true]){background:var(--skin-selected);color:var(--skin-ink);box-shadow:inset 0 0 0 1px var(--skin-line)}
 /* allauth also renders plain inputs, without Bootstrap control classes. */
 html[data-ui-studio=true] #lunoir-app:not(.print-view) .auth-card :is(input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=submit]),textarea,select){background-color:var(--skin-paper);color:var(--skin-ink);border-color:var(--skin-line);border-radius:6px;caret-color:var(--skin-accent)}
 html[data-ui-studio=true] #lunoir-app:not(.print-view) .auth-card :is(input,textarea,select):focus{border-color:var(--skin-accent);box-shadow:0 0 0 3px var(--skin-ring)}
}

/* Keep correction fields readable with help markers and long item names. */
@media screen {
 #lunoir-app.page-corrections :is(.correction-fields,.correction-resolution-fields,.correction-refund-fields){display:grid;grid-template-columns:minmax(140px,.8fr) minmax(240px,1.4fr) minmax(200px,1fr);gap:14px 16px;align-items:end;min-width:0}
 #lunoir-app.page-corrections :is(.correction-fields,.correction-resolution-fields,.correction-refund-fields)>label{display:block;min-width:0;margin:0;line-height:24px}
 #lunoir-app.page-corrections :is(.correction-fields,.correction-resolution-fields,.correction-refund-fields) :is(.form-control,.form-select){display:block;width:100%;min-width:0;max-width:100%;margin-top:4px;min-height:42px}
 #lunoir-app.page-corrections .correction-product{grid-column:1/-1;padding-bottom:12px;border-bottom:1px solid var(--skin-line);color:var(--skin-ink);overflow-wrap:anywhere}
 #lunoir-app.page-corrections .correction-product small{display:block;margin-left:22px;color:var(--skin-muted)}
 #lunoir-app.page-corrections .correction-product input{margin-right:5px;vertical-align:middle}
 #lunoir-app.page-corrections .correction-options{display:flex;align-items:center;flex-wrap:wrap;gap:12px 20px;margin-top:14px}
 #lunoir-app.page-corrections .correction-options label{display:flex;align-items:center;gap:7px;margin:0;line-height:1.6}
 #lunoir-app.page-corrections .correction-options input{flex:none;margin:0}
 #lunoir-app.page-corrections .correction-resolution-fields{margin-top:12px}
 #lunoir-app.page-corrections :is(.correction-resolve-actions,.correction-submit){grid-column:1/-1}
 @media(max-width:1050px){
  #lunoir-app.page-corrections :is(.correction-fields,.correction-resolution-fields,.correction-refund-fields){grid-template-columns:repeat(2,minmax(0,1fr))}
  #lunoir-app.page-corrections :is(.correction-movement,.correction-evidence){grid-column:1/-1}
 }
 @media(max-width:575px){
  #lunoir-app.page-corrections :is(.correction-fields,.correction-resolution-fields,.correction-refund-fields){grid-template-columns:minmax(0,1fr);gap:12px}
  #lunoir-app.page-corrections .correction-options{align-items:flex-start;flex-direction:column}
 }
}

/* Expanded operations retain the same field rhythm and hierarchy across skins. */
@media screen {
 #lunoir-app .skip-link:not(:focus-visible) {clip-path:inset(50%)}
 #lunoir-app .skip-link:focus-visible {clip-path:none;top:10px}
 #lunoir-app .ui-form-disclosure {min-width:0}
 #lunoir-app .ui-form-disclosure>summary {
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  min-height:40px;list-style:none;color:var(--skin-ink);font-weight:600;line-height:1.6;
 }
 #lunoir-app .ui-form-disclosure>summary::marker,
 #lunoir-app .ui-form-disclosure>summary::-webkit-details-marker {display:none;content:''}
 #lunoir-app .ui-form-disclosure>summary::after {
  content:'';flex:0 0 7px;width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(-45deg);transition:transform .24s ease;opacity:.65;margin-right:3px;
 }
 #lunoir-app .ui-form-disclosure[open]>summary {border-bottom:1px solid var(--skin-line);padding-bottom:12px;margin-bottom:16px}
 #lunoir-app .ui-form-disclosure[open]>summary::after {transform:rotate(45deg)}
 #lunoir-app .ui-form-disclosure>summary:focus-visible {outline:2px solid var(--skin-accent);outline-offset:3px}
 #lunoir-app .ui-form-disclosure form {min-width:0}
 #lunoir-app .ui-form-disclosure :is(.form-control,.form-select) {max-width:100%}
 #lunoir-app .invoice-adjust-actions {display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px;margin-top:12px}
 #lunoir-app .invoice-adjust-actions .btn {min-height:42px;white-space:normal}
 #lunoir-app .stock-box-operation .ui-form-disclosure {width:100%;min-width:0}
 #lunoir-app .arrival-add .arrival-form-footer {justify-content:flex-start}
 #lunoir-app .arrival-add label:has(input[type=checkbox]) {display:flex;align-items:center;gap:8px}
 #lunoir-app .arrival-add label input[type=checkbox] {margin:0;flex:none}
 @media(max-width:760px) {
  #lunoir-app .stock-box-operation {display:block!important;width:100%;grid-column:1/-1}
  #lunoir-app .stock-box-operation::before {display:none!important}
  #lunoir-app .stock-box-operation>.record-cell-value {display:block;width:100%}
  #lunoir-app .stock-box-operation .btn {width:100%}
  #lunoir-app .invoice-adjust-actions {grid-template-columns:1fr}
  #lunoir-app .correction-resolve-actions {flex-direction:column;align-items:stretch}
 }
 @media(prefers-reduced-motion:reduce) {#lunoir-app .ui-form-disclosure>summary::after {transition:none}}
}

@media screen {
 #lunoir-app .order-progress-labels {display:flex;align-items:center;flex-wrap:wrap;gap:6px}
 #lunoir-app .order-progress-labels .invoice-status-tag {
  display:inline-flex;align-items:center;min-height:26px;padding:3px 9px;border:1px solid var(--skin-line);border-radius:6px;
  color:var(--skin-ink);background:var(--skin-soft);font-size:12px;font-weight:600;line-height:1.5;text-decoration:none;white-space:normal;
  transition:background-color .2s,border-color .2s;
 }
 #lunoir-app .order-progress-labels .invoice-status-pending {color:#80521d;background:#fff1d9;border-color:#dfbd86}
 #lunoir-app .order-progress-labels .invoice-status-tag:hover {border-color:var(--skin-accent);text-decoration:underline;text-underline-offset:3px}
 #lunoir-app .invoice-status-tag:focus-visible {outline:2px solid var(--skin-accent);outline-offset:2px}
}

/* Keep all invoice amounts readable on narrow screens without changing other metrics. */
@media screen {
 #lunoir-app .invoice-metrics>.metric{min-width:0}
 #lunoir-app .invoice-metrics strong{max-width:100%;overflow-wrap:anywhere}
}
@media screen and (max-width:480px) {
 #lunoir-app .invoice-metrics{grid-template-columns:minmax(0,1fr)}
 #lunoir-app .invoice-metrics>.metric{flex-direction:row;flex-wrap:wrap;align-items:baseline}
}

/* Keep the current dispatch task aligned in the narrow order action column. */
@media screen {
 #lunoir-app .shipment-entry-form{display:grid;gap:10px;min-width:0}
 #lunoir-app .shipment-entry-form>label{display:block;width:100%;min-width:0;margin:0}
 #lunoir-app .shipment-entry-form>label>.form-control{width:100%;max-width:100%;margin-top:5px}
 #lunoir-app .shipment-entry-form>:is(.form-text,.confirmation-note,.btn){margin:0;width:100%}
}
