:root{font-family:Arial,Helvetica,sans-serif;color:#202122;background:#fff;font-size:16px;font-synthesis:none;--border:#c8ccd1;--muted:#54595d;--blue:#36c;--light:#f8f9fa;--nav:160px}
*{box-sizing:border-box}
body{margin:0}
button,input{font:inherit}
button{cursor:pointer;border:1px solid #a2a9b1;border-radius:3px;background:var(--light);color:#202122;min-height:48px;padding:10px 14px;font-weight:600}
button:hover:not(:disabled){background:#eaecf0}
button:disabled{cursor:default;color:#72777d;background:#f8f9fa}
button:focus-visible,input:focus-visible{outline:3px solid #36c;outline-offset:2px}
input{min-width:0;width:100%;min-height:48px;border:1px solid #a2a9b1;border-radius:3px;padding:10px;background:#fff;color:#202122}
label{display:block;font-size:14px;color:#54595d}
label input{display:block;margin-top:6px;color:#202122}
h1{font-size:28px;line-height:1.2;margin:0 0 8px}
h2{font-size:20px;line-height:1.3;margin:0 0 16px}
p{line-height:1.5}
a{color:#36c}
.primary{background:#36c;color:#fff;border-color:#36c}
.primary:hover:not(:disabled){background:#2a4b8d;color:#fff}
.primary:disabled{background:#c8ccd1;color:#54595d;border-color:#c8ccd1}
.secondary{background:#fff}
.muted{color:#54595d}
.small{font-size:13px}
.error{color:#b32424;background:#fff3f3;border-left:3px solid #b32424;padding:10px 12px}
.success:not(:empty){color:#246b35;background:#f3faf4;border-left:3px solid #246b35;padding:10px 12px}
#message:empty{display:none}
[hidden]{display:none!important}
#navigation{position:fixed;inset:0 auto 0 0;width:var(--nav);background:#f8f9fa;border-right:1px solid var(--border);display:flex;flex-direction:column;padding:24px 10px;gap:8px;z-index:10}
.brand{font-size:21px;font-weight:700;padding:0 10px 25px}
.nav-button{border:1px solid transparent;text-align:left;background:transparent;font-size:15px;font-weight:400}
.nav-button.selected{border-color:#a3baff;background:#eaf1ff;color:#244b9c;font-weight:700}
.nav-button.future{background:transparent}
.future span{display:block;font-size:12px;margin-top:4px;color:#72777d}
.logout{margin-top:auto}
.workspace{margin-left:var(--nav);padding:28px 32px;max-width:2040px}
.cart-line strong{white-space:nowrap;font-weight:400}
.total-row{display:flex;justify-content:space-between;gap:12px;padding:20px 0;border-top:1px solid #a2a9b1;margin-top:16px;align-items:baseline}
.total-row strong{font-size:26px;white-space:nowrap}
#receipt table{border-collapse:collapse;width:100%;font-size:13px}
#receipt th{text-align:right;font-size:11px;color:#54595d;background:#f8f9fa;border-bottom:1px solid var(--border);padding:8px 4px;white-space:nowrap}
#receipt td{padding:10px 4px;border-bottom:1px solid #eaecf0;text-align:right;vertical-align:top}
#receipt td:first-child,#receipt th:first-child{text-align:left;width:40%}
#receipt td:not(:first-child){white-space:nowrap}
.qr-notice{font-size:13px;line-height:1.5;background:#f8f9fa;border:1px solid var(--border);padding:12px}
.qr-block{text-align:center;padding:12px;border:1px solid var(--border)}
.qr-block canvas{max-width:100%;height:auto;image-rendering:pixelated}
.qr-block p{margin:6px 0;font-size:13px}
.receipt-actions{display:grid;gap:10px;margin-top:18px}
.login{width:min(420px,calc(100% - 32px));margin:10vh auto;padding:28px;border:1px solid #a2a9b1;border-radius:4px}
.login form{display:grid;gap:18px}
.login>p{color:#54595d;margin:0 0 28px}
.login h2{border-top:1px solid var(--border);padding-top:24px}
.login #message{margin:20px 0 0}
dialog{border:1px solid #a2a9b1;border-radius:4px;width:min(460px,calc(100% - 32px));padding:24px}
dialog::backdrop{background:#0005}
dialog form{display:grid;gap:16px}
.checkbox{display:flex;align-items:center;gap:10px}
.checkbox input{width:24px;min-height:24px;height:24px;margin:0}
.dialog-actions{display:flex;justify-content:flex-end;gap:10px}
.admin-row{display:grid;grid-template-columns:minmax(0,1fr) 140px 100px 110px 100px;align-items:center;gap:16px;padding:14px 16px;border-bottom:1px solid var(--border);font-size:15px}
.admin-row:first-child{border-top:1px solid var(--border)}
.admin-row.inactive{color:#72777d;background:#f8f9fa}
.status-label{font-size:13px}
.active-toggle{min-height:44px;min-width:44px;padding:8px 10px;background:#fff;font-weight:600}
.active-toggle[aria-pressed="true"]{background:#eaf1ff;color:#244b9c;border-color:#36c}
.active-toggle[aria-pressed="false"]{color:#54595d;border-style:dashed}
.admin-row .name{overflow-wrap:anywhere}

/* A bounded workspace, with explicit scroll regions rather than page clipping. */
.workspace { height:100vh; height:100dvh; padding:16px 24px; display:flex; flex-direction:column; gap:10px; min-height:0; }
.page-header { display:flex; justify-content:space-between; align-items:center; flex:none; gap:16px; }
.page-header h1 { margin:0; font-size:26px; }
.page-header p { margin:2px 0 0; color:var(--muted); font-size:13px; }
.separator { padding:0 8px; }
.environment { font-size:12px; color:var(--muted); }
.workspace > #message { flex:none; margin:0; max-height:64px; overflow:auto; }
#pos-view { flex:1; min-height:0; }
.pos-layout { height:100%; min-height:0; display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:20px; }
.product-area { display:flex; flex-direction:column; min-height:0; min-width:0; gap:8px; }
.section-heading { display:flex; justify-content:space-between; align-items:center; gap:8px; flex:none; margin-bottom:0; }
.section-heading h2 { margin:0; }
#half-next { min-height:44px; font-size:14px; padding:8px 10px; }
#half-next[aria-pressed="true"] { background:#244b9c; color:#fff; border-color:#244b9c; box-shadow:inset 0 0 0 2px #fff; }
.product-grid { display:grid; flex:1; min-height:0; min-width:0; gap:8px; overflow:auto; padding:2px; align-content:stretch; }
.product-card { border:1px solid var(--border); border-radius:4px; padding:2px; background:#fff; display:grid; grid-template-rows:minmax(56px,1fr) 56px; gap:4px; min-width:0; min-height:122px; }
.product-card.in-sale { border-color:#146b2e; background:#e6f4ea; box-shadow:inset 0 0 0 1px #146b2e; }
.product-card.in-sale .product-step { background:#e6f4ea; border-color:#146b2e; }
.product-card.invalid { border-color:#b32424; }
.product-split { position:relative; display:grid; grid-template-columns:1fr 1fr; min-height:56px; }
.product-step { width:100%; min-width:44px; min-height:56px; display:flex; align-items:flex-end; justify-content:center; padding:3px; font-size:18px; }
.product-minus { border-radius:3px 0 0 3px; }
.product-add { border-radius:0 3px 3px 0; border-left:0; }
.product-title { position:absolute; inset:5px 4px auto; text-align:center; pointer-events:none; line-height:1.15; font-size:17px; overflow-wrap:anywhere; }
.product-fields { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:4px; }
.product-fields label { font-size:12px; line-height:12px; white-space:nowrap; }
.product-fields input { font-size:14px; margin:0; padding:4px; min-height:44px; height:44px; text-align:center; }
.sale-panel { border:1px solid #a2a9b1; background:#fff; border-radius:4px; padding:14px; min-width:0; min-height:0; display:flex; flex-direction:column; }
#cart { display:flex; flex-direction:column; gap:10px; height:100%; min-height:0; }
#cart h2 { margin:0; }
#cart-empty { margin:0; }
#cart-lines { flex:1; min-height:0; overflow:auto; }
.cart-line { display:flex; justify-content:space-between; gap:10px; border-bottom:1px solid #eaecf0; padding:6px 0; font-size:13px; line-height:1.25; }
.cart-line span { overflow-wrap:anywhere; }
.cart-line strong { white-space:nowrap; font-weight:400; }
#cart .total-row { margin:0; padding:10px 0; flex:none; }
#cart > .small { margin:0; }
#preview,#clear-sale { width:100%; margin:0; min-height:44px; }
#receipt { min-height:0; overflow:auto; overscroll-behavior:contain; }
#products-view { flex:1; min-height:0; overflow:auto; }
.receipt-open .product-area { visibility:hidden; }
.receipt-open .sale-panel { grid-column:1/-1; grid-row:1; width:min(680px,100%); justify-self:center; }
.receipt-open .product-area { grid-column:1; grid-row:1; }

@media (min-width:1600px) {
    .pos-layout { grid-template-columns:minmax(0,1fr) 420px; gap:28px; }
    .workspace { padding:24px 40px; }
    .product-grid { gap:14px; }
    .product-card { padding:8px; grid-template-rows:minmax(56px,1fr) 56px; }
    .product-title { font-size:21px; top:18%; }
}
@media (max-width:1100px), (max-height:500px), (orientation:portrait) {
    :root { --nav:128px; }
    .workspace { padding:8px 12px; gap:6px; }
    .page-header h1 { font-size:22px; }
    .page-header p,.environment { display:none; }
    .pos-layout { grid-template-columns:minmax(0,1fr); grid-template-rows:minmax(0,1fr) 88px; gap:6px; }
    .sale-panel { padding:4px 6px; }
    #cart { display:grid; grid-template-columns:minmax(95px,1fr) minmax(0,1.2fr) minmax(0,1fr); grid-template-rows:30px 44px; gap:4px 6px; }
    #cart h2,#cart > .small { display:none; }
    #cart-empty,#cart-lines { grid-column:1/-1; grid-row:1; font-size:12px; }
    #cart .total-row { grid-column:1; grid-row:2; border:0; padding:0; display:flex; flex-direction:column; justify-content:center; gap:0; font-size:11px; line-height:1.15; }
    #cart .total-row strong { font-size:19px; }
    #preview { grid-column:2; grid-row:2; }
    #clear-sale { grid-column:3; grid-row:2; }
    #preview,#clear-sale { font-size:12px; padding:3px; }
    .product-grid { gap:6px; }
    .product-title { font-size:14px; }
    .product-fields label { font-size:10px; }
    .receipt-open .pos-layout { grid-template-rows:minmax(0,1fr); }
    .receipt-open .sale-panel { width:100%; padding:12px; }
    .admin-row { grid-template-columns:minmax(0,1fr) 100px 80px 90px; }
    .admin-row .order { display:none; }
}
@media (orientation:portrait) {
    :root { --bottom-nav:64px; }
    #navigation { inset:auto 0 0; width:100%; height:var(--bottom-nav); padding:4px; flex-direction:row; gap:2px; border-right:0; border-top:1px solid var(--border); padding-bottom:max(4px,env(safe-area-inset-bottom)); }
    .brand { display:none; }
    .nav-button { flex:1; min-width:0; padding:4px 2px; text-align:center; font-size:12px; line-height:1.2; min-height:44px; }
    .future span { font-size:10px; margin-top:2px; }
    .logout { margin:0; }
    .workspace { margin:0; height:calc(100vh - var(--bottom-nav)); height:calc(100dvh - var(--bottom-nav)); padding:6px; }
    .page-header h1 { font-size:20px; }
    .section-heading h2 { font-size:17px; }
    #half-next { font-size:13px; }
    .admin-row { grid-template-columns:minmax(0,1fr) 88px; gap:8px; padding:12px 4px; }
    .admin-row .active-toggle { grid-column:1; grid-row:2; justify-self:start; }
    .admin-row .product-edit { grid-column:2; grid-row:2; }
    .login { margin:6vh auto; }
}
@media (max-height:500px) and (orientation:landscape) {
    :root { --nav:112px; }
    .page-header { display:none; }
    #navigation { padding:8px 4px; gap:4px; overflow:auto; }
    .brand { font-size:17px; padding:0 6px 6px; }
    .nav-button { min-height:44px; padding:4px 8px; }
    .future span { font-size:10px; margin-top:0; }
    .pos-layout { grid-template-rows:minmax(0,1fr) 54px; }
    #cart { grid-template-columns:110px minmax(0,1fr) 160px 145px; grid-template-rows:44px; }
    #cart-lines,#cart-empty { grid-column:2; grid-row:1; }
    #cart .total-row,#preview,#clear-sale { grid-row:1; }
    #preview { grid-column:3; }
    #clear-sale { grid-column:4; }
    .receipt-open .pos-layout { grid-template-rows:minmax(0,1fr); }
}
/* Sales table owns both scroll axes. Normal rows share a measured height budget. */
.workspace { min-width:0; }
#sales-view { flex:1; min-height:0; min-width:0; display:flex; flex-direction:column; gap:6px; position:relative; --sales-row-height:45px; --sales-header-height:58px; --sales-date-height:30px; }
#sales-status { margin:0; font-size:13px; max-height:60px; overflow:auto; flex:none; }
#sales-status:empty { display:none; }
#sales-status:not(.error) { position:absolute; top:0; left:0; z-index:8; background:#fff; padding:4px 8px; }
/* Compact only the three read/admin routes; POS and danger headers stay intact. */
.workspace[data-current-view="sales"],.workspace[data-current-view="products"],.workspace[data-current-view="stock"] { padding:8px; gap:6px; }
.workspace[data-current-view="sales"] .page-header h1,.workspace[data-current-view="products"] .page-header h1,.workspace[data-current-view="stock"] .page-header h1 { font-size:20px; }
.workspace[data-current-view="sales"] .page-header p,.workspace[data-current-view="products"] .page-header p,.workspace[data-current-view="stock"] .page-header p,
.workspace[data-current-view="sales"] .environment,.workspace[data-current-view="products"] .environment,.workspace[data-current-view="stock"] .environment { display:none; }
#products-view .section-heading { margin-bottom:6px; justify-content:flex-start; }
#new-product { min-height:44px; padding:6px 10px; }
#admin-products { width:min(850px,100%); min-width:740px; }
#admin-products .admin-row { grid-template-columns:minmax(160px,1fr) 90px 140px 100px 80px; gap:8px; padding:1px 6px; min-height:48px; font-size:14px; background:#fff; }
#admin-products .admin-row:nth-child(even) { background:#f1f2f3; }
#admin-products .admin-row.inactive { color:#54595d; }
#admin-products .admin-row.inactive .name { font-weight:400; }
#admin-products .admin-row .name { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#admin-products .admin-row .order { display:block; font-size:12px; }
#admin-products .admin-row .active-toggle,#admin-products .admin-row .product-edit { grid-column:auto; grid-row:auto; justify-self:stretch; min-height:44px; height:44px; padding:4px 8px; }
#stock-view { display:flex; flex-direction:column; gap:6px; overflow:hidden; }
.stock-toolbar { display:flex; align-items:center; gap:8px; flex:none; flex-wrap:wrap; }
#stock-table .stock-nonzero{font-weight:700}
#stock-table .stock-positive{color:#146b2e;font-weight:700}
#stock-table .stock-negative{color:#b00020;font-weight:700}
#stock-clear-status:empty{display:none}
#stock-clear-status{margin:0;font-size:13px}
#stock-clear-dialog{max-height:90dvh;overflow:auto}
.stock-toolbar label { display:flex; align-items:center; gap:6px; font-size:13px; }
.stock-toolbar input { width:152px; margin:0; min-height:44px; height:44px; padding:4px; }
#stock-weekday { font-size:13px; }
#stock-table { overflow:auto; min-height:0; overscroll-behavior:contain; }
#stock-table table { width:560px; min-width:500px; table-layout:fixed; font-size:14px; }
#stock-table th,#stock-table td { padding:4px 6px; height:30px; background:#fff; }
#stock-table td:last-child { padding-top:0; padding-bottom:0; }
#stock-table .stock-edit { min-width:44px; width:100%; height:44px; min-height:44px; padding:0 4px; }
#stock-table th { position:sticky; top:0; background:#eaecf0; }
#stock-table th:first-child { width:44%; }
#stock-table tbody tr:nth-child(even) td { background:#f1f2f3; }
@media (orientation:portrait) { .stock-toolbar label { flex-direction:column; align-items:flex-start; gap:2px; } }
.sales-toolbar,.sales-pagination { display:flex; align-items:center; justify-content:space-between; gap:8px; flex:none; }
.sales-toolbar p { margin:0; font-size:13px; max-height:60px; overflow:auto; }
.sales-toolbar button,.sales-pagination button { min-height:44px; padding:6px 12px; }
#sales-export-dialog { width:min(370px,calc(100% - 24px)); max-height:calc(100dvh - 24px); overflow:auto; padding:16px; }
#sales-export-dialog h2 { margin:0 0 12px; font-size:18px; }
#sales-export-form { display:flex; flex-wrap:wrap; align-items:flex-end; gap:10px; margin:0; }
#sales-export-form label { margin:0; font-size:13px; }
#sales-export-form .local-date-control { margin-top:2px; }
#sales-export,#sales-export-close { min-height:44px; padding:6px 12px; }
#sales-export-status { flex-basis:100%; font-size:13px; }
#sales-export-status:empty { display:none; }
.sales-pagination { overflow-x:auto; min-width:0; padding-bottom:2px; }
.sales-pagination > * { flex-shrink:0; white-space:nowrap; }
#sales-date { width:132px; min-height:44px; margin:0; }
.sales-pagination .local-date-control { width:174px; margin:0; }
.sales-pagination button { font-size:13px; padding:6px 8px; }
@media (max-width:340px) { #sales-page { display:none; } }
#sales-scroll { flex:1; min-height:0; min-width:0; overflow:auto; border:1px solid var(--border); overscroll-behavior:contain; }
#sales-table { border-collapse:separate; border-spacing:0; table-layout:auto; width:max-content; font-size:13px; }
#sales-table th,#sales-table td { min-width:48px; width:auto; height:var(--sales-row-height); padding:0 2px; border-right:1px solid #eaecf0; border-bottom:1px solid var(--border); text-align:right; background:#fff; }
#sales-table .sale-cancel{min-width:44px;min-height:44px;height:44px;padding:0 6px;font-size:13px}
#sale-cancel-dialog{max-height:90dvh;overflow:auto}
#sale-cancel-status:empty{display:none}
#sales-table .sales-column-label{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;max-width:80px;max-height:48px;overflow:hidden;overflow-wrap:anywhere}
#sales-table .day-total td:nth-child(n+3),#sales-table .sales-total{white-space:nowrap}
#sales-table summary{min-width:44px}
#sales-table .sale-unit-price{max-width:100px;white-space:normal;overflow-wrap:anywhere}
#sales-table thead th { position:sticky; top:0; z-index:4; height:var(--sales-header-height); background:#eaecf0; text-align:center; overflow-wrap:anywhere; line-height:16px; }
#sales-table tr:not(.day-row)>:first-child { min-width:70px; width:70px; position:sticky; left:0; z-index:2; text-align:left; }
#sales-table tr:not(.day-row)>:nth-child(2) { min-width:110px; width:110px; max-width:110px; position:sticky; left:70px; z-index:2; text-align:left; border-right:2px solid #a2a9b1; }
#sales-table thead tr:not(.day-row)>:first-child,#sales-table thead tr:not(.day-row)>:nth-child(2) { z-index:6; }
#sales-table .customer-cell { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#sales-table .day-row th { position:sticky; left:0; z-index:3; text-align:left; border-top:3px solid #72777d; background:#f8f9fa; height:var(--sales-date-height); white-space:nowrap; }
#sales-table .day-row td { border-top:3px solid #72777d; background:#f8f9fa; height:var(--sales-date-height); }
#sales-table .sale-row.stripe td { background:#f1f2f3; }
#sales-table .day-total td { background:#eaf1ff; font-weight:600; border-bottom:3px solid #72777d; }
#sales-table summary { cursor:pointer; min-height:44px; list-style:none; white-space:nowrap; line-height:20px; padding:2px 0; }
#sales-table summary::-webkit-details-marker { display:none; }
#sales-table summary:focus-visible { outline:3px solid #36c; }
.sale-unit-price { padding:8px 0; font-size:12px; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; clip-path:inset(50%); overflow:hidden; white-space:nowrap; }
/* Inventory and quantity-only views retain the POS card touch geometry. */
.quantity-view{flex:1;min-height:0;display:flex;flex-direction:column;gap:6px}
.quantity-view>button,.quantity-view>.dialog-actions{flex:none;min-height:44px}
#orders-view>.dialog-actions{gap:4px}#orders-view>.dialog-actions button{flex:1;min-width:44px;min-height:44px;font-size:12px;padding:6px}
.quantity-view p{margin:0;font-size:13px;max-height:44px;overflow:auto}
.quantity-only{grid-template-columns:1fr}
.baking-default{min-width:44px;min-height:44px;height:44px;padding:2px;font-size:12px;align-self:end}
.pending-order-control{display:flex;align-items:center;gap:4px;min-width:0}
#pending-order-count{font-size:13px;font-weight:700;white-space:nowrap}
#pos-orders-open{min-height:44px;font-size:13px;padding:6px}
select{font:inherit;min-height:44px;width:100%;max-width:100%;background:white;border:1px solid #a2a9b1}
.inventory-scroll{flex:1;min-height:0;overflow:auto}
.inventory-scroll table{width:100%;border-collapse:collapse}
.inventory-scroll td,.inventory-scroll th{padding:10px 4px;text-align:right;border-bottom:1px solid var(--border)}
.inventory-scroll td:first-child,.inventory-scroll th:first-child{text-align:left}
.order-toolbar{display:flex;flex-wrap:wrap;align-items:end;gap:6px;flex:none}
.order-toolbar label{flex:1;min-width:120px}
.order-toolbar input{margin:0;min-height:44px;height:44px;padding:4px}
.order-toolbar button{min-height:44px;padding:6px;font-size:13px}
#order-weekday{font-size:12px}
#orders-list>article{border-bottom:1px solid var(--border);padding:2px 0}
#orders-list button{min-height:44px;margin:0;font-size:13px}
#orders-dialog,#pos-orders-dialog{max-height:90dvh;overflow:auto}
@media (orientation:portrait){.nav-button{min-width:44px;font-size:10px;overflow-wrap:anywhere}#navigation{overflow-x:auto}.order-toolbar label{min-width:130px}.order-toolbar button{flex:1}}
@media (max-height:500px) and (orientation:landscape){#navigation .brand{display:none}.order-toolbar label{min-width:140px}.order-toolbar{flex-wrap:nowrap}.order-toolbar button{white-space:nowrap}}
/* Eight readable targets: own scrolling nav, never page overflow. */
@media (orientation:portrait){#navigation{overflow-x:auto;overflow-y:hidden}.nav-button{flex:0 0 76px;min-width:76px;font-size:12px;overflow-wrap:normal}}
#settings-view{max-width:850px;padding-bottom:16px}
#reset-confirm-form{display:grid;gap:16px;margin-top:16px}
#reset-counts dl{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px}
#reset-counts dt,#reset-counts dd{margin:0;padding:4px 0}
#reset-dialog{max-height:85dvh;overflow:auto}
#order-grid .product-card{min-height:110px;grid-template-rows:minmax(56px,1fr) 44px}
#order-grid .product-fields label{font-size:0;line-height:0}
#order-toolbar{min-width:0}
.order-toolbar{display:grid;grid-template-columns:minmax(0,1fr) 145px;gap:6px;align-items:start}
.order-toolbar label{min-width:0!important}
.order-date-group{width:145px;position:relative}
.order-date-group #order-weekday{position:absolute;right:0;top:2px}
#order-date{width:145px;font-size:14px}
#order-weekday{font-size:11px;line-height:12px}
.workspace[data-current-view="orders"] .page-header p,.workspace[data-current-view="orders"] .environment{display:none}
.workspace[data-current-view="orders"] .page-header h1{font-size:20px}
#baking-status:empty,#order-status:empty{display:none}
#baking-view .section-heading:has(#baking-status:empty){display:none}
.order-toolbar label:first-child{position:relative}
#order-customer-options{position:absolute;top:100%;left:0;min-width:100%;width:max-content;max-width:min(330px,90vw);max-height:220px;overflow:auto;background:#fff;border:1px solid var(--border);z-index:9;box-shadow:0 2px 6px #0002}
.customer-option{display:block;width:100%;padding:10px 6px;min-height:44px;cursor:pointer;font-size:14px;color:#202122;overflow-wrap:anywhere;border-bottom:1px solid var(--border)}
.customer-option[aria-selected="true"],.customer-option:hover{background:#eaf1ff}
/* Customer report: bounded pages and an independently scrollable dense table. */
.workspace[data-current-view="customers"]{padding:8px;gap:6px}
.workspace[data-current-view="customers"] .page-header h1{font-size:20px}
.workspace[data-current-view="customers"] .page-header p,.workspace[data-current-view="customers"] .environment{display:none}
#customers-view{display:flex;flex-direction:column;flex:1;min-width:0;min-height:0;gap:6px;position:relative}
.customer-toolbar{display:flex;align-items:end;gap:8px;flex:none;overflow-x:auto;padding-bottom:2px}
.customer-toolbar label{flex:none;margin:0;font-size:12px}
.customer-toolbar input{width:160px}
.customer-toolbar input,.customer-toolbar select,.customer-toolbar button{min-height:44px;margin:0}
#customers-valuation{font-size:12px;margin:0;flex:none}
#customers-status{position:absolute;top:100px;left:0;z-index:5;background:#fff;margin:0;max-height:44px;overflow:auto}
#customers-status:empty{display:none}
#customers-scroll{flex:1;min-width:0;min-height:0;overflow:auto;border:1px solid var(--border);overscroll-behavior:contain}
#customers-list{width:max-content;border-collapse:separate;border-spacing:0;font-size:13px}
#customers-list th,#customers-list td{padding:1px 6px;border-right:1px solid #eaecf0;border-bottom:1px solid var(--border);height:44px;background:#fff}
#customers-list thead th{position:sticky;top:0;z-index:4;background:#eaecf0;max-width:150px;line-height:16px}
#customers-list .customer-row:nth-child(even) td{background:#f1f2f3}
#customers-list td:first-child{min-width:160px;max-width:260px;overflow-wrap:anywhere}
#customers-list .customer-number{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
#customers-list button,#customers-pagination button{min-height:44px;min-width:44px;padding:4px 8px;font-size:13px;white-space:nowrap}
#customers-pagination{display:flex;align-items:center;gap:8px;flex:none;overflow-x:auto}
#customers-page{font-size:12px;white-space:nowrap}
#sales-table .day-total strong{font-weight:700}
#sales-table .day-total .sales-daily-grand-total{font-size:17px;font-weight:900}
#daily-metrics .daily-complete{color:#14833b}
#daily-metrics .daily-revenue{font-size:19px;font-weight:900}
/* Local calendar uses the dialog top layer, including above order-list dialogs. */
.local-date-control{display:flex;align-items:center;width:145px;max-width:100%;height:44px;margin-top:6px}
.local-date-control input,#order-date,.stock-toolbar .local-date-control input{width:calc(100% - 44px);min-width:0;flex:1;height:44px;min-height:44px;margin:0;padding:3px;font-size:12px;border-radius:3px 0 0 3px}
.order-toolbar .local-date-control,.stock-toolbar .local-date-control{margin-top:0}
.local-date-control button{flex:0 0 44px;width:44px;min-height:44px;height:44px;padding:0;border-radius:0 3px 3px 0;font-size:22px}
.calendar-popup{width:326px;max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);padding:8px;overflow:auto;overscroll-behavior:contain}
.calendar-header{display:flex;align-items:center;gap:0}
.calendar-header button{flex:0 0 44px;width:44px;padding:0;min-height:44px;font-size:22px}
.calendar-title{flex:1;text-align:center;font-size:13px;overflow-wrap:anywhere}
.calendar-weekdays,.calendar-days{display:grid;grid-template-columns:repeat(7,minmax(44px,1fr));text-align:center}
.calendar-weekdays{font-size:12px;line-height:24px}
.calendar-days button{width:44px;min-width:44px;min-height:44px;height:44px;padding:0;font-size:14px;border:0}
.calendar-days [aria-selected=true]{background:#36c;color:#fff}
.calendar-days [aria-current=date]{box-shadow:inset 0 0 0 2px #36c}
.calendar-footer{display:flex;justify-content:space-between;gap:6px;margin-top:4px}
.calendar-footer button{min-width:44px;min-height:44px;padding:4px 10px}
#calendar-language{max-width:230px;min-height:44px}
/* Compact receipt: lines left, payment QR right, bounded accessible scrolling. */
.receipt-open .sale-panel{width:min(760px,100%);padding:8px}
#receipt h2{margin:0 0 6px;font-size:18px}
.receipt-content{display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:10px;align-items:start}
#receipt table{font-size:13px}
#receipt th,#receipt td{padding:4px;border-bottom:1px solid var(--border)}
#receipt tbody tr:nth-child(even){background:#f1f2f3}
#receipt .qr-block{padding:0;border:0}
#receipt .qr-block canvas{display:block;width:190px;max-width:100%;height:auto}
#receipt .total-row{margin:6px 0 0;padding:6px 0}
#receipt .total-row strong{font-size:23px}
#receipt .receipt-actions{display:flex;gap:6px;margin:6px 0 0}
#receipt .receipt-actions button{flex:1;min-height:44px;padding:6px;font-size:14px}
#receipt .qr-notice{margin:0;padding:6px}
@media (max-width:500px){.receipt-content{grid-template-columns:minmax(0,1fr) 105px;gap:4px}#receipt .qr-block canvas{width:105px}#receipt table{font-size:11px}#receipt th{font-size:10px}#receipt td:first-child,#receipt th:first-child{width:auto}#receipt .qr-block p{font-size:11px}#receipt .qr-notice{font-size:11px}}
@media (max-height:450px) and (min-width:501px){.receipt-content{grid-template-columns:minmax(0,1fr) 160px}#receipt .qr-block canvas{width:160px}}
#receipt .variable-symbol{font-variant-numeric:tabular-nums;white-space:nowrap}
@media (max-width:340px){.receipt-content{grid-template-columns:1fr}#receipt .qr-block canvas{width:160px;margin:auto}}
#pos-order-details-dialog{max-height:85dvh;overflow:auto}
#pos-order-details table{width:100%;border-collapse:collapse;font-size:15px;margin-bottom:10px}
#pos-order-details td{padding:6px;border-bottom:1px solid var(--border)}
#pos-order-details tr:nth-child(even){background:#f1f2f3}
#pos-order-details td:last-child{white-space:nowrap;text-align:right}
#pos-order-details-ok{width:100%;min-height:44px}
#pos-orders-dialog .dialog-actions{margin-top:10px}
/* Full-page order report shares the dense sales table language. */
.workspace[data-current-view="orders-list"]{padding:8px;gap:6px}
.workspace[data-current-view="orders-list"] .page-header h1{font-size:20px}
.workspace[data-current-view="orders-list"] .page-header p,.workspace[data-current-view="orders-list"] .environment{display:none}
#orders-list-view{flex:1;min-height:0;min-width:0;display:flex;flex-direction:column;gap:6px;position:relative}
.orders-report-toolbar{display:flex;align-items:center;gap:8px;flex:none;flex-wrap:wrap}
.orders-report-toolbar label{display:flex;align-items:center;gap:6px}
.orders-report-toolbar .local-date-control{margin:0}
#orders-filter-weekday{font-size:12px}
#orders-report-status{position:absolute;top:52px;left:0;z-index:8;background:#fff;margin:0;padding:2px 6px;font-size:13px;max-height:44px;overflow:auto}
#orders-report-status:empty{display:none}
#orders-scroll{flex:1;min-height:0;min-width:0;overflow:auto;border:1px solid var(--border);overscroll-behavior:contain}
#orders-table{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%;font-size:13px}
#orders-table th,#orders-table td{padding:1px 5px;border-right:1px solid #eaecf0;border-bottom:1px solid var(--border);background:#fff;min-width:48px;height:30px;white-space:nowrap}
#orders-table thead th{position:sticky;top:0;z-index:4;background:#eaecf0;text-align:center;height:48px;max-width:100px;white-space:normal;overflow-wrap:anywhere}
#orders-table .orders-column-label{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;max-width:80px;max-height:48px;line-height:16px;overflow:hidden;overflow-wrap:anywhere}
#orders-table thead th:nth-child(n+5):not(:last-child){width:64px}
#orders-table td:nth-child(3){max-width:200px;overflow:hidden;text-overflow:ellipsis}
#orders-table .orders-created{font-variant-numeric:tabular-nums;white-space:nowrap}
#orders-table .orders-quantity{text-align:center;font-variant-numeric:tabular-nums}
#orders-table .orders-price{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
#order-confirm-dialog{max-height:calc(100dvh - 32px);overflow:auto}
#order-confirm-summary{overflow-wrap:anywhere}
#order-confirm-summary ul{padding-left:24px}
#order-confirm-dialog .dialog-actions{position:sticky;bottom:-24px;padding:12px 0;background:#fff}
#orders-table tr[data-order-id]>td:first-child{text-align:center}
#orders-table tr[data-order-id]:nth-child(even) td{background:#f1f2f3}
#orders-table .orders-date-row th{height:28px;text-align:left;background:#f8f9fa;border-top:2px solid #72777d}
#orders-table .orders-day-pending th,#orders-table .orders-day-pending td{height:30px;background:#fff4d6;color:#7a4b00;font-weight:600}
#orders-table .orders-day-total th,#orders-table .orders-day-total td{height:30px;background:#eaf1ff;font-weight:600;border-bottom:3px solid #72777d}
#orders-table .orders-day-total th{text-align:left}
#orders-table button,.orders-report-toolbar button,#orders-pagination button{min-width:44px;min-height:44px;height:44px;padding:4px 8px;font-size:13px}
#orders-pagination{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;flex:none}
#orders-pagination button{white-space:nowrap;padding:4px;font-size:12px}
#order-inspect-dialog{max-height:85dvh;overflow:auto}
@media (max-width:450px){#orders-filter-weekday{display:none}.orders-report-toolbar{gap:4px}.orders-report-toolbar label{font-size:12px}.orders-report-toolbar button{font-size:12px}}
@media print{#orders-list-view{display:none!important}}
@media print{.receipt-content{grid-template-columns:1fr}#receipt .qr-block canvas{width:170px;margin:auto}}
@media print{#baking-view,#stock-view,#orders-view,#settings-view{display:none!important}}
@media print { #sales-view { display:none!important; } }
@media print { #sales-view { display:none!important; } }
/* Reconciliation uses a single bounded inner scroll area on short screens. */
.reconciliation-view{display:flex;flex-direction:column;min-height:0;min-width:0;flex:1;gap:8px;overflow:hidden}
.pair-heading{display:flex;align-items:center;gap:8px;flex:none;min-width:0}.pair-heading h2{margin:0;font-size:18px;overflow-wrap:anywhere}.pair-heading>button:last-child{margin-left:auto}
.pair-scroll{min-height:0;min-width:0;overflow:auto;overscroll-behavior:contain;padding:0 2px 8px}
.reconciliation-view p{margin:6px 0;font-size:13px;line-height:1.4}.pair-warning{padding:8px;border-left:3px solid #ac6600;background:#fff4d6;color:#704600}
#pair-summary{overflow:auto}#pair-summary table{border-collapse:collapse;font-size:13px}#pair-summary th,#pair-summary td{padding:5px 8px;border:1px solid var(--border);white-space:nowrap;text-align:right}#pair-summary th{background:#f8f9fa}#pair-summary th:first-child{text-align:left}
.pair-legend{font-size:13px}.pair-legend summary{min-height:44px;padding:12px 4px;cursor:pointer}.pair-tabs{display:flex;gap:6px;margin:6px 0}.pair-tabs [aria-pressed="true"]{background:#eaf1ff;border-color:#36c;color:#244b9c}
.reconciliation-view button,.reconciliation-view input,.reconciliation-view select,#pair-detail button,#pair-confirm button{min-height:44px;min-width:44px;padding:6px 10px;font-size:13px}
.pair-filters{display:flex;align-items:end;gap:8px;margin:8px 0;flex-wrap:wrap}.pair-filters label{max-width:100%;flex:0 1 230px}.pair-filters input{margin-top:3px}.pair-filters select{display:block;margin-top:3px;width:100%;border:1px solid #a2a9b1;border-radius:3px;background:white;color:#202122}
.pair-table-scroll{max-height:48dvh;overflow:auto;border:1px solid var(--border);min-height:64px}#pair-table{width:max-content;min-width:100%;border-collapse:separate;border-spacing:0;font-size:13px}#pair-table th,#pair-table td{padding:2px 6px;border-bottom:1px solid var(--border);max-width:250px;overflow-wrap:anywhere;vertical-align:middle;background:#fff}#pair-table th{text-align:left;position:sticky;top:0;background:#eaecf0;z-index:1}#pair-table tr:nth-child(even) td{background:#f8f9fa}#pair-table .pair-error td{background:#fff0f0;color:#8f1d1d}.pair-pagination{display:flex;align-items:center;gap:8px;margin-top:8px;flex-wrap:wrap}.pair-pagination span{font-size:12px}
#pair-detail,#pair-confirm{max-height:calc(100dvh - 24px);overflow:auto}#pair-detail{width:min(1000px,calc(100% - 24px));padding:16px}.pair-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.pair-detail-grid section{min-width:0}.pair-detail-grid dl{margin:0}.pair-detail-grid dt{font-size:12px;color:#54595d}.pair-detail-grid dd{margin:2px 0 10px;white-space:pre-wrap;overflow-wrap:anywhere}.pair-detail-grid pre{font-size:12px;white-space:pre-wrap;overflow-wrap:anywhere}.pair-detail-grid h3{font-size:16px}.pair-detail-grid h4{font-size:14px}
@media(max-width:600px){.pair-heading{flex-wrap:wrap}.pair-heading h2{font-size:16px}.pair-heading>button:last-child{margin-left:0}.pair-filters{gap:4px}.pair-filters label{flex:1 1 130px}.pair-detail-grid{grid-template-columns:minmax(0,1fr)}#pair-confirm{padding:16px}.pair-heading>button{flex-shrink:0}}
@media print{#reconciliation-view{display:none!important}}
/* Service hub and bank delivery log: bounded scrolling, never page overflow. */
.service-hub,.bank-log-view{display:flex;flex-direction:column;gap:12px;min-width:0;overflow:auto}
.service-hub>button{align-self:flex-start;min-height:44px}
.bank-log-heading{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.bank-log-heading h2{margin:0}.bank-log-toolbar,#bank-log-pagination{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:none}.bank-log-toolbar .checkbox{margin-right:auto}.bank-log-view #bank-log{min-height:0;overflow:auto;overscroll-behavior:contain;border:1px solid var(--border)}
#bank-log table{width:max-content;min-width:100%;border-collapse:separate;border-spacing:0;font-size:13px}#bank-log th,#bank-log td{padding:6px 8px;min-height:38px;border-right:1px solid #eaecf0;border-bottom:1px solid var(--border);background:#fff;text-align:left;vertical-align:top;overflow-wrap:anywhere;max-width:260px}#bank-log th{position:sticky;top:0;z-index:2;background:#eaecf0;white-space:nowrap}#bank-log tbody tr:nth-child(even) td{background:#f8f9fa}#bank-log tbody tr.bank-log-error td{background:#fff0f0;color:#8f1d1d}#bank-log-pagination{justify-content:flex-end}#bank-log-pagination button{min-width:44px;min-height:44px}
@media (max-width:600px){.bank-log-heading{align-items:stretch;flex-direction:column;gap:6px}.bank-log-heading button{align-self:flex-start}.bank-log-toolbar{justify-content:space-between}.bank-log-view{padding-bottom:8px}}
@media (orientation:landscape) and (min-height:501px) and (max-height:700px){
    #navigation{padding:10px 6px;gap:4px;overflow-y:auto}
    #navigation .brand{padding:0 8px 10px}
    #navigation .nav-button{min-height:44px;padding:6px 8px;flex-shrink:0}
}
@media print {
    body { background:#fff; }
    #navigation,.page-header,#message,.product-grid,.section-heading,#cart,#products-view,.receipt-actions,dialog { display:none!important; }
    .workspace { margin:0; padding:0; height:auto; display:block; }
    .pos-layout,.receipt-open .pos-layout { display:block; height:auto; }
    .sale-panel,.receipt-open .sale-panel { border:0; position:static; max-width:80mm; padding:0; display:block; }
    .pos-layout>div:first-child { display:none; }
    #receipt { display:block!important; overflow:visible; }
    #receipt .total-row strong { font-size:20px; }
    @page { margin:10mm; }
}
/* Notes stay collapsed for the common empty case. */
.order-toolbar{grid-template-columns:minmax(0,1fr) 145px 44px}
#order-note-panel{position:relative;align-self:start;margin-top:16px;font-size:12px;min-width:0}
#order-note-panel summary{cursor:pointer;min-height:44px;display:flex;align-items:center;padding:4px 8px;border:1px solid var(--border);border-radius:4px}
#order-note{position:absolute;z-index:15;right:0;top:100%;width:min(340px,calc(100vw - 20px));min-height:88px;max-height:160px;resize:vertical;font:14px Arial,sans-serif;border:1px solid var(--border);padding:6px;background:#fff;box-shadow:0 3px 8px #0003}
.order-note-text,#order-status{white-space:pre-wrap;overflow-wrap:anywhere}
.daily-view{padding:0 4px 12px}
.daily-toolbar{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.daily-toolbar label,.daily-toolbar input{margin:0}
#daily-status[data-state="error"]{color:#9b2226;font-weight:700}
#daily-metrics{display:grid;grid-template-columns:minmax(0,1fr) max-content;max-width:780px;margin:12px 0;border-top:1px solid var(--border)}
#daily-metrics dt,#daily-metrics dd{margin:0;padding:8px 6px;border-bottom:1px solid var(--border)}
#daily-metrics dd{text-align:right;font-weight:700;white-space:nowrap}
#daily-notes article{max-width:780px;border-bottom:1px solid var(--border);padding:6px 0}
#daily-notes h3{font-size:15px;margin:4px 0;overflow-wrap:anywhere}
#daily-notes p{margin:4px 0}