/* Workspace chrome. Content and navigation no longer look like one giant page. */
body{background:var(--cg-bg);color:var(--cg-text)}
.visually-hidden{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;
  margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;border:0!important;
}
.app-main h1{font-size:clamp(1.8rem,2.3vw,2.65rem);font-weight:850;letter-spacing:-.04em;line-height:1.12}
.app-main :where(h2,h3){letter-spacing:-.025em}
.app-main .page-eyebrow{letter-spacing:.07em;color:var(--cg-primary);font-size:.7rem}
.app-main .page-header{
  align-items:center;gap:20px;margin-bottom:24px;padding:0 0 24px;
  border-bottom:1px solid var(--cg-border);
}
/* Inventory layout: product/photo first, clean form fields, actions never hidden. */
.inventory-search-shell{margin:0 0 18px;padding:19px 22px}
.inventory-search-shell .inventory-search-form{align-items:end;gap:10px}
.inventory-search-shell .inventory-search-form label{font-size:.8rem}
.inventory-search-shell .inventory-search-form input{margin-top:6px}
.inventory-results.inventory-listings-redesign{
  margin:0;padding:0;border:1px solid var(--cg-border);border-radius:14px;overflow:visible;
}
.inventory-results .inventory-results-header{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:0;padding:17px 22px;border-bottom:1px solid var(--cg-border);
}
.inventory-results .inventory-results-header h2{margin:0;font-size:1.08rem}
.inventory-results .inventory-results-header p{margin-top:3px;font-size:.78rem}
.inventory-results .table-scroll{margin:0;border:0;border-radius:0;overflow-x:auto}
.inventory-results .inventory-pager{margin:0;padding:15px 20px;border-top:1px solid var(--cg-border)}
.inventory-header-actions{gap:11px}
.inventory-header-stats{margin:0;border-radius:10px;background:var(--cg-surface-soft)}
/* Full edit: image rail on the LEFT, listing and card fields to the RIGHT. */
.app-main .edit-section-nav{display:flex;flex-wrap:wrap;gap:7px;margin:16px 0 19px}
.app-main .edit-section-nav a{
  border:1px solid var(--cg-border);background:var(--cg-surface);border-radius:8px;
  font-size:.82rem;min-height:38px;padding:9px 12px;color:var(--cg-text-secondary);font-weight:700;
}
.app-main .edit-section-nav a:hover{background:var(--cg-primary-soft);color:var(--cg-primary)}
.app-main .edit-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.app-main .edit-layout>.edit-section{margin:0;padding:23px}
.app-main .edit-layout .section-heading{margin-bottom:17px}
.app-main .edit-layout .section-heading h2{font-size:1.12rem}
.app-main .edit-layout .edit-photo-grid{gap:11px}
.app-main .edit-photo-grid .edit-photo-card{border-radius:11px}
.app-main .edit-description:not(.is-fullscreen){margin-top:18px;border-radius:10px}
.app-main .edit-fields :where(label,input,select){min-width:0}
.app-main .edit-card-specifics .edit-specifics-grid,
.app-main .edit-listing-attributes .edit-attribute-grid{gap:11px}
.app-main .edit-save-bar{
  border-radius:11px;border:1px solid var(--cg-border);
  background:var(--cg-surface);box-shadow:0 14px 30px rgba(9,24,45,.10);
}
.app-main .edit-top-actions{display:flex;align-items:center;justify-content:flex-end;margin-bottom:12px}
@media(min-width:1180px){
  .app-main .edit-layout{grid-template-columns:minmax(310px,.72fr) minmax(0,1.28fr);align-items:start;gap:16px}
  .app-main .edit-layout>#edit-photos{grid-column:1;grid-row:1/span 3;position:sticky;top:18px;align-self:start;min-width:0}
  .app-main .edit-layout>#edit-listing{grid-column:2;grid-row:1;min-width:0}
  .app-main .edit-layout>#edit-attributes{grid-column:2;grid-row:2;min-width:0}
  .app-main .edit-layout>#edit-marketplace-settings{grid-column:2;grid-row:3;min-width:0}
  .app-main .edit-layout>#edit-photos .edit-photo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .app-main .edit-layout>#edit-photos .edit-photo-grid .edit-photo-media img{max-height:145px}
}
/* Prepare listings and common tables inherit the same workbench design. */
.app-main .batch-grid-scroll,.app-main .table-scroll{border-color:var(--cg-border)}
.app-main .batch-grid-table thead th{background:var(--cg-surface-soft);color:var(--cg-muted)}
.app-main .batch-grid-table tbody tr:nth-child(even){background:var(--cg-surface)}
.app-main .batch-grid-table tbody tr:hover{background:var(--cg-primary-soft)}
.app-main .batch-grid-bulk,.app-main .batch-grid-save{
  padding:17px;border:1px solid var(--cg-border);border-radius:12px;box-shadow:none;
}
.app-main .order-summary-bar>div,.app-main .action-summary-card{
  border:1px solid var(--cg-border);border-radius:12px;background:var(--cg-surface);
}
/* Medium screens use tidy information cards, not sideways-scrolling 8-column tables. */
@media(max-width:1480px){
  .app-main .inventory-results .table-scroll{overflow:visible}
                                    }
@media(max-width:768px){.app-main .edit-layout>#edit-photos{position:static}
  .app-main .edit-layout>.edit-section{padding:17px}
                          }
@media(max-width:430px){.inventory-header-actions{justify-content:flex-start}
  .inventory-header-stats{padding:8px 10px}
  }
@media(prefers-reduced-motion:reduce){
  .app-main .button{transition:none}
}
/* This modal must occupy the FULL viewport, not the image's intrinsic size.
   A tiny eBay thumbnail may be 100px wide: explicit viewport-based image
   dimensions make it large while object-fit preserves its card proportions.
   The dark surface is inside the dialog so every outside tap is delivered to
   our dismiss handler (a native dialog ::backdrop alone is not dependable). */
dialog.inventory-photo-viewer{
  box-sizing:border-box;position:fixed;inset:0;margin:0;
  width:100vw;max-width:100vw;height:100vh;height:100dvh;max-height:100dvh;
  padding:clamp(14px,2vw,28px);border:0;border-radius:0;
  background:rgba(3,9,20,.96);color:#fff;box-shadow:none;overflow:hidden;
}
dialog.inventory-photo-viewer[open]{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
}
dialog.inventory-photo-viewer::backdrop{
  background:rgba(3,9,20,.94);
}
.inventory-photo-viewer-image{
  display:block;flex:0 1 auto;
  width:min(94vw,1100px);height:min(82vh,1000px);height:min(82dvh,1000px);
  max-width:100%;max-height:82dvh;object-fit:contain;
  border:0;border-radius:9px;background:transparent;
  filter:drop-shadow(0 12px 32px rgba(0,0,0,.45));
}
.inventory-photo-viewer-caption{
  margin:0;max-width:94vw;color:#f2f6ff;text-align:center;
  font-size:.83rem;font-weight:650;line-height:1.4;pointer-events:none;
}
.inventory-photo-viewer-close{
  position:fixed;right:max(14px,2vw);top:max(14px,2vh);z-index:1;
  display:grid;place-items:center;
  width:46px;height:46px;padding:0;border:1px solid #dae5ff;
  border-radius:50%;background:#16263a;color:white;
  font-size:1.75rem;line-height:1;cursor:pointer;
}
.inventory-photo-viewer-close:hover,.inventory-photo-viewer-close:focus-visible{
  background:#2c5598;outline:3px solid white;outline-offset:2px;
}
.app-main .inventory-listing-thumb-wrap.photo-zoom.inventory-reference-photo{
  position:relative;
}
@media(max-width:768px){
  dialog.inventory-photo-viewer{
    width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;
    padding:12px;
  }
  .inventory-photo-viewer-image{
    width:calc(100vw - 24px);
    height:76dvh;max-height:76dvh;
  }
  .inventory-photo-viewer-close{
    top:max(10px,env(safe-area-inset-top));right:12px;width:46px;height:46px;
  }
}
@media(prefers-reduced-motion:reduce){
  dialog.inventory-photo-viewer{transition:none;animation:none}
}
/* Phone-first order picking: same photo interaction as Inventory, Custom SKU
   stays the dominant field and a local pick checkbox remains a single tap.
   No eBay fulfillment/inventory mutation is wired to this presentation. */
