@media(max-width:950px){
 @layer nzip-components{
  html body :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]):not([type=color]):not([type=file]),textarea,select){font-size:16px!important;line-height:1.3!important}
  html body #main .search-wrap input{height:100%!important;min-height:0!important;padding-block:0!important}
  html body #dialog>.modal-head>.close{width:32px!important;height:32px!important;min-height:32px!important;padding:0!important}
 }
 html,html body{height:100%;overflow:hidden;overscroll-behavior:none}
 html body .app{height:100svh!important;min-height:0!important;overflow:hidden}
 html body .workspace{height:100%;min-height:0;min-width:0;display:flex!important;flex-direction:column;overflow:hidden}
 html body .topbar{flex:none;min-height:54px;padding-top:env(safe-area-inset-top,0px);box-sizing:content-box}
 html body .demo-banner{flex:none}
 html body #main{flex:1 1 auto;min-height:0;min-width:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;scroll-padding:16px 0 calc(90px + var(--mobile-keyboard-gap,0px));padding-bottom:calc(90px + env(safe-area-inset-bottom,0px) + var(--mobile-keyboard-gap,0px))}
 html body.has-order-shortcuts #main{padding-bottom:calc(150px + env(safe-area-inset-bottom,0px) + var(--mobile-keyboard-gap,0px))!important}
 html body #main .search-wrap{flex-shrink:0}
 html body #main .search-clear-field{align-self:center;height:100%;min-width:0}
 html body #main #inventory-search::placeholder{font-size:clamp(9px,2.65vw,11px)!important}
 html body #main .product:hover{transform:none}
 html body .cart .qty,html body .cart .qty>*{color:#111827!important;-webkit-text-fill-color:#111827!important}
 html body #dialog[data-sheet=preparation] .prep-korean-toggle{color:#111827!important;-webkit-text-fill-color:#111827!important;font-weight:650!important}
 html body #dialog[data-sheet=preparation] .prep-inline-meta{color:#6b7280!important;font-weight:400!important}
 html body #dialog[open]{display:flex;flex-direction:column;height:auto!important;min-height:0!important;max-height:calc(var(--mobile-visible-height,100dvh) - 24px)!important;max-width:calc(100vw - 24px);overflow:hidden;border-radius:16px}
 html body #dialog>.modal-head{flex:none;padding:10px 14px;gap:8px}
 html body #dialog>.modal-body{flex:0 1 auto!important;min-height:0!important;overflow-y:auto;overscroll-behavior:contain;padding:12px 14px}
 html body #dialog>.modal-footer{flex:none;padding:8px 14px;gap:8px}
 html body #dialog>.modal-footer>button{white-space:nowrap}
 html body #dialog[data-sheet=checkout-confirmation] #dialog-title{font-size:17px;font-weight:650;color:#111827}
 html body #dialog[data-sheet=checkout-confirmation] #dialog-body{padding:8px 14px}
 html body #dialog[data-sheet=checkout-confirmation] #dialog-body>p{margin:0 0 8px;font-size:12px;line-height:1.4;overflow-wrap:anywhere}
 html body #dialog[data-sheet=checkout-confirmation] .confirmation-lines{max-height:min(32svh,260px);min-height:0;overflow-y:auto;margin:0 0 8px}
 html body #dialog[data-sheet=checkout-confirmation] .confirm-line{padding:8px 0;display:flex;align-items:center;gap:8px}
 html body #dialog[data-sheet=checkout-confirmation] .confirm-line>div{flex:1;min-width:0;overflow-wrap:anywhere}
 html body #dialog[data-sheet=checkout-confirmation] .confirm-line strong{color:#111827;font-size:14px;font-weight:650;line-height:1.4}
 html body #dialog[data-sheet=checkout-confirmation] .confirm-line .secondary{font-size:12px;line-height:1.4;margin-top:3px;color:#6b7280}
 html body #dialog[data-sheet=checkout-confirmation] .confirm-line button{flex:none;white-space:nowrap;font-size:12px;padding:4px 8px}
 html body #dialog[data-sheet=checkout-confirmation] .confirm-totals{padding:4px 0;margin:0}
 html body #dialog[data-sheet=checkout-confirmation] .sumrow{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:4px 0;font-size:13px;line-height:1.5}
 html body #dialog[data-sheet=checkout-confirmation] .sumrow strong{font-weight:400;white-space:nowrap}
 html body #dialog[data-sheet=checkout-confirmation] .total-row{border-top:1px solid var(--line);padding-top:8px;margin-top:8px}
 html body #dialog[data-sheet=checkout-confirmation] .total-row strong{font-size:24px;font-weight:700;color:#111827}
 html body #dialog[data-sheet=checkout-confirmation] #dialog-body>button{margin:6px 0 0;padding:5px 9px;font-size:12px;background:#f3f4f6;color:#596575}
 html body #dialog[data-sheet=checkout-confirmation] #dialog-footer .primary{background:#2767b4;color:white}
}
@media(max-width:950px){
 html body :is(input,textarea,select){--ui-control-font:16px!important}
 @layer nzip-components{html body :is(#main,#dialog) :is(input,textarea,select):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]):not([type=file]){font-size:16px!important;line-height:1.3!important}}
}
@media(max-width:950px){html body #dialog[open]{height:fit-content!important}}
@media(max-width:950px){
 html body .topbar{height:calc(54px + env(safe-area-inset-top,0px));min-height:calc(54px + env(safe-area-inset-top,0px));box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:0}
 html body #dialog[data-sheet=checkout-confirmation] #dialog-error:empty{display:none}
}

@layer nzip-mobile-controls{
 @media(max-width:950px){
  html body :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]):not([type=color]):not([type=file]),textarea,select){font-size:16px!important;line-height:1.3!important}
 }
}
@media(max-width:950px){html body #dialog[data-sheet=preparation] .prep-inline-meta :is(.prep-variant,.prep-stock,.prep-name-toggle){color:#6b7280!important;-webkit-text-fill-color:#6b7280!important;font-weight:400!important}}
@media(max-width:950px){
 .cart-internal-code{display:none}
 html body .order-shortcuts .order-amount-link{display:flex;align-items:center;justify-content:flex-start;gap:10px;width:100%;min-height:40px;padding:4px 2px;background:transparent;color:var(--navy);border-radius:6px;text-align:left}
 html body .order-shortcuts .order-amount-link span{font-size:14px;font-weight:400}
 html body .order-shortcuts .order-amount-link strong{margin:0;font-size:25px;font-weight:700;color:var(--navy);line-height:1.2}
 html body #dialog:is([data-sheet=line-discount],[data-sheet=order-discount]) .modal-head{padding:8px 14px}
 html body #dialog:is([data-sheet=line-discount],[data-sheet=order-discount]) #dialog-title{font-size:17px;font-weight:700;color:#111827}
 html body #dialog:is([data-sheet=line-discount],[data-sheet=order-discount]) #dialog-body{padding:10px 14px;display:block}
 html body #dialog:is([data-sheet=line-discount],[data-sheet=order-discount]) .form-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;margin:0}
 html body #dialog:is([data-sheet=line-discount],[data-sheet=order-discount]) .field{gap:4px;margin:0;font-size:13px;min-width:0}
 html body #dialog:is([data-sheet=line-discount],[data-sheet=order-discount]) .field>span{margin:0;line-height:1.4}
 html body #dialog:is([data-sheet=line-discount],[data-sheet=order-discount]) :is(input,select){height:40px;min-height:40px;max-height:40px;border-radius:6px;padding:6px 8px;width:100%;min-width:0;box-sizing:border-box}
 html body #dialog:is([data-sheet=line-discount],[data-sheet=order-discount]) .secondary{font-size:12px;color:#6b7280;line-height:1.4;margin:6px 0 8px}
 html body #dialog:is([data-sheet=line-discount],[data-sheet=order-discount]) .confirm-fields{margin:0;padding:0;border:0}
 html body #dialog:is([data-sheet=line-discount],[data-sheet=order-discount]) :is(.line-discount-totals,.confirm-totals){margin:10px 0 0;padding:0}
 html body #dialog:is([data-sheet=line-discount],[data-sheet=order-discount]) .sumrow{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:4px 0;font-size:13px;line-height:1.4}
 html body #dialog:is([data-sheet=line-discount],[data-sheet=order-discount]) .total-row{border-top:1px solid var(--line);padding-top:8px;margin-top:8px}
 html body #dialog:is([data-sheet=line-discount],[data-sheet=order-discount]) .total-row strong{font-size:24px;font-weight:700;color:#111827;white-space:nowrap}
 html body #dialog:is([data-sheet=line-discount],[data-sheet=order-discount]) #dialog-error:empty{display:none}
 html body #dialog:is([data-sheet=line-discount],[data-sheet=order-discount]) #dialog-footer{padding:8px 14px;gap:8px}
 html body #dialog:is([data-sheet=line-discount],[data-sheet=order-discount]) #dialog-footer button{height:40px;min-height:40px;padding:6px 14px}
}
/* Mobile picking hierarchy: override the legacy component-layer button styles. */
@layer nzip-mobile-controls{
 @media(max-width:950px){
  html body #dialog[data-sheet=preparation] .prep-execution-row>.prep-korean-toggle{
   color:#111827!important;-webkit-text-fill-color:#111827!important;font-weight:700!important;font-size:14px!important;line-height:17px!important;
   display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;white-space:normal!important;overflow-wrap:anywhere;overflow:hidden;text-overflow:ellipsis;
   padding:3px 0!important;min-height:28px!important;opacity:1!important;
  }
  html body #dialog[data-sheet=preparation] .prep-execution-row>.prep-korean-toggle[aria-expanded=true]{-webkit-line-clamp:unset;line-clamp:unset}
  html body #dialog[data-sheet=preparation] .prep-execution-row>.prep-qty{font-size:13px!important;font-weight:600!important;color:#111827!important}
  html body #dialog[data-sheet=preparation] .prep-check,html body #dialog[data-sheet=preparation] .prep-check>span{font-weight:400!important;font-size:11px!important}
  html body #dialog[data-sheet=preparation] .prep-inline-meta :is(.prep-variant,.prep-stock,.prep-name-toggle){font-size:11px!important;font-weight:400!important;color:#6b7280!important;-webkit-text-fill-color:#6b7280!important}
 }
}
/* Shared mobile shell and centered filter dialog. Safe-area variables also support device emulation. */
@media(max-width:950px){
 :root{--nzip-safe-top:env(safe-area-inset-top,0px);--nzip-safe-bottom:env(safe-area-inset-bottom,0px)}
 html body .app{position:fixed;inset:0;max-width:100%;overflow:hidden}
 html body .workspace{min-height:0}
 html body #main{isolation:isolate}
 html body .order-shortcuts .order-amount-link,html body .order-shortcuts .order-amount-link :is(span,strong){color:#5799df;-webkit-text-fill-color:#5799df}
 html body #dialog[open]{max-height:calc(var(--mobile-visible-height,100dvh) - var(--nzip-safe-top) - var(--nzip-safe-bottom) - 24px)!important}
 html body #dialog[data-sheet=inventory][open]{position:fixed;inset:auto!important;left:50%!important;top:calc(var(--sheet-top,0px) + var(--nzip-safe-top) + (var(--sheet-height,100dvh) - var(--nzip-safe-top) - var(--nzip-safe-bottom))/2)!important;transform:translate(-50%,-50%);margin:0!important;width:calc(100vw - 28px)!important;max-width:440px!important;height:fit-content!important;background:white;justify-content:flex-start;border-radius:16px;pointer-events:auto}
 html body #dialog[data-sheet=inventory] .modal-head{border-radius:0;flex:none}
 html body #dialog[data-sheet=inventory] #dialog-body{flex:0 1 auto!important;min-height:0;overflow-y:auto;padding:12px 14px}
 html body #dialog[data-sheet=inventory] .stock-range-fields{gap:10px;margin:0}
 html body #dialog[data-sheet=inventory] .stock-range-fields label{gap:4px}
 html body #dialog[data-sheet=inventory] #dialog-error:empty{display:none}
 html body #dialog[data-sheet=inventory] #dialog-footer{position:relative;flex:0 0 auto;overflow:visible;padding:8px 14px;background:white;pointer-events:auto}
 html body #dialog[data-sheet=inventory] .range-actions{width:100%;padding:0;gap:8px}
 html body #dialog[data-sheet=checkout-confirmation] .confirm-line{padding:6px 0}
 html body #dialog[data-sheet=checkout-confirmation] .confirm-totals{padding:0}
 html body #dialog[data-sheet=checkout-confirmation] #dialog-body{padding:8px 14px}
}
@layer nzip-mobile-controls{
 @media(max-width:950px){
  html body .topbar{position:relative!important;top:0!important;transform:none!important;flex:0 0 auto!important;height:calc(54px + var(--nzip-safe-top))!important;min-height:calc(54px + var(--nzip-safe-top))!important;max-height:calc(54px + var(--nzip-safe-top))!important;box-sizing:border-box!important;padding-top:var(--nzip-safe-top)!important;padding-bottom:0!important;z-index:30}
  html body .mobile-bottom-nav{bottom:0!important;padding-bottom:var(--nzip-safe-bottom)!important}
  html body #dialog>.modal-head{padding:8px 14px!important}
  html body #dialog>.modal-footer{padding:8px 14px!important}
  html body #dialog>.modal-footer :is(button.primary,button.neutral){min-height:40px!important;height:40px!important;padding:6px 12px!important}
  html body #dialog>.modal-head>.close{width:32px!important;height:32px!important;min-height:32px!important;padding:0!important}
  html body #dialog[data-sheet=preparation] .prep-execution-row>.prep-korean-toggle{font-size:15px!important;line-height:18px!important}
  html body .cart .qty,html body .cart .qty>*{color:#111827!important;-webkit-text-fill-color:#111827!important}
  html body .mobile-hold-panel .inventory-chips .filter-chip{font-family:inherit!important;font-size:12px!important;font-weight:400!important;line-height:20px!important;display:inline-flex;align-items:center;justify-content:center}
  html body :is(#main,#dialog,.topbar,.mobile-bottom-nav) button:active{transform:none!important}
 }
}
@layer nzip-mobile-controls{@media(max-width:950px){html body #dialog[data-sheet=inventory][open]{transform:translate(-50%,-50%)!important}}}
@layer nzip-mobile-controls{@media(max-width:950px){html body #dialog:not([open]){display:none!important}}}
@layer nzip-mobile-controls{@media(max-width:950px){
 html body #dialog[data-sheet=inventory][open]{border-radius:16px!important;overflow:hidden!important}
 html body #dialog[data-sheet=inventory] :is(input,select){height:40px!important;min-height:40px!important;max-height:40px!important;border:1px solid #d7e0e8!important;border-radius:6px!important;padding:6px 8px!important}
}}
@media(max-width:950px){
 html body #dialog[data-sheet=order-discount] #dialog-body>.form-grid:last-child,
 html body #dialog[data-sheet=order-discount] .confirm-fields+.confirm-fields{margin-top:10px}
}
@layer nzip-mobile-controls{@media(max-width:950px){
 html body #main .mobile-hold-panel .hold-controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 10px;align-items:start}
 html body #main .mobile-hold-panel .hold-controls>label{font-family:inherit!important;font-size:13px!important;font-weight:400!important;line-height:18px!important;letter-spacing:0!important;color:#6b7280!important;display:flex;flex-direction:column;gap:3px}
 html body #main .mobile-hold-panel .hold-controls :is(input,select),html body #main .mobile-hold-panel .hold-timeout-input{height:36px!important;min-height:36px!important;max-height:36px!important;font-family:inherit!important;font-size:14px!important;font-weight:400!important;line-height:20px!important;letter-spacing:0!important;color:#203249!important;box-sizing:border-box!important;border-radius:6px!important}
 html body #main .mobile-hold-panel .hold-controls select{padding:0 28px 0 12px!important;appearance:none!important;-webkit-appearance:none!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='m2 2 4 4 4-4' fill='none' stroke='%23728094' stroke-width='1.5'/%3E%3C/svg%3E")!important;background-position:right 8px center!important;background-size:12px 8px!important;background-repeat:no-repeat!important}
 html body #main .mobile-hold-panel .hold-timeout-input{display:flex!important;align-items:center!important;padding:0 12px!important;gap:4px;border:1px solid #d7e0e8!important;background:white}
 html body #main .mobile-hold-panel .hold-timeout-input input{border:0!important;background:transparent!important;padding:0 40px 0 0!important;height:34px!important;min-height:34px!important;max-height:34px!important}
 html body #main .mobile-hold-panel .hold-timeout-input .hold-timeout-unit{font-family:inherit!important;font-size:14px!important;font-weight:400!important;line-height:20px!important;color:#6b7280!important}
}}
@layer nzip-mobile-controls{@media(max-width:950px){html body #main .mobile-hold-panel .hold-controls{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px 10px!important}}}
/* Compact auxiliary mobile filters and pagination; desktop rules remain unchanged. */
@layer nzip-mobile-controls{@media(max-width:950px){
 html body #main .mobile-hold-panel{height:auto!important;min-height:0!important;align-content:start!important;row-gap:0!important;padding-bottom:12px!important}
 html body #main .mobile-hold-panel .hold-controls{height:auto!important;min-height:0!important;max-height:none!important;flex:0 0 auto!important;padding:0!important;margin:0!important;grid-auto-rows:max-content!important;align-content:start!important;row-gap:6px!important;column-gap:10px!important}
 html body #main .mobile-hold-panel .hold-controls>label{font-size:13px!important;gap:3px!important}
 html body #main .mobile-hold-panel .hold-controls>.secondary{min-height:0!important;height:auto!important;line-height:16px!important;margin:0!important;padding:0!important;align-self:start!important}
 html body #main .mobile-hold-panel #hold-list{min-height:0!important;height:auto!important;flex:none!important;margin:0!important;padding:0!important}
 html body #main .mobile-hold-panel #hold-list>.empty{min-height:0!important;height:auto!important;margin:16px 0 12px!important;padding:0!important;flex:none!important;justify-content:flex-start!important;font-size:13px!important;line-height:20px!important}
 html body #main .inventory-pager{display:grid!important;grid-template-columns:max-content max-content auto max-content!important;justify-content:start!important;align-items:center!important;gap:7px 6px!important;margin:10px 0 0!important;padding:0 0 14px!important;min-width:0!important;font-size:13px!important}
 html body #main .inventory-pager .inventory-page-summary{grid-column:1/-1;line-height:18px!important;margin:0!important}
 html body #main .inventory-pager :is(select,button){height:36px!important;min-height:36px!important;max-height:36px!important;width:auto!important;min-width:0!important;border-radius:6px!important;line-height:20px!important;margin:0!important;padding:0 10px!important;box-sizing:border-box!important;white-space:nowrap!important;font-weight:400!important}
 html body #main .inventory-pager select{font-size:14px!important;width:auto!important;max-width:100%!important;padding:0 28px 0 10px!important;color:#475569!important;-webkit-text-fill-color:#475569!important;border:1px solid #d7dee5!important;background-color:#fff!important;appearance:none!important;-webkit-appearance:none!important;box-shadow:none!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='m2 2 4 4 4-4' fill='none' stroke='%23728094' stroke-width='1.5'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 10px center!important;background-size:10px 7px!important}
 html body #main .inventory-pager select:is(:focus,:focus-visible,:active){color:#475569!important;-webkit-text-fill-color:#475569!important;border-color:#94a3b8!important;outline:1px solid #94a3b8!important;outline-offset:1px!important;box-shadow:none!important;background-color:#fff!important}
 html body #main .inventory-pager button{font-size:13px!important}
 html body #main .inventory-pager>span:not(.inventory-page-summary){font-size:13px!important;background:none!important;padding:0!important;white-space:nowrap!important}
}}

/* Collapsed hold filters: spacing only; expanded controls retain their own metrics. */
@layer nzip-mobile-controls{@media(max-width:950px){
 html body #main .mobile-hold-panel:not(.hold-filters-expanded) .hold-search-toolbar{margin:7px 0 0!important}
 html body #main .mobile-hold-panel:not(.hold-filters-expanded) #hold-list>.empty{margin:19px 0 0!important}
 html body #main .mobile-hold-panel:not(.hold-filters-expanded):has(#hold-list>.empty){padding-bottom:15px!important}
}}

/* Mobile-only hold card boundaries and preparation header. Product rows untouched. */
@media(max-width:950px){
 @layer nzip-mobile-controls{
  html body .mobile-hold-panel #hold-list .held-card{width:100%!important;box-sizing:border-box;border:1px solid #91b9e8!important;border-radius:10px!important;margin:8px 0 0!important;padding:8px 10px!important;cursor:default;box-shadow:none}
  html body .mobile-hold-panel .hold-main-info{width:100%;min-width:0}
  html body .mobile-hold-panel .hold-title{gap:3px 5px!important;margin:0 0 5px!important;min-width:0;align-items:center;flex-wrap:wrap}
  html body .mobile-hold-panel .hold-title>strong{flex:0 1 auto;min-width:28px;max-width:72px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal}
  html body .mobile-hold-panel .hold-title>.hold-core{flex:0 0 auto;flex-wrap:nowrap!important;gap:3px!important;margin:0!important;font-size:12px!important;line-height:20px;white-space:nowrap}
  html body .mobile-hold-panel .hold-title>.hold-core .hold-duration{font-size:12px!important;font-weight:400!important}
  html body .mobile-hold-panel .hold-title>.hold-core>strong{font-size:13px!important;font-weight:600!important}
  html body .mobile-hold-panel .hold-audit{font-size:12px!important;line-height:18px!important;color:#647184!important;gap:2px 10px!important;margin-top:3px!important}
  html body .mobile-hold-panel .hold-audit time{font-size:12px!important;color:inherit}
  html body #dialog[data-sheet=preparation] #dialog-title{display:flex!important;align-items:center;gap:10px;flex:1;min-width:0;margin-right:8px}
  html body #dialog[data-sheet=preparation] #dialog-title .prep-title-label{flex:none}
  html body #dialog[data-sheet=preparation] #dialog-title .prep-customer{font-size:15px!important;line-height:1.35!important;font-weight:600!important;color:#203249!important;-webkit-text-fill-color:#203249!important;min-width:0;white-space:normal;overflow-wrap:anywhere;max-width:none;overflow:visible}
  html body #dialog[data-sheet=preparation] .prep-summary-strip{gap:5px!important;flex-wrap:wrap!important;overflow-x:visible!important;white-space:normal;align-items:center}
  html body #dialog[data-sheet=preparation] .prep-summary-strip>.prep-badge{font-size:13px!important;line-height:26px!important;font-weight:400!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:#667085!important;-webkit-text-fill-color:#667085!important;box-shadow:none!important}
  html body #dialog[data-sheet=preparation] .prep-summary-value{font-size:13px!important;line-height:26px!important;white-space:nowrap}
  html body #dialog[data-sheet=preparation] .prep-summary-value:before{margin-right:5px!important}
  html body #dialog[data-sheet=preparation] .prep-summary-value:nth-last-child(2){font-weight:600!important}
 }
}