/* One layout contract for both desktop and mobile. Do not hide overflowing data. */
[hidden]{display:none!important}
main,.content,.view,.panel,.detail-pane,.modal,.form-grid,.field,
.page-head>div,.panel-head>div,.group-info>div,.product-cell>div,
.group-detail-title-row,.customer-shop-layout>*,.preview-card,.database-card>div,
.shipping-batch-head>div,.shipping-package-head>div,.shipping-buyer-main>div{min-width:0}
img{max-width:100%}
input,select,textarea{min-width:0;max-width:100%}
textarea{font:inherit;resize:vertical}
.page-head,.panel-head,.head-actions,.status-panel-head,.status-actions,
.detail-tabs,.detail-tab-list,.detail-tab-actions,.procurement-head-actions,
.procurement-totals,.product-safety-bar,.product-safety-actions,.shipping-batch-actions,
.filter-bar,.filter-pills,.region-tabs,.preview-meta,.preview-dates{flex-wrap:wrap;gap:12px}
.page-head>div:first-child,.panel-head>div:first-child{flex:1 1 280px}
.head-actions,.detail-tab-actions{flex:0 1 auto}
.page-head h1,.panel-head h2,.group-info strong,.group-detail-title-row h1,
.product-cell strong,.primary-product-name,.database-card h3,
.shipping-buyer-main strong,.shipping-package-head h4{overflow-wrap:anywhere;line-height:1.5}
.group-info,.product-cell,.product-name{min-width:0}
.group-thumb,.group-market-thumb,.stat-icon,.task-icon,.avatar,.close-btn,.shipping-buyer-chevron{flex-shrink:0}
.group-card-grid,.category-status-section .group-card-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.group-actions{display:flex;flex-wrap:wrap;gap:8px}
.status-card-heading>div{flex-wrap:wrap}.status-card-heading .badge{flex-shrink:0;white-space:nowrap}
.group-status-details>div{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
.group-status-details dd{word-break:normal}
.topbar{gap:16px}.topbar>.search{flex:1 1 240px;max-width:440px;min-width:0}.top-actions{flex-shrink:0}
.search input{min-width:0}.shipping-buyer-search{display:flex;max-width:100%}
.product-spec-column{min-width:0}.product-spec-column>*{overflow-wrap:anywhere;line-height:1.6}
.shipping-packing-row{grid-template-columns:minmax(0,1fr) minmax(85px,.25fr) 65px minmax(85px,.25fr)}
.shipping-packing-product small{display:block}.shipping-package-head{flex-wrap:wrap}
.shipping-buyer-card>summary{min-width:0}.shipping-buyer-main{flex:1 1 auto}
.shipping-buyer-total{max-width:100%;flex-wrap:wrap}
.shipping-batch-title{flex-wrap:wrap}.shipping-summary article,.freight-stats article{min-width:0;overflow-wrap:anywhere}
.freight-content-line{min-width:0;flex-wrap:wrap;align-items:flex-start;gap:8px}
.freight-content-line>div{min-width:0;flex:1 1 140px}
.freight-content-line .text-btn{max-width:100%;text-align:left;white-space:normal;overflow-wrap:anywhere;line-height:1.65}
.freight-content-line label{flex:0 0 auto}.freight-actions{flex-wrap:wrap}
.panel,.shipping-buyer-card{scroll-margin-top:90px}
.database-card{flex-wrap:wrap}.database-actions{flex-wrap:wrap}
.customer-shop-layout{grid-template-columns:minmax(0,1fr) minmax(240px,300px)}
.shop-preview-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.cart-line strong{white-space:normal;overflow:visible;overflow-wrap:anywhere}
.preview-dates>div{min-width:0;flex:1 1 150px}
.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.modal-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.modal-grid>div,.modal-grid strong,.modal-head>div,.front-order-picker span,
.order-view-item-info,.front-order-detail-list article>div{min-width:0;overflow-wrap:anywhere}
.order-history>div{grid-template-columns:135px minmax(0,1fr)}
.order-history p{font-size:13px;overflow-wrap:anywhere;line-height:1.7}
.login-overlay{overflow-y:auto;overscroll-behavior:contain}.login-card{min-width:0;max-width:100%}
.modal-head{gap:16px}.modal-head h2{overflow-wrap:anywhere;line-height:1.5}
.modal{max-width:100%;max-height:calc(100dvh - 40px);overscroll-behavior:contain}
.form-modal{display:flex;flex-direction:column;overflow:hidden}
.form-modal .modal-head,.form-modal .modal-footer{flex-shrink:0;background:var(--control-bg)}
.form-modal #entityForm{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.form-modal #formBody{overflow-y:auto;min-height:0;overscroll-behavior:contain}
.modal-footer{flex-wrap:wrap;gap:10px}
.manual-item-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.manual-item-grid label,.official-order-row>*,.variant-weight-row>*{min-width:0}
.official-order-row{grid-template-columns:repeat(3,minmax(0,1fr)) auto}
.manual-item-actions,.order-items-head,.official-orders-head,.manual-item-top{flex-wrap:wrap;gap:12px}
.product-variant-row{grid-template-columns:minmax(0,1fr) minmax(100px,.4fr) auto}
.variant-preset-row{flex-wrap:wrap}
.table-wrap{max-width:100%;min-width:0;overscroll-behavior-inline:contain}
.table-wrap:focus-visible{outline:2px solid #85b471;outline-offset:-2px}
.responsive-table{width:100%;min-width:0;table-layout:fixed;white-space:normal}
.responsive-table th,.responsive-table td{padding:12px 10px;vertical-align:top;line-height:1.65;overflow-wrap:anywhere;white-space:normal}
.responsive-table th{font-size:12px;letter-spacing:0;text-transform:none}
.responsive-table td{font-size:13px}
.responsive-table td small{font-size:12px;line-height:1.6}
.responsive-table .table-actions-cell button{margin:3px 3px 3px 0;white-space:normal}
.responsive-table .table-actions-cell{white-space:normal!important}
.responsive-table .order-status-select{max-width:100%;font-size:12px;min-height:36px}
.responsive-table td input:not([type=checkbox]){width:100%;min-width:0}
.table-continued-row:before{display:none}
.responsive-table .badge,.responsive-table .recon-result{white-space:normal;line-height:1.5;max-width:100%}
.responsive-table .product-weight-column strong{white-space:normal}
.responsive-table .empty-row{white-space:normal;text-align:center}
@media(min-width:761px){
  body{overflow-x:visible}
  .content{max-width:1600px;padding:28px clamp(18px,2vw,32px) 50px}
  .table-wrap{overflow-x:auto}
  #reconciliationView .table-wrap{overflow-x:auto}
  #reconciliationView .recon-import-details table{min-width:0;table-layout:fixed}
  #reconciliationView .master-order-table th,#reconciliationView .master-order-table td{padding:12px 8px}
  #reconciliationView .master-order-table td:nth-child(1)>strong{font-size:13px}
  .arrival-table{min-width:0!important}
  .front-order-actions{gap:5px}.front-order-actions button{flex:0 1 auto}
}
/* Keep native table columns at every width. Scroll only when readable columns cannot fit. */
@media(min-width:761px){
  .responsive-table.dense-table{min-width:980px}
  .responsive-table.medium-table{min-width:740px}
  #reconciliationView .master-order-table{min-width:980px!important}
  #reconciliationView .master-order-table th:nth-child(1){width:16%}
  #reconciliationView .master-order-table th:nth-child(2){width:13%}
  #reconciliationView .master-order-table th:nth-child(3){width:7%}
  #reconciliationView .master-order-table th:nth-child(4){width:8%}
  #reconciliationView .master-order-table th:nth-child(5){width:12%}
  #reconciliationView .master-order-table th:nth-child(6){width:10%}
  #reconciliationView .master-order-table th:nth-child(7){width:12%}
  #reconciliationView .master-order-table th:nth-child(8){width:9%}
  #reconciliationView .master-order-table th:nth-child(9){width:13%}
  #reconciliationView .master-order-table td:nth-child(5)>strong{font-size:13px;padding:7px;max-width:100%}
  .arrival-table.responsive-table{min-width:980px!important}
  .responsive-table .table-actions-cell .row-action{display:inline-flex;min-height:34px;padding:6px 8px}
  .responsive-table .front-order-actions,.responsive-table .freight-actions{flex-direction:column;align-items:flex-start}
  .responsive-table tbody>tr:nth-child(even){background:#faf6ed}
  .responsive-table .procurement-status{white-space:normal;line-height:1.5}
}
@media(min-width:1200px) and (max-width:1399px){
  .sidebar{width:190px;padding-left:10px;padding-right:10px}
  .sidebar .brand{padding-left:6px;padding-right:6px;font-size:18px}
  .sidebar .nav-item{padding-left:8px;padding-right:8px;font-size:13px;gap:8px}
  .sidebar .subnav{padding-left:14px}
  main{margin-left:190px}.content{padding-left:18px;padding-right:18px}
}
@media(min-width:761px) and (max-width:1199px){
  .customer-shop-layout{grid-template-columns:minmax(0,1fr)}
  .preview-cart{position:static;max-height:none}
  .database-grid,.backup-grid{grid-template-columns:minmax(0,1fr)}
  .status-panel-head{align-items:flex-start}.status-actions{width:100%}
  .status-flow{gap:8px}.status-step{font-size:12px}
  .shipping-packing-row{grid-template-columns:minmax(0,1fr) 85px 50px 85px;gap:8px}
}
@media(max-width:760px){
  body{font-size:14px;overflow-x:visible}
  main{margin-left:0;min-width:0}.content{padding:18px 12px 40px;width:100%}
  .page-head,.panel-head{align-items:flex-start;flex-direction:column;gap:14px}
  .page-head>div:first-child,.panel-head>div:first-child{flex:0 1 auto;width:100%}
  .page-head>button{display:inline-flex;max-width:100%}
  .page-head h1{font-size:24px}.page-head p:not(.eyebrow),.panel-head p{font-size:13px;line-height:1.7}
  .head-actions{width:100%;overflow:visible;flex-wrap:wrap;margin-top:0}
  .head-actions button{flex:1 1 130px;white-space:normal;min-height:44px;font-size:14px}
  .primary,.secondary,.row-action,.group-actions button,.detail-tab-actions .primary{min-height:42px;font-size:13px;line-height:1.5;white-space:normal}
  input:not([type=checkbox]):not([type=radio]),select,textarea,.field select,#detailOrderSort,#orderSort{font-size:16px;min-height:44px}
  .topbar{gap:8px;padding:0 12px;height:66px}.mobile-title{font-size:15px;gap:6px}.top-actions{gap:6px}
  .top-actions .compact{padding:7px 9px;font-size:12px;min-height:40px}.top-actions .icon-btn{display:inline-grid;width:34px;min-width:34px}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.stat-card{gap:8px;align-items:flex-start}
  .stat-card strong{font-size:20px;white-space:normal;overflow-wrap:anywhere}.stat-card span,.stat-card small{font-size:12px}
  .stat-icon{width:32px;height:32px;flex-basis:32px}
  .group-row,.groups-panel .group-row{display:flex;flex-direction:column;align-items:stretch}
  .group-row>div:last-child{flex-wrap:wrap}.group-info small{overflow-wrap:anywhere;font-size:12px}
  .group-card-grid,.category-status-section .group-card-grid{grid-template-columns:minmax(0,1fr)}
  .group-status-details>div{grid-template-columns:minmax(0,1fr)}.group-status-details dt{font-size:12px}.group-status-details dd{font-size:14px}
  .status-actions{display:flex;flex-wrap:wrap;width:100%}.status-actions select{flex:1 1 100%;width:100%}
  .status-actions button{flex:1 1 130px}
  .status-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));row-gap:18px;background:none!important}
  .status-step{min-width:0;font-size:12px;line-height:1.6}.status-step:before{display:none}
  .detail-tabs{align-items:stretch;gap:12px}.detail-tab-list{width:100%;overflow:visible;flex-wrap:wrap;gap:6px 14px}
  .detail-tab-list button{font-size:14px;white-space:nowrap;padding:10px 0}
  .detail-tab-actions{flex-wrap:wrap}.detail-tab-actions button{flex:1}
  .detail-order-toolbar .order-filter-controls,.order-filter-controls{display:flex;flex-wrap:wrap;width:100%}
  .order-filter-controls>*{flex:1 1 180px;min-width:0!important;width:100%}
  .recon-head-actions,.recon-detail-filter{width:100%;align-items:stretch}
  .recon-head-actions>*,.recon-detail-filter>*{max-width:100%;flex:1 1 170px}
  .recon-title-line h2{font-size:18px}.recon-page-title h1{font-size:24px}
  .recon-summary{grid-template-columns:1fr}.recon-summary>div{border-right:0;border-bottom:1px solid var(--line)}
  .upload-card{padding:24px 16px}.upload-card p{line-height:1.7;font-size:13px}
  /* Tables scroll inside their own keyboard-accessible region, never the page. */
  .table-wrap,#reconciliationView .table-wrap,.arrival-table-wrap{overflow-x:auto!important;overflow-y:auto;max-width:100%;-webkit-overflow-scrolling:touch}
  .table-wrap:after{content:'左右滑動查看完整欄位';font-size:12px;padding:10px;left:0}
  .table-wrap .responsive-table,#reconciliationView .master-order-table,.table-wrap .arrival-table{display:table;width:100%;min-width:var(--table-mobile-width,1080px)!important;table-layout:auto;border-collapse:collapse}
  .responsive-table colgroup{display:table-column-group}.responsive-table thead,.arrival-table thead{display:table-header-group}
  .responsive-table tbody{display:table-row-group}.responsive-table tbody>tr,.arrival-table tr{display:table-row;padding:0;border:0;background:transparent}
  .responsive-table th,.responsive-table tbody>tr>td,#reconciliationView .master-order-table th,#reconciliationView .master-order-table td{display:table-cell;width:auto!important;padding:14px 16px;border:0;border-top:1px solid var(--line);font-size:14px;min-width:110px;vertical-align:top;line-height:1.7}
  .responsive-table tbody>tr>td:before,.arrival-table td:before{display:none!important;content:none!important}
  .responsive-table th{white-space:nowrap}.responsive-table td small{font-size:13px}
  .responsive-table td .badge,.responsive-table .order-status-select{font-size:13px;white-space:nowrap}
  .responsive-table td.table-actions-cell{min-width:175px}.responsive-table td:nth-child(1){min-width:180px}
  .responsive-table .master-reconciled-input{min-width:130px}.responsive-table td input{max-width:190px}
  .responsive-table .table-actions-cell button{white-space:nowrap;min-height:42px}
  .responsive-table .product-spec-column{min-width:120px}.arrival-table .arrival-products{min-width:260px}
  .responsive-table .empty-row{height:auto;min-width:0!important;padding:24px!important}
  .customer-shop-layout{display:grid;grid-template-columns:minmax(0,1fr)}.shop-preview-grid{grid-template-columns:minmax(0,1fr);padding:14px}
  .preview-cart{position:static;max-height:none;padding:18px}.preview-options{grid-template-columns:minmax(0,1fr) 85px}
  .preview-card h3,.preview-card-body h3{font-size:17px;overflow-wrap:anywhere}.preview-meta{flex-wrap:wrap}
  .preview-meta span{font-size:12px!important}.customer-preview-head{flex-wrap:wrap}.customer-preview-head>div{min-width:0;flex:1 1 220px}
  .shipping-buyer-search{display:flex!important;width:100%;max-width:100%;height:44px}
  .shipping-batch-list{padding:14px}.shipping-batch{padding:18px 0}.shipping-batch-head{gap:14px}.shipping-batch-actions{flex-wrap:wrap}
  .shipping-buyer-card>summary{gap:14px}.shipping-buyer-main strong{font-size:17px}.shipping-buyer-main small{font-size:13px;line-height:1.6}
  .shipping-buyer-total{width:100%;padding-left:0;gap:10px}.shipping-buyer-meta strong{white-space:normal;font-size:16px}
  .shipping-package-head{padding:12px;gap:12px}.shipping-package-head h4{font-size:15px}.shipping-pack-check{min-height:44px}
  .shipping-packing-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:14px 12px}
  .shipping-packing-header{display:none}.shipping-packing-product{grid-column:1/-1;align-items:flex-start}
  .shipping-packing-product strong{font-size:15px;line-height:1.7}.shipping-packing-product small{font-size:13px}
  .shipping-packing-row>b:nth-of-type(n){display:block;grid-column:auto;text-align:left;white-space:normal;font-size:14px;overflow-wrap:anywhere}
  .shipping-packing-row>b:before{display:block;color:var(--muted);font-size:12px;margin-bottom:4px}
  .shipping-packing-row>b:nth-of-type(1):before{content:'單價'}.shipping-packing-row>b:nth-of-type(2):before{content:'數量'}.shipping-packing-row>b:nth-of-type(3):before{content:'小計'}
  .database-grid,.backup-grid{grid-template-columns:minmax(0,1fr)}.database-card{padding:16px}.database-card p{overflow-wrap:anywhere}
  .modal-backdrop{padding:10px}.modal{max-height:calc(100dvh - 20px);width:100%;border-radius:14px}
  .locked-modal .form-modal{height:calc(100dvh - 20px);max-height:calc(100dvh - 20px)}
  .modal-head{padding:16px}.modal-head h2{font-size:21px}.modal-section{padding:16px}
  .modal-grid,.form-grid,.private-gift-rules,.manual-item-grid,.purchase-grid{grid-template-columns:minmax(0,1fr)!important}
  .manual-item-grid label:nth-child(n){grid-column:auto!important}.field{min-width:0}.field>span{font-size:14px}
  .modal-grid{gap:16px}.modal-grid span{font-size:13px}.modal-grid strong{font-size:15px;line-height:1.6}
  .form-grid{padding:16px;gap:18px}.modal-footer{padding:12px;position:static;gap:8px}
  .modal-footer button{flex:1 1 110px;padding:10px;white-space:normal}
  .official-order-row{grid-template-columns:minmax(0,1fr)}.official-orders-total{align-items:flex-start;overflow-wrap:anywhere}
  .front-order-picker{max-height:42dvh}.front-order-picker small{line-height:1.7;font-size:13px}
  .front-order-summary{font-size:14px;line-height:1.7}.front-order-summary span{border:0}
  .product-variant-row,.variant-weight-row{grid-template-columns:minmax(0,1fr) 42px}
  .product-variant-row>input{grid-column:1/-1}.product-variant-weight{grid-column:1}.product-variant-row>.remove-item{grid-column:2}
  .product-variant-editor{padding:12px}.variant-preset-row{display:flex;flex-wrap:wrap}
  .variant-preset-row>*{max-width:100%}.order-view-item-info dl{grid-template-columns:minmax(0,1fr)}
  .order-view-item-info dd{font-size:14px}.order-view-item-info dt{font-size:12px}
  .order-history>div{grid-template-columns:minmax(0,1fr)}.order-history time{font-size:12px}
  .login-overlay{padding:16px}.login-card{padding:24px 20px}
  .image-cleanup-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,135px),1fr))}
}
@media(max-width:360px){.mobile-title .brand-mark{display:none}.stats-grid{grid-template-columns:minmax(0,1fr)}.status-flow{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-height:600px){.login-overlay{align-items:start}.login-card{margin:8px auto}}

/* Sidebar: normal desktop, slimmer laptop, drawer on narrow windows. */
.notification-toggle{position:relative}
.notification-badge{position:absolute;top:-7px;right:-7px;min-width:19px;padding:2px 4px;border-radius:20px;background:#b76470;color:#fff;font-size:10px;line-height:15px;font-weight:800}
.notification-panel{position:fixed;top:82px;right:20px;width:min(460px,calc(100vw - 24px));max-height:calc(100dvh - 100px);z-index:40;background:#fffdf8;border:1px solid var(--line);border-radius:16px;box-shadow:0 14px 45px #35482f30;display:flex;flex-direction:column;overflow:hidden}
.notification-head{display:flex;justify-content:space-between;gap:12px;padding:18px 18px 8px;flex-shrink:0}
.notification-head h2{font-size:20px;margin:0;color:#43593a}.notification-head p{margin:6px 0;color:var(--muted)}
.notification-filters{display:flex;flex-wrap:wrap;gap:6px;padding:8px 18px 14px;flex-shrink:0}
.notification-filters button{border:1px solid var(--line);border-radius:8px;background:#f5f0e2;color:#43593a;padding:7px 10px}
.notification-filters button[aria-pressed="true"]{background:#43593a;color:#fffdf8}
.notification-list{overflow-y:auto;overscroll-behavior:contain;min-height:0}
.notification-item{display:block;width:100%;border:0;border-top:1px solid var(--line);background:#fffdf8;text-align:left;padding:16px 18px;color:var(--ink);white-space:normal;overflow-wrap:anywhere}
.notification-item:nth-child(even){background:#f5f0e2}.notification-item:hover,.notification-item:focus-visible{background:#e9eee5}
.notification-item strong,.notification-item span,.notification-item small{display:block;line-height:1.7}.notification-item span{margin:5px 0;color:#766b5e}.notification-item small{color:#43593a;font-weight:700}
.notification-empty{padding:20px;text-align:center;color:var(--muted)}
.notification-footnote{margin:0;padding:12px 18px;font-size:12px;line-height:1.7;border-top:1px solid var(--line);color:var(--muted);flex-shrink:0}
@media(max-width:760px){.notification-panel{top:72px;right:12px;max-height:calc(100dvh - 84px)}.notification-item{font-size:14px}.notification-head{padding-top:12px}}
.seller-card .avatar{flex-shrink:0;font-size:12px;white-space:nowrap}
.group-notice-panel{grid-column:1/-1}
.database-panel>summary{list-style:none;cursor:pointer;gap:16px}
.database-panel>summary::-webkit-details-marker{display:none}
.database-panel>summary>div{min-width:0}
.database-panel>summary p{font-weight:400}
.database-panel:not([open])>summary{border-bottom:0}
.database-panel>summary:hover{background:#f5f0e2}
.database-panel>summary:focus-visible{outline:2px solid #43593a;outline-offset:-4px;border-radius:12px}
.database-chevron{flex-shrink:0;color:#43593a;transition:transform .16s ease}
.database-panel[open]>summary .database-chevron{transform:rotate(180deg)}
.database-section-actions{display:flex;justify-content:flex-end;padding:14px 20px}
.group-notice-settings{padding:20px;display:grid;gap:14px;min-width:0}
.group-notice-settings textarea{width:100%;min-height:220px;line-height:1.8;resize:vertical}
.group-notice-settings-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px}
.group-notice-settings>p{margin:0;color:var(--muted);line-height:1.7;overflow-wrap:anywhere}
@media(min-width:761px){
  .topbar>.mobile-title{display:flex;font-size:0;flex:0 0 auto}
  .topbar>.mobile-title>.brand-mark{display:none}
  .mobile-menu-btn{display:inline-grid;width:40px;height:40px;flex:0 0 40px;font-size:18px;padding:0;border-radius:9px}
}
@media(min-width:1200px){
  .sidebar-collapsed .sidebar{display:none}
  .sidebar-collapsed main{margin-left:0}
}
@media(min-width:761px) and (max-width:1199px){
  .sidebar{width:260px;padding:20px 16px;transform:translateX(-105%);visibility:hidden;z-index:42;box-shadow:18px 0 45px rgba(31,44,27,.2)}
  main{margin-left:0}
  .mobile-nav-open .sidebar{transform:translateX(0);visibility:visible}
  .mobile-nav-backdrop{position:fixed;inset:0;z-index:41;background:rgba(53,72,47,.58)}
  .mobile-nav-backdrop:not([hidden]){display:block}
  body.mobile-nav-open{overflow:hidden}
}
@media(max-width:760px){.sidebar{visibility:hidden}.mobile-nav-open .sidebar{visibility:visible}}