.app-main .order-pick-table .order-listing-photo{
  width:76px;height:102px;display:grid;place-items:center;overflow:visible;
  background:var(--cg-surface-soft);border-radius:10px;
}
.app-main .order-pick-table .order-listing-photo .inventory-listing-thumb-wrap.photo-zoom{
  display:block;width:100%;height:100%;min-width:0;max-width:100%;
}
.app-main .order-pick-table .order-listing-photo .inventory-photo-open{
  position:static;z-index:auto;display:flex;align-items:center;justify-content:center;
  width:100%;height:100%;margin:0;padding:0;min-width:0;
  background:transparent;border:1px solid var(--cg-border);
  border-radius:10px;box-shadow:none;cursor:zoom-in;
}
.app-main .order-pick-table .order-listing-photo .inventory-photo-open:hover{
  border-color:var(--cg-primary);background:var(--cg-primary-soft);
}
.app-main .order-pick-table .order-listing-photo .inventory-photo-open:focus-visible{
  outline:3px solid var(--cg-primary);outline-offset:2px;
}
.app-main .order-pick-table .order-listing-photo .inventory-photo-open img.photo-zoom-thumb{
  display:block;width:100%;height:100%;max-width:100%;max-height:100%;
  border-radius:9px;object-fit:contain;pointer-events:none;
}
.app-main .order-pick-table .order-listing-photo .photo-zoom-preview{display:none}
.app-main .order-pick-card .pick-sku{
  color:var(--cg-text);font-weight:850;letter-spacing:.015em;
  font-variant-numeric:tabular-nums;
}
.app-main .order-pick-card .pick-check:focus-within{
  outline:3px solid var(--cg-primary);outline-offset:2px;
}
/* Picked box states in both themes (light #fff on dark text was unreadable in dark mode on desktop widths). */
.app-main .pick-check{background:var(--cg-surface-soft);color:var(--cg-text);border-color:var(--cg-border-strong)}
.app-main .pick-check input{flex:none;accent-color:var(--cg-primary);cursor:pointer}
.app-main .pick-check:hover{border-color:var(--cg-primary)}
.app-main .pick-check:has(input:checked){background:var(--cg-primary-soft);border-color:var(--cg-primary)}
.app-main .pick-check:has(input:focus-visible){outline:3px solid var(--cg-primary);outline-offset:2px}
.app-main .pick-check:has(input:disabled){opacity:.6;cursor:not-allowed}
.app-main .pick-check:has(input:disabled) input{cursor:not-allowed}
@media(max-width:768px){
  .app-main .order-pick-card .table-scroll{overflow:visible;border:0}
  .app-main .order-pick-table,.app-main .order-pick-table tbody{
    display:block;width:100%;min-width:0;overflow:visible;
  }
  .app-main .order-pick-table thead{display:none}
  .app-main .order-pick-table tbody{display:grid;gap:12px}
  .app-main .order-pick-table tbody tr[data-pick-row]{
    display:grid;grid-template-columns:88px minmax(0,1fr);
    grid-template-areas:"photo sku" "photo title" "quantity picked";
    gap:7px 13px;align-items:start;min-width:0;
    padding:14px;border:1px solid var(--cg-border);
    border-radius:12px;background:var(--cg-surface);
  }
  .app-main .order-pick-table tbody td{
    display:block!important;min-width:0;width:auto!important;min-height:0;
    margin:0;padding:0!important;border:0!important;
    background:transparent!important;box-shadow:none!important;
    overflow-wrap:anywhere;
  }
  .app-main .order-pick-table td[data-label='Photo']{
    grid-area:photo;align-self:start;
  }
  .app-main .order-pick-table td[data-label='Photo']::before{display:none}
  .app-main .order-pick-table td[data-label='Custom SKU / location']{
    grid-area:sku;
  }
  .app-main .order-pick-table td[data-label='Custom SKU / location']::before{
    content:"Location / Custom SKU";display:block;margin:0 0 4px;
    font-size:.68rem;font-weight:800;letter-spacing:.035em;
    color:var(--cg-muted);line-height:1.3;
  }
  .app-main .order-pick-table td[data-label='Item']{grid-area:title}
  .app-main .order-pick-table td[data-label='Item']::before{display:none}
  .app-main .order-pick-table td[data-label='Pick qty']{grid-area:quantity;align-self:center}
  .app-main .order-pick-table td[data-label='Pick qty']::before{
    content:"Pick";display:block;margin-bottom:3px;
    font-size:.68rem;font-weight:800;color:var(--cg-muted);
  }
  .app-main .order-pick-table td[data-label='Picked']{
    grid-area:picked;align-self:center;
  }
  .app-main .order-pick-table td[data-label='Picked']::before{display:none}
  .app-main .order-pick-table td[data-label='Listing ID']{display:none!important}
  .app-main .order-pick-table .order-listing-photo,
  .app-main .order-pick-table .order-listing-photo-missing{
    width:88px;height:118px;
  }
  .app-main .order-pick-table .pick-sku{
    font-size:clamp(1.2rem,5vw,1.55rem);
    line-height:1.2;word-break:break-word;
  }
  .app-main .order-pick-table .pick-item-title{
    color:var(--cg-text-secondary);
    font-size:.85rem;line-height:1.35;
  }
  .app-main .order-pick-table .pick-qty{
    font-size:1.45rem;font-weight:850;
  }
  .app-main .order-pick-table .pick-check{
    width:100%;min-height:48px;display:flex;justify-content:center;
    padding:9px 10px;background:var(--cg-surface-soft);
    border-color:var(--cg-border-strong);color:var(--cg-text);
  }
  .app-main .order-pick-card.is-focused .order-pick-table tbody{
    gap:16px;
  }
}
@media(max-width:410px){
  .app-main .order-pick-table tbody tr[data-pick-row]{
    grid-template-columns:76px minmax(0,1fr);gap:8px 10px;padding:11px;
  }
  .app-main .order-pick-table .order-listing-photo,
  .app-main .order-pick-table .order-listing-photo-missing{
    width:76px;height:102px;
  }
}

/* Safe recovery for unlocated pick lines: search by exact marketplace Item ID
   rather than treating a reused Custom SKU as a card identity. */
.app-main .order-pick-card .pick-sku.is-missing strong{
  display:block;color:var(--cg-text-secondary);font-size:.82rem;
  font-weight:750;line-height:1.35;
}
.app-main .order-pick-card .pick-location-find{
  display:inline-flex;align-items:center;margin-top:8px;
  color:var(--cg-primary);font-size:.82rem;font-weight:800;
  text-decoration:none;line-height:1.4;
}
.app-main .order-pick-card .pick-location-find:hover,
.app-main .order-pick-card .pick-location-find:focus-visible{
  text-decoration:underline;text-underline-offset:3px;
}


/* Prepare Listings on ordinary laptops: ten crammed columns should not force
   sellers to scroll sideways just to enter a card's price or finish.
   Very wide desktops retain the fast dense spreadsheet; phones retain their
   existing photo-first stack. 761–1540px gets a readable, compact work card. */
@media (min-width:761px) and (max-width:1540px){
  .app-main .batch-grid-scroll{
    width:100%;max-width:100%;min-width:0;
    overflow:visible;border:0;background:transparent;
  }
  .app-main .batch-grid-table,
  .app-main .batch-grid-table tbody{
    display:block;width:100%;min-width:0;max-width:100%;
  }
  .app-main .batch-grid-table tbody{
    display:grid;gap:12px;
  }
  .app-main .batch-grid-table thead{display:none}
  .app-main .batch-grid-table tbody tr{
    display:grid;
    grid-template-columns:72px repeat(4,minmax(0,1fr));
    column-gap:12px;row-gap:9px;align-items:start;
    width:100%;min-width:0;margin:0;padding:16px;
    border:1px solid var(--cg-border);border-radius:13px;
    background:var(--cg-surface);box-shadow:var(--cg-shadow);
  }
  .app-main .batch-grid-table tbody tr:nth-child(even){background:var(--cg-surface)}
  .app-main .batch-grid-table tbody td,
  .app-main .batch-grid-table tbody tr:nth-child(even)>td:first-child,
  .app-main .batch-grid-table tbody tr:nth-child(even)>td:nth-child(2){
    display:block;position:static;left:auto;z-index:auto;
    min-width:0;width:auto;margin:0;padding:0;border:0;
    background:transparent;box-shadow:none;
    align-self:start;
  }
  .app-main .batch-grid-table tbody td::before{
    content:attr(data-label);display:block;margin:0 0 4px;
    font-size:.67rem;font-weight:800;line-height:1.25;
    letter-spacing:.035em;color:var(--cg-muted);
  }
  .app-main .batch-grid-table td:nth-child(1){
    grid-column:1;grid-row:1/span 2;
  }
  .app-main .batch-grid-table td:nth-child(1)::before{display:none}
  .app-main .batch-grid-table td:nth-child(2){
    grid-column:2/span 3;grid-row:1;
  }
  .app-main .batch-grid-table td:nth-child(2)::before{display:none}
  .app-main .batch-grid-table td:nth-child(3){
    grid-column:5;grid-row:1;
  }
  .app-main .batch-grid-table td:nth-child(4){
    grid-column:2/-1;grid-row:2;
  }
  .app-main .batch-grid-table td:nth-child(5){
    grid-column:2;grid-row:3;
  }
  .app-main .batch-grid-table td:nth-child(6){
    grid-column:3;grid-row:3;
  }
  .app-main .batch-grid-table td:nth-child(7){
    grid-column:4;grid-row:3;
  }
  .app-main .batch-grid-table td:nth-child(8){
    grid-column:5;grid-row:3;
  }
  .app-main .batch-grid-table td:nth-child(9){
    grid-column:2/span 3;grid-row:4;
  }
  .app-main .batch-grid-table td:nth-child(10){
    grid-column:5;grid-row:4;
  }
  .app-main .batch-grid-table input,
  .app-main .batch-grid-table select{width:100%;min-height:39px;padding:9px}
  .app-main .batch-grid-table .batch-grid-photo,
  .app-main .batch-grid-table .batch-grid-photo .photo-zoom{
    width:72px;max-width:72px;
  }
  .app-main .batch-grid-table .batch-grid-photo .photo-zoom-thumb{
    width:72px;height:98px;object-fit:contain;
  }
  .app-main .batch-grid-table .batch-grid-identity strong{
    font-size:.96rem;line-height:1.3;
  }
  .app-main .batch-grid-table .batch-grid-status{font-size:.74rem}
  .app-main .batch-grid-table .batch-grid-details-button{min-height:39px}
  .app-main .batch-grid-save{
    position:sticky;bottom:0;z-index:9;
    border:1px solid var(--cg-border);border-radius:12px;
    box-shadow:0 -10px 30px rgba(12,26,45,.10);
  }
}
@media (min-width:761px) and (max-width:1040px){
  .app-main .batch-grid-table tbody tr{
    grid-template-columns:72px repeat(2,minmax(0,1fr));
    gap:9px 12px;
  }
  .app-main .batch-grid-table td:nth-child(1){grid-column:1;grid-row:1/span 2}
  .app-main .batch-grid-table td:nth-child(2){grid-column:2/-1;grid-row:1}
  .app-main .batch-grid-table td:nth-child(3){grid-column:2/-1;grid-row:2}
  .app-main .batch-grid-table td:nth-child(4){grid-column:1/-1;grid-row:3}
  .app-main .batch-grid-table td:nth-child(5){grid-column:1/span 2;grid-row:4}
  .app-main .batch-grid-table td:nth-child(6){grid-column:3;grid-row:4}
  .app-main .batch-grid-table td:nth-child(7){grid-column:1/span 2;grid-row:5}
  .app-main .batch-grid-table td:nth-child(8){grid-column:3;grid-row:5}
  .app-main .batch-grid-table td:nth-child(9){grid-column:1/span 2;grid-row:6}
  .app-main .batch-grid-table td:nth-child(10){grid-column:3;grid-row:6}
}
.app-main .action-row-photo .action-photo-click,
.app-main .action-detail-table .action-photo-click,
.app-main .duplicate-card-photo .action-photo-click{
  display:block;position:relative;width:64px;height:86px;
  padding:0;border:0;background:transparent;box-shadow:none;
}
.app-main .action-row-photo .inventory-listing-thumb-wrap.photo-zoom,
.app-main .action-detail-table .inventory-listing-thumb-wrap.photo-zoom,
.app-main .duplicate-card-photo .inventory-listing-thumb-wrap.photo-zoom{
  display:block;width:100%;height:100%;max-width:100%;
}
.app-main .action-row-photo .inventory-photo-open,
.app-main .action-detail-table .inventory-photo-open,
.app-main .duplicate-card-photo .inventory-photo-open{
  position:static;z-index:auto;display:grid;place-items:center;
  width:100%;height:100%;min-height:0;margin:0;padding:0;
  border:1px solid var(--cg-border);border-radius:9px;
  box-shadow:none;background:var(--cg-surface-soft);cursor:zoom-in;
}
.app-main .action-row-photo .inventory-photo-open:hover,
.app-main .action-detail-table .inventory-photo-open:hover,
.app-main .duplicate-card-photo .inventory-photo-open:hover{
  background:var(--cg-primary-soft);border-color:var(--cg-primary);
}
.app-main .action-row-photo .inventory-photo-open:focus-visible,
.app-main .action-detail-table .inventory-photo-open:focus-visible,
.app-main .duplicate-card-photo .inventory-photo-open:focus-visible{
  outline:3px solid var(--cg-primary);outline-offset:3px;
}
.app-main .action-row-photo .inventory-photo-open .inventory-listing-thumb,
.app-main .action-detail-table .inventory-photo-open .inventory-listing-thumb,
.app-main .duplicate-card-photo .inventory-photo-open .inventory-listing-thumb{
  display:block;width:100%;height:100%;max-width:100%;max-height:100%;
  object-fit:contain;pointer-events:none;border-radius:8px;
}
/* October 9 phone feedback: seller Inventory rows use a narrow photo rail.
   All identifying/price/quantity fields stay BESIDE the thumbnail, while
   actionable buttons sit below across the full card width. No data is hidden. */
@media (max-width:768px){
  .app-main .inventory-results .inventory-results-header{
    padding:12px 13px;gap:9px;align-items:center;flex-wrap:wrap;
  }
  .app-main .inventory-results .inventory-results-header h2{font-size:1rem}
  .app-main .inventory-results .inventory-results-header p{
    font-size:.71rem;line-height:1.25;
  }
  .app-main .inventory-results .inventory-results-header .inventory-pager{
    display:flex;align-items:center;justify-content:flex-start;
    gap:8px;margin:0;padding:0;border:0;flex-wrap:wrap;
    font-size:.73rem;
  }
  .app-main .inventory-results .inventory-results-header .inventory-pager .button{
    padding:7px 10px;min-height:34px;font-size:.72rem;
  }
                            .app-main .inventory-results .inventory-inline-identity{
    width:100%;margin:0;gap:6px;
  }
                          }

/* Inventory: inline pencil editor, never a dialog or keyboard-covered sheet.
   The displayed value is swapped for an input IN THAT SAME GRID CELL. */
.app-main .inventory-results .inventory-inline-edit{
  display:inline-flex;align-items:center;max-width:100%;min-width:0;
  vertical-align:middle;
}
.app-main .inventory-results .inventory-inline-edit.is-editing{
  display:flex;flex:1 1 auto;min-width:0;width:100%;
}
.app-main .inventory-results .inventory-inline-edit [hidden]{
  display:none!important;
}
.app-main .inventory-results .inventory-inline-form{
  display:inline-flex;align-items:center;gap:3px;
  flex:1 1 auto;width:100%;min-width:0;max-width:100%;
  margin:0;padding:0;border:0;background:transparent;box-shadow:none;
}
.app-main .inventory-results .inventory-inline-form input:not([type=hidden]){
  display:block;flex:1 1 auto;min-width:0;width:100%;max-width:none;
  height:36px;min-height:36px;margin:0;padding:5px 7px;
  border:1.5px solid var(--cg-primary);border-radius:7px;
  background:var(--cg-surface-soft);color:var(--cg-text);
  box-shadow:0 0 0 2px var(--cg-primary-soft);
  font:inherit;font-size:.85rem;line-height:1.25;scroll-margin-block:90px;
}
.app-main .inventory-results .inventory-inline-form input:focus-visible{
  outline:2px solid var(--cg-primary);outline-offset:1px;
}
.app-main .inventory-results .inventory-inline-form button{
  display:inline-flex;align-items:center;justify-content:center;
  flex:0 0 29px;width:29px;height:36px;min-width:0;min-height:0;
  margin:0;padding:0;border-radius:7px;
  font-size:1rem;font-weight:800;line-height:1;cursor:pointer;
}
.app-main .inventory-results .inventory-inline-save{
  border:1px solid var(--cg-primary);
  background:var(--cg-primary);color:white;
}
.app-main .inventory-results .inventory-inline-cancel{
  border:1px solid var(--cg-border-strong);
  background:var(--cg-surface-soft);color:var(--cg-text-secondary);
}
.app-main .inventory-results .inventory-pencil{
  display:inline-flex;justify-content:center;align-items:center;
  flex:0 0 23px;width:23px;height:27px;padding:0;
  border:1px solid transparent;background:transparent;
  color:var(--cg-primary);cursor:pointer;
}
.app-main .inventory-results .inventory-pencil:hover,
.app-main .inventory-results .inventory-pencil:focus-visible{
  border-color:var(--cg-border);border-radius:5px;
  background:var(--cg-primary-soft);opacity:1;
}
.app-main .inventory-results .inventory-inline-title{
  display:flex;width:100%;
}
.app-main .inventory-results .inventory-inline-title .inventory-editable-value{
  display:block;width:100%;
}
.app-main .inventory-results .inventory-inline-title .inventory-field-current,
.app-main .inventory-results .inventory-inline-title .inventory-card-name{
  display:inline;overflow-wrap:break-word;min-width:0;
}
/* The pencil sits in the text flow, right after the last word of the title (not at the far edge of the
   column). Its tap area is larger than the glyph; negative margins keep it from growing the row. */
.app-main .inventory-results .inventory-inline-title .inventory-pencil{
  display:inline-flex;vertical-align:middle;flex:none;
  width:36px;height:36px;margin:-8px -4px -8px 0;
}
.app-main .inventory-results .inventory-inline-identity .inventory-field-current{
  overflow-wrap:break-word;
}

@media(max-width:768px){
  .app-main .inventory-results .inventory-inline-title .inventory-pencil{width:44px;height:44px;margin:-12px -10px -12px -2px}
                .app-main .inventory-results .inventory-inline-title .inventory-field-current{
    font-size:.78rem;line-height:1.27;
  }
                                                .app-main .inventory-results .inventory-inline-form input:not([type=hidden]){
    min-height:34px;height:34px;padding:4px 5px;
    font-size:16px; /* prevents auto zoom on iOS/Android input focus */
  }
  .app-main .inventory-results .inventory-inline-form button{
    flex-basis:26px;width:26px;height:34px;font-size:.95rem;
  }
  .app-main .inventory-results .inventory-inline-form{
    gap:2px;
  }
  .app-main .inventory-results .inventory-inline-edit.is-editing{
    max-width:100%;
  }
                }


/* Phone QA Oct 9: Quick Check inherited an always-white light-theme surface,
   which produced almost invisible light text in dark mode. Match the workbench
   theme in every success/warning/neutral state, including disabled-white cards. */
.app-main .inventory-quick-check,
.app-main .inventory-quick-check.state-neutral,
.app-main .inventory-quick-check.state-success,
.app-main .inventory-quick-check.state-warning{
  background:var(--cg-surface-soft);
  color:var(--cg-text);
  border-top:1px solid var(--cg-border);
  border-right:1px solid var(--cg-border);
  border-bottom:1px solid var(--cg-border);
  box-shadow:none;
}
.app-main .inventory-quick-check h2,
.app-main .inventory-quick-check .inventory-quick-check-summary{
  color:var(--cg-text);
}
.app-main .inventory-quick-check .muted{
  color:var(--cg-text-secondary);
}
.app-main .inventory-quick-check .page-eyebrow{
  color:var(--cg-primary);
}
@media(max-width:768px){
  .app-main .inventory-quick-check{
    gap:9px;margin-top:12px;padding:12px 13px;
  }
  .app-main .inventory-quick-check h2{
    font-size:.94rem;line-height:1.28;margin:3px 0 5px;
  }
  .app-main .inventory-quick-check .muted,
  .app-main .inventory-quick-check .inventory-quick-check-summary{
    font-size:.76rem;line-height:1.42;
  }
  .app-main .inventory-quick-check .button{
    min-height:36px;font-size:.78rem;
  }

  
  /* Quantity and price are short values. Do NOT give the number input the
     whole card width while editing; keep it beside a tiny Save/Cancel pair
     in the existing details rail above the mobile keyboard. */
  .app-main .inventory-results .inventory-inline-edit.inventory-inline-quantity.is-editing,
  .app-main .inventory-results .inventory-inline-edit.inventory-inline-price.is-editing{
    display:inline-flex;flex:0 1 auto;
    width:max-content!important;max-width:100%;
    margin:0;
  }
  .app-main .inventory-results .inventory-inline-quantity .inventory-inline-form,
  .app-main .inventory-results .inventory-inline-price .inventory-inline-form{
    display:inline-flex;flex:0 1 auto;
    width:max-content!important;max-width:100%;
    gap:3px;
  }
  .app-main .inventory-results .inventory-inline-quantity .inventory-inline-form input[type=number],
  .app-main .inventory-results .inventory-inline-price .inventory-inline-form input[type=number]{
    box-sizing:border-box;
    width:65px!important;max-width:65px!important;
    flex:0 0 65px!important;
    min-width:0!important;padding:4px 6px;
    font-size:16px;
  }
  .app-main .inventory-results .inventory-inline-quantity .inventory-inline-form button,
  .app-main .inventory-results .inventory-inline-price .inventory-inline-form button{
    box-sizing:border-box;
    flex:0 0 27px;width:27px;min-width:27px;
    height:34px;min-height:34px;
  }

        }


/* Seller-requested printable pull sheet. Browser print only; no eBay writes.
   Uses existing seller listing photos, exact order lines, quantities and
   physical SKU, never an inferred location from a reused Custom SKU. */
@media print {
  body:has(.order-print-scope),
  body:has(.order-print-scope) .app-shell,
  body:has(.order-print-scope) .workspace-content,
  body:has(.order-print-scope) .app-main {
    display:block!important;
    width:100%!important;max-width:none!important;
    min-width:0!important;height:auto!important;min-height:0!important;
    padding:0!important;margin:0!important;
    background:#fff!important;color:#111!important;
    overflow:visible!important;box-shadow:none!important;
  }
  body:has(.order-print-scope) .skip-link,
  body:has(.order-print-scope) .app-sidebar,
  body:has(.order-print-scope) .workspace-topbar,
  body:has(.order-print-scope) .mobile-bottom-nav,
  .order-print-scope .order-view-tabs,
  .order-print-scope .order-focus-nav,
  .order-print-scope .order-header-actions,
  .order-print-scope .order-local-pick-footer,
  .order-print-scope .order-summary-bar,
  .order-print-scope .order-pick-table .pick-check,
  .order-print-scope .photo-zoom-preview,
  .order-print-scope .order-photo-open,
  .order-print-scope .inventory-photo-viewer,
  .order-print-scope .order-pick-table td::before {
    display:none!important;
  }
  .order-print-scope .page-header{
    padding:0 0 10px!important;margin:0 0 12px!important;
    border:0!important;border-bottom:2px solid #1c2736!important;
    display:block!important;
  }
  .order-print-scope .page-header h1{
    color:#111!important;font-size:19pt!important;
    margin:0 0 4px!important;
  }
  .order-print-scope .page-header .page-subtitle{
    color:#333!important;font-size:9pt!important;
  }
  .order-print-scope .page-header .page-eyebrow{display:none!important}
  .order-print-scope .order-sync-note{
    font-size:8pt!important;padding:0!important;
    margin:0 0 10px!important;color:#444!important;
  }
  .order-print-scope .order-pick-card{
    display:block!important;
    padding:8px 0 12px!important;margin:0 0 14px!important;
    border:0!important;border-top:1px solid #555!important;
    border-radius:0!important;box-shadow:none!important;
    background:#fff!important;color:#111!important;
    break-inside:avoid-page;page-break-inside:avoid;
  }
  .order-print-scope .order-pick-header{
    display:flex!important;align-items:flex-start!important;
    justify-content:space-between!important;
    gap:10px!important;margin-bottom:8px!important;
  }
  .order-print-scope .order-pick-header h2{
    color:#111!important;font-size:12pt!important;margin:0!important;
  }
  .order-print-scope .order-pick-header p{
    color:#444!important;font-size:8pt!important;
    margin:2px 0 0!important;
  }
  .order-print-scope .order-pick-statuses .status-pill{
    display:none!important;
  }
  .order-print-scope .table-scroll{display:block!important;overflow:visible!important}
  .order-print-scope .order-pick-table{
    display:table!important;width:100%!important;max-width:100%!important;
    min-width:0!important;border-collapse:collapse!important;
    table-layout:fixed!important;background:#fff!important;
  }
  .order-print-scope .order-pick-table thead{
    display:table-header-group!important;
  }
  .order-print-scope .order-pick-table tbody{
    display:table-row-group!important;
  }
  .order-print-scope .order-pick-table tr[data-pick-row]{
    display:table-row!important;width:auto!important;
    padding:0!important;margin:0!important;
    background:#fff!important;break-inside:avoid;
    page-break-inside:avoid;
  }
  .order-print-scope .order-pick-table td,
  .order-print-scope .order-pick-table th{
    display:table-cell!important;position:static!important;
    padding:5px 6px!important;margin:0!important;
    border:1px solid #bbb!important;box-shadow:none!important;
    background:#fff!important;color:#111!important;
    vertical-align:middle!important;
    font-size:8pt!important;line-height:1.22!important;
    overflow-wrap:anywhere!important;
  }
  .order-print-scope .order-pick-table td:nth-child(1),
  .order-print-scope .order-pick-table th:nth-child(1){width:64px!important}
  .order-print-scope .order-pick-table td:nth-child(2),
  .order-print-scope .order-pick-table th:nth-child(2){width:24%!important}
  .order-print-scope .order-pick-table td:nth-child(4),
  .order-print-scope .order-pick-table th:nth-child(4){width:48px!important;text-align:center!important}
  .order-print-scope .order-pick-table td:nth-child(5),
  .order-print-scope .order-pick-table th:nth-child(5){width:58px!important;text-align:center!important}
  .order-print-scope .order-pick-table td:nth-child(6),
  .order-print-scope .order-pick-table th:nth-child(6){width:85px!important;font-size:7pt!important}
  .order-print-scope .order-pick-table .pick-sku,
  .order-print-scope .order-pick-table .pick-sku strong{
    font-size:12pt!important;font-weight:900!important;
    color:#111!important;line-height:1.14!important;
  }
  .order-print-scope .order-pick-table .pick-sku.is-missing strong{
    font-size:8pt!important;
  }
  .order-print-scope .order-pick-table .pick-location-find{display:none!important}
  .order-print-scope .order-pick-table .pick-item-title{font-size:8pt!important;color:#111!important}
  .order-print-scope .order-pick-table .pick-qty{font-size:14pt!important;font-weight:900!important;color:#111!important}
  .order-print-scope .order-pick-table td[data-label="Picked"]::after{
    display:inline-block!important;
    content:"□";font-size:17pt!important;color:#111!important;
  }
  .order-print-scope .order-pick-table .order-listing-photo,
  .order-print-scope .order-pick-table .order-listing-photo-missing{
    display:block!important;width:54px!important;
    height:72px!important;max-height:72px!important;
    overflow:hidden!important;color:#555!important;
  }
  .order-print-scope .order-pick-table .photo-zoom-trigger{
    display:block!important;width:54px!important;
    height:72px!important;border:0!important;
    padding:0!important;background:#fff!important;
  }
  .order-print-scope .order-pick-table .inventory-listing-thumb{
    display:block!important;width:54px!important;
    height:72px!important;object-fit:contain!important;
  }
}


/* Exact marketplace Item ID is a reliable lookup key even when a reusable SKU
   or unconfirmed card identity cannot safely identify the order line. */
.app-main .order-pick-table .pick-inventory-link{
  display:inline-flex;
  align-items:center;
  margin:5px 0 0;
  padding:2px 0;
  max-width:100%;
  color:var(--cg-primary);
  font-size:.73rem;
  font-weight:750;
  line-height:1.3;
  text-decoration:none;
}
.app-main .order-pick-table .pick-inventory-link:hover,
.app-main .order-pick-table .pick-inventory-link:focus-visible{
  text-decoration:underline;text-underline-offset:2px;
}
@media(max-width:768px){
  .app-main .order-pick-table td[data-label="Item"] .pick-item-title{
    display:block;
  }
  .app-main .order-pick-table .pick-inventory-link{
    min-height:35px;
    font-size:.73rem;
  }
}
@media print{
  .order-print-scope .order-pick-table .pick-inventory-link{
    display:none!important;
  }
}


/* Focused Orders must feel like a picking session on every device.
   Show one original order line at a time, never a copied/synthetic card. */
.app-main .order-print-scope.is-picking-session .pick-session-controls{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:14px;padding:16px 18px;margin:14px 0;
  border:1px solid var(--cg-border);border-radius:14px;
  background:var(--cg-surface);
}
.app-main .pick-session-overview{display:grid;gap:5px;min-width:0}
.app-main .pick-session-overview strong{
  color:var(--cg-text);font-size:clamp(1.2rem,3vw,1.8rem);
  line-height:1.2;
}
.app-main .pick-session-overview [data-pick-guidance]{
  color:var(--cg-text-secondary);font-size:.9rem;
}
.app-main .order-print-scope.is-picking-session .order-summary-bar,
.app-main .order-print-scope.is-picking-session .order-view-tabs{
  display:none;
}
.app-main .order-print-scope.is-picking-session .order-focus-nav{
  margin-bottom:8px;
}
.app-main .order-print-scope.is-picking-session .order-sync-note{
  font-size:.76rem;margin-bottom:8px;
}
.app-main .pick-session-finish{
  width:100%;padding-top:14px;border-top:1px solid var(--cg-border);
}
.app-main .pick-session-finish[hidden]{display:none!important}
.app-main .pick-session-finish .button{
  min-height:50px;display:inline-flex;align-items:center;
}
.app-main .pick-session-actions{display:flex;gap:8px;flex-wrap:wrap}
.app-main .pick-session-actions .button{min-height:48px}
.app-main .pick-session-controls.is-complete{
  border-color:var(--cg-success,#349a70);
}
.app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-pick-table,
.app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-pick-table tbody{
  display:block;width:100%;min-width:0;overflow:visible;
}
.app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-pick-table thead{
  display:none;
}
.app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-pick-table tbody tr[data-pick-row]{
  display:grid;grid-template-columns:112px minmax(0,1fr);
  grid-template-areas:"photo sku" "photo title" "quantity picked";
  gap:12px 20px;align-items:center;padding:18px;
  background:var(--cg-surface-soft);border:1px solid var(--cg-border);
  border-radius:14px;max-width:100%;
}
.app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-pick-table tbody tr[data-pick-row][hidden]{
  display:none!important;
}
.app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-pick-table td{
  display:block;min-width:0;width:auto;border:0;padding:0!important;
  background:transparent;box-shadow:none;overflow-wrap:anywhere;
}
.app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-pick-table td[data-label='Photo']{grid-area:photo}
.app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-pick-table td[data-label='Custom SKU / location']{grid-area:sku}
.app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-pick-table td[data-label='Item']{grid-area:title}
.app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-pick-table td[data-label='Pick qty']{grid-area:quantity}
.app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-pick-table td[data-label='Picked']{grid-area:picked}
.app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-pick-table td[data-label='Listing ID']{display:none}
.app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-listing-photo{
  width:112px;height:150px;
}
.app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .pick-sku strong{
  font-size:clamp(1.45rem,4vw,2.15rem);line-height:1.2;
}
.app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .pick-qty{
  font-size:1.8rem;
}
@media(max-width:650px){
  .app-main .order-print-scope.is-picking-session .pick-session-controls{padding:13px}
  .app-main .pick-session-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}
  .app-main .pick-session-finish .button{display:flex;width:100%;justify-content:center}
  .app-main .pick-session-actions [data-pick-confirm]{grid-column:1/-1;min-height:58px;font-size:1rem}
  .app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-pick-table tbody tr[data-pick-row]{
    grid-template-columns:82px minmax(0,1fr);gap:9px 12px;padding:12px;
  }
  .app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-listing-photo{
    width:82px;height:112px;
  }
}

/* Print must explicitly reverse BOTH the responsive table rules and the
   single-card picking mode. The earlier print rules were less specific than
   mobile's td/grid declarations, leaving the header and row misaligned. */
@media print{
  /* Large batches may span pages; keep each card line intact and repeat the table header. */
  .app-main .order-print-scope .order-pick-card{
    break-inside:auto!important;page-break-inside:auto!important;
  }
  .app-main .order-print-scope .pick-session-controls{display:none!important}
  .app-main .order-print-scope .order-pick-table{
    display:table!important;width:100%!important;min-width:0!important;
    table-layout:fixed!important;border-collapse:collapse!important;
  }
  .app-main .order-print-scope .order-pick-table thead{
    display:table-header-group!important;
  }
  .app-main .order-print-scope .order-pick-table tbody{
    display:table-row-group!important;width:auto!important;
  }
  .app-main .order-print-scope .order-pick-table tbody tr[data-pick-row],
  .app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-pick-table tbody tr[data-pick-row],
  .app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-pick-table tbody tr[data-pick-row][hidden]{
    display:table-row!important;grid-template-areas:none!important;
    width:auto!important;padding:0!important;margin:0!important;
    break-inside:avoid;page-break-inside:avoid;
  }
  .app-main .order-print-scope .order-pick-table tbody td,
  .app-main .order-print-scope.is-picking-session .order-pick-card.is-focused .order-pick-table td{
    display:table-cell!important;width:auto;
    padding:5px 6px!important;border:1px solid #bbb!important;
    background:#fff!important;box-shadow:none!important;
    vertical-align:middle!important;
  }
  .app-main .order-print-scope .order-pick-table td[data-label='Photo'],
  .app-main .order-print-scope .order-pick-table td[data-label='Custom SKU / location'],
  .app-main .order-print-scope .order-pick-table td[data-label='Item'],
  .app-main .order-print-scope .order-pick-table td[data-label='Pick qty'],
  .app-main .order-print-scope .order-pick-table td[data-label='Picked'],
  .app-main .order-print-scope .order-pick-table td[data-label='Listing ID']{
    display:table-cell!important;position:static!important;
  }
  .app-main .order-print-scope .order-pick-table .order-listing-photo{
    display:block!important;width:54px!important;height:72px!important;
  }
  .app-main .order-print-scope .order-pick-table .inventory-listing-thumb-wrap,
  .app-main .order-print-scope .order-pick-table .photo-zoom-trigger,
  .app-main .order-print-scope .order-pick-table .inventory-listing-thumb{
    display:block!important;width:54px!important;height:72px!important;
  }
}


/* Order readiness: a missing location or an ambiguous variation photo must be
   visible before picking, especially on a narrow phone screen. */
.app-main .order-review-tools{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  margin:12px 0 16px;
}
.app-main .order-review-tools [data-pick-filter-summary]{
  color:var(--cg-text-secondary);font-size:.82rem;line-height:1.35;
}
.app-main .order-pick-card[hidden]{display:none!important}
.app-main .order-pick-card .pick-review-note{
  display:block;margin-top:6px;color:var(--cg-warning,#e3ad53);
  font-size:.82rem;font-weight:750;line-height:1.45;
  overflow-wrap:anywhere;
}
.app-main .order-pick-card .order-pick-statuses .status-warning{
  color:var(--cg-warning,#e3ad53);font-weight:800;
}
.app-main .pick-session-review{
  display:flex;flex-direction:column;gap:10px;
  width:100%;padding:14px;margin-top:6px;
  color:var(--cg-text);background:var(--cg-surface-soft);
  border:2px solid var(--cg-warning,#e3ad53);border-radius:12px;
}
.app-main .pick-session-review[hidden]{display:none!important}
.app-main .pick-session-review [data-pick-review-message]{
  font-size:1rem;line-height:1.45;
}
.app-main .pick-session-review .pick-review-ack{
  display:flex;align-items:center;gap:10px;min-height:48px;
  font-weight:750;line-height:1.35;cursor:pointer;
}
.app-main .pick-session-review .pick-review-ack input{
  flex:none;width:24px;height:24px;accent-color:var(--cg-primary);
}
@media(max-width:650px){
  .app-main .order-review-tools{align-items:stretch;flex-direction:column}
  .app-main .order-review-tools .button{width:100%;min-height:48px}
  .app-main .pick-session-review{padding:12px}
}
@media print{
  .app-main .order-print-scope .order-review-tools,
  .app-main .order-print-scope .pick-session-review{
    display:none!important;
  }
  .app-main .order-print-scope .order-pick-card[hidden]{
    display:none!important;
  }
  .app-main .order-print-scope .order-pick-card .pick-review-note{
    color:#111!important;font-size:7pt!important;line-height:1.25!important;
  }
}

/* Four concise readiness metrics: two columns on phones, four on desktop. */
.app-main .order-print-scope .order-summary-bar{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
@media(max-width:900px){
  .app-main .order-print-scope .order-summary-bar{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}


/* Quick Check > Review matches: make the target visibly different even when
   the Listings panel was already on screen (common with one mobile result).
   Pure CSS :target means it works without loading any extra JS. */
.app-main .inventory-results#inventory-results-table{
  scroll-margin-top:16px;
}
.app-main .inventory-match-review-hint{
  display:none;
  margin:0 14px 12px;padding:11px 13px;
  border:1px solid var(--cg-border-strong);
  border-left:4px solid var(--cg-primary);
  border-radius:9px;
  background:var(--cg-primary-soft);color:var(--cg-text);
  font-size:.84rem;line-height:1.45;
}
.app-main .inventory-results#inventory-results-table:target{
  border-color:var(--cg-primary);
  box-shadow:0 0 0 2px var(--cg-primary-soft);
}
.app-main .inventory-results#inventory-results-table:target .inventory-match-review-hint{
  display:block;
}
@media(max-width:768px){
  .app-main .inventory-match-review-hint{
    margin:0 9px 11px;padding:11px;font-size:.8rem;
  }
}
@media print{
  .app-main .inventory-match-review-hint{display:none!important}
}


/* Orders quick find: compact, readable and thumb-friendly on phones. */
.app-main .order-quick-find{
  display:flex;flex-direction:column;gap:6px;flex:1 1 260px;
  font-weight:750;color:var(--cg-text);font-size:.86rem;
}
.app-main .order-quick-find input{
  width:100%;min-height:48px;border:1px solid var(--cg-border-strong);
  border-radius:10px;padding:10px 13px;
  background:var(--cg-surface);color:var(--cg-text);font:inherit;
}
.app-main .order-quick-find input:focus-visible{
  outline:2px solid var(--cg-primary);outline-offset:2px;
}
.app-main .order-quick-find-empty{
  width:100%;margin:0;padding:11px 12px;border-radius:10px;
  background:var(--cg-surface-soft);color:var(--cg-text-secondary);
}
.app-main .order-review-tools [hidden]{display:none!important}
@media(max-width:650px){
  .app-main .order-quick-find{width:100%;flex:auto}
  .app-main .order-quick-find input{font-size:16px}
}
@media print{
  .app-main .order-quick-find,.app-main .order-quick-find-empty{display:none!important}
}

/* A filtered-out Start picking link must actually disappear on phones. */
.app-main .order-header-actions [hidden]{display:none!important}

/* Create from Set: explicit unlisted physical cards are their own source,
   not an automatic restock of eBay quantities. Keep controls usable on phone. */
.app-main .catalog-unlisted-intake{
  width:100%;max-width:100%;
  margin-top:9px;padding:9px 11px;
  border:1px solid var(--cg-border-strong);border-radius:11px;
  background:var(--cg-surface-soft);color:var(--cg-text);
}
.app-main .catalog-unlisted-intake summary{
  display:flex;align-items:center;min-height:46px;
  cursor:pointer;font-size:.88rem;font-weight:750;
  line-height:1.35;list-style-position:inside;
}
.app-main .catalog-unlisted-fields{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:11px;padding:10px 0 3px;
}
.app-main .catalog-unlisted-fields label{
  display:grid;align-content:start;gap:5px;
  min-width:0;font-size:.79rem;font-weight:700;line-height:1.35;
  color:var(--cg-text-secondary);
}
.app-main .catalog-unlisted-fields label.catalog-unlisted-check{
  grid-column:1/-1;display:flex;flex-direction:row;align-items:center;
  gap:10px;min-height:45px;color:var(--cg-text);font-size:.85rem;
}
.app-main .catalog-unlisted-fields input[type=checkbox]{
  flex:none;width:24px;height:24px;accent-color:var(--cg-primary);
}
.app-main .catalog-unlisted-fields input:not([type=checkbox]),
.app-main .catalog-unlisted-fields select{
  width:100%;min-width:0;max-width:100%;height:44px;
  padding:9px 10px;border:1px solid var(--cg-border-strong);
  border-radius:8px;background:var(--cg-surface);color:var(--cg-text);
  font-size:1rem;
}
.app-main .catalog-unlisted-fields small{
  grid-column:1/-1;color:var(--cg-muted);line-height:1.5;
}
@media(max-width:768px){
  .app-main .catalog-unlisted-intake{padding:7px 9px}
  .app-main .catalog-unlisted-fields{
    grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;
  }
}
@media(max-width:420px){
  .app-main .catalog-unlisted-fields{grid-template-columns:minmax(0,1fr)}
}
@media print{
  .app-main .catalog-unlisted-intake{display:none!important}
}

/* Create from Set's local-only physical working draft: phone-first feedback. */
.app-main .catalog-physical-save{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:10px;margin:12px 0;padding:12px 14px;
  border:1px solid var(--cg-border-strong);
  border-radius:12px;background:var(--cg-surface-soft);
}
.app-main .catalog-physical-save p{
  flex:1 1 220px;margin:0;color:var(--cg-text);
  font-size:.84rem;line-height:1.45;
}
.app-main .catalog-physical-save button{
  min-height:44px;white-space:normal;
}
@media(max-width:650px){
  .app-main .catalog-physical-save{padding:12px}
  .app-main .catalog-physical-save p,
  .app-main .catalog-physical-save button{
    flex:1 1 100%;width:100%;
  }
  .app-main .catalog-physical-save button{min-height:48px}
}
@media print{
  .app-main .catalog-physical-save{display:none!important}
}

/* Browse Cards → Pick Your Card selection (one obvious control per card,
   a live count, and a reviewable tray that stays above phone navigation). */
.app-main .pyc-status{
  display:inline-flex;align-items:center;min-height:24px;padding:2px 9px;
  border-radius:999px;border:1px solid var(--cg-border-strong);
  font-size:.74rem;font-weight:800;line-height:1.2;white-space:nowrap;
  background:var(--cg-surface-soft);color:var(--cg-text-secondary);
}
.app-main .pyc-status--listed{border-color:#9cc3a8;background:#ecf8ef;color:#1f6a37}
.app-main .pyc-status--unlisted{border-color:#c9d6ea;background:var(--cg-primary-soft);color:var(--cg-primary)}
.app-main .pyc-status--soldout{border-color:#e6c48f;background:#fff6e6;color:#8a5a12}
.app-main .pyc-status--pyc{border-color:#cdbbe8;background:#f4efff;color:#5b3a99}
:root[data-theme="dark"] .app-main .pyc-status--listed{background:#173a25;color:#9fe0b3;border-color:#2f6b45}
:root[data-theme="dark"] .app-main .pyc-status--soldout{background:#3d2e14;color:#f2cf8f;border-color:#6d5320}
:root[data-theme="dark"] .app-main .pyc-status--pyc{background:#2e2447;color:#d2c0ff;border-color:#55427f}

.app-main .catalog-result-select{display:grid;gap:9px;min-width:0;align-self:start}
/* The shared .card-grid squeezed the old three-column card into ~290px
   columns (one letter per line, ~2,100px tall cards). Use real tiles. */
@media(min-width:769px){
  .app-main .catalog-result-list{grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));align-items:stretch}
  .app-main .catalog-result-list .catalog-result-card{display:flex;flex-direction:column;gap:10px;padding:14px;min-height:0}
  .app-main .catalog-result-list .catalog-result-image{width:auto;display:grid;justify-items:center;gap:4px}
  .app-main .catalog-result-list .catalog-result-image .catalog-thumb{width:150px;height:210px}
  .app-main .catalog-result-list .catalog-result-title h3{margin:0;font-size:1.02rem}
  .app-main .catalog-result-list .catalog-result-main p{margin:6px 0 0}
  .app-main .catalog-result-list .catalog-result-grid{grid-template-columns:1fr;gap:6px;margin:8px 0 0}
  .app-main .catalog-result-list .catalog-result-grid>div:nth-child(3){display:none}
  .app-main .catalog-result-list .catalog-result-card[data-pyc-status="unlisted"] .catalog-result-grid>div:not(:first-child){display:none}
  .app-main .catalog-result-list .catalog-result-select{margin-top:auto;align-self:stretch}
}
.app-main .pyc-pick{
  position:relative;display:flex;align-items:center;gap:11px;
  min-height:52px;padding:10px 14px;border-radius:12px;cursor:pointer;
  border:2px solid var(--cg-primary);background:var(--cg-surface);color:var(--cg-primary);
  font-weight:800;font-size:.95rem;line-height:1.25;user-select:none;
  -webkit-tap-highlight-color:transparent;
}
.app-main .pyc-pick--secondary{min-height:46px;border-width:1px;border-style:dashed;font-size:.88rem}
.app-main .pyc-pick input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.app-main .pyc-pick-box{
  flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:7px;
  border:2px solid currentColor;background:var(--cg-surface);
}
.app-main .pyc-pick-on{display:none}
.app-main .pyc-pick input:checked ~ .pyc-pick-text .pyc-pick-on{display:inline}
.app-main .pyc-pick input:checked ~ .pyc-pick-text .pyc-pick-off{display:none}
.app-main .pyc-pick:has(input:checked){background:var(--cg-primary);border-color:var(--cg-primary);border-style:solid;color:#fff}
:root[data-theme="dark"] .app-main .pyc-pick:has(input:checked){color:#0d1b30}
.app-main .pyc-pick input:checked ~ .pyc-pick-box{background:#fff;border-color:#fff}
.app-main .pyc-pick input:checked ~ .pyc-pick-box::after{
  content:"";width:6px;height:12px;margin-top:-2px;
  border:solid var(--cg-primary);border-width:0 3px 3px 0;transform:rotate(45deg);
}
.app-main .pyc-pick input:focus-visible ~ .pyc-pick-box{outline:3px solid var(--cg-primary);outline-offset:3px}
.app-main .pyc-pick.is-disabled{cursor:not-allowed;border-style:solid;border-color:var(--cg-border-strong);color:var(--cg-muted);background:var(--cg-surface-soft)}
.app-main .pyc-pick-note{margin:0}
.app-main .catalog-result-card.is-selected{
  border-color:var(--cg-primary);box-shadow:0 0 0 2px var(--cg-primary-soft),var(--cg-shadow);
}

.app-main .pyc-selection-bar{
  position:sticky;bottom:12px;z-index:30;display:flex;flex-wrap:wrap;align-items:center;
  justify-content:space-between;gap:10px;margin:16px 0 8px;padding:12px 14px;
  border:1px solid var(--cg-border-strong);border-radius:14px;
  background:color-mix(in srgb,var(--cg-surface) 96%,transparent);
  box-shadow:var(--cg-shadow-raised);backdrop-filter:blur(10px);
}
.app-main .pyc-selection-bar.has-selection{border-color:var(--cg-primary)}
.app-main .pyc-selection-summary{display:grid;gap:2px;min-width:0}
.app-main .pyc-selection-summary strong{font-size:1.05rem}
.app-main .pyc-selection-breakdown{color:var(--cg-text-secondary);font-size:.82rem}
.app-main .pyc-selection-actions{display:flex;gap:8px;flex-wrap:wrap}
.app-main .pyc-selection-actions .button{min-height:46px}
.app-main .pyc-selection-review{flex:1 1 100%;display:grid;gap:10px;max-height:min(52vh,460px);overflow:auto}
.app-main .pyc-selection-review[hidden]{display:none}
.app-main .pyc-review-list{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.app-main .pyc-review-item{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;
  padding:8px 10px;border:1px solid var(--cg-border);border-radius:10px;background:var(--cg-surface-soft);
}
.app-main .pyc-review-item:not(:has(img)){grid-template-columns:minmax(0,1fr) auto}
.app-main .pyc-review-item img{width:40px;height:56px;object-fit:cover;border-radius:4px}
.app-main .pyc-review-info{display:grid;gap:3px;min-width:0}
.app-main .pyc-review-info strong{overflow-wrap:anywhere}
.app-main .pyc-review-info .pyc-status{justify-self:start}
.app-main .pyc-review-info small{color:var(--cg-text-secondary)}
.app-main .pyc-review-remove{min-height:44px}
.app-main .pyc-review-empty{color:var(--cg-muted)}
.app-main .pyc-preview-nav{display:flex;flex-wrap:wrap;align-items:center;gap:10px}

@media(max-width:768px){
  .app-main .pyc-selection-bar{bottom:calc(76px + env(safe-area-inset-bottom));padding:10px 12px}
  .app-main .pyc-selection-actions{flex:1 1 100%}
  .app-main .pyc-selection-actions .button{flex:1 1 0;min-height:48px}
  .app-main .pyc-selection-review{max-height:42vh}
  /* Compact catalog cards so a seller can scan a whole set on a phone. */
  .app-main .catalog-result-card{
    display:grid;grid-template-columns:84px minmax(0,1fr);gap:10px 12px;padding:12px;min-height:0;
  }
  .app-main .catalog-result-image{width:84px}
  .app-main .catalog-result-image .catalog-thumb{width:84px;height:117px}
  .app-main .catalog-result-image small{display:none}
  .app-main .catalog-result-main .catalog-result-source,
  .app-main .catalog-result-grid>div:not(:nth-child(2)){display:none}
  .app-main .catalog-result-card[data-pyc-status="unlisted"] .catalog-result-grid{display:none}
  .app-main .catalog-result-main .catalog-result-grid{grid-template-columns:1fr;margin:6px 0 0}
  .app-main .catalog-result-main p{margin:4px 0 0;font-size:.82rem}
  .app-main .catalog-result-title h3{font-size:1rem;margin:0}
  .app-main .catalog-result-select{grid-column:1/-1;min-width:0}
}
@media print{
  .app-main .pyc-selection-bar,.app-main .pyc-pick{display:none!important}
}
/* Keep focused/scrolled-to card controls clear of the sticky selection bar. */
html:has(.pyc-selection-bar){scroll-padding-bottom:110px}
@media(max-width:768px){html:has(.pyc-selection-bar){scroll-padding-bottom:210px}}