/* Shared Open lines system. Screen only: printed invoice typography is independent. */
@media screen {
 html{--sab-scale:1;--control-height:30px;--control-gap:8px}
 body,#app,.personal-visuals body{font-size:13px!important;line-height:1.45}
 :is(#app,#cafe-app,.workspace,dialog) :is(h1){font-size:24px!important;line-height:1.2}
 :is(#app,#cafe-app,.workspace,dialog) :is(h2){font-size:18px!important;line-height:1.3}
 :is(#app,#cafe-app,.workspace,dialog) :is(h3){font-size:15px!important;line-height:1.35}
 :is(#app,#cafe-app,.workspace,dialog) :is(p,td,th,.muted,small){font-size:12px!important}
 :is(label,.select-field,.field){font-size:11px!important;gap:4px!important}
 :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=hidden]):not([type=file]),select,textarea,.select-trigger,button.sab-date-trigger){font-size:12px!important;line-height:1.4;min-height:var(--control-height)!important;border:0!important;border-bottom:1px solid var(--line,#d8d1cd)!important;border-radius:0!important;box-shadow:none!important;background-color:transparent!important;padding:5px 2px!important;box-sizing:border-box;min-width:0;max-width:100%}
 :is(.select-trigger,button.sab-date-trigger){height:var(--control-height)!important}
 :is(input,select,textarea,.select-trigger,.sab-date-trigger):focus-visible{outline:2px solid var(--wine,#6a394a)!important;outline-offset:3px}
 input[type=file]{font-size:12px!important;max-width:100%}
 button,.btn,.portal-link{font-size:12px!important;min-height:30px;padding:5px 10px;border-radius:3px}
 :is(.portal-filters,.filterbar,.report-filters,.filter-grid){gap:8px 14px!important;align-items:end!important;padding:10px 0!important;border:0!important;border-radius:0!important;background:transparent!important;margin-block:12px!important}
 :is(.portal-filters,.filterbar,.report-filters,.filter-grid)>:is(label,.field,.select-field){margin:0!important;gap:4px!important;min-width:0;flex:1 1 140px;max-width:220px}
 :is(.portal-filters,.filterbar,.report-filters)>button{margin:0!important;min-height:30px!important;padding:5px 10px!important}
 :is(.portal-filters,.filterbar,.report-filters) .select-trigger{margin:0!important}
 :is(#app,#cafe-app) :is(.card,.panel){padding:16px!important;border-radius:5px!important;margin-block:0 16px}
 :is(#app,#cafe-app) :is(.two,.grid,.portal-split,.portal-choice-grid){gap:14px!important}
 :is(#app,#cafe-app) :is(.actions,.row-actions,.portal-quick){gap:8px!important}
 :is(#app,#cafe-app) :is(td,th){padding:8px 10px!important;line-height:1.4}
 :is(#app,#cafe-app) th{font-weight:500}
 :is(#app,#cafe-app) :is(.page-head,.portal-toolbar,.portal-breadcrumb,.portal-form-heading){margin-bottom:16px!important;gap:12px!important}
 .owner-layout main,.team-layout main{padding:20px 26px!important}
 .owner-layout .topbar,.team-layout .topbar{height:auto;min-height:56px;padding:8px 26px!important;gap:12px}
 .owner-layout .sidebar,.team-layout .sidebar{padding:16px 12px!important}
 .sidebar .mark .eighty6-wordmark{width:76px!important}.sidebar .mark{padding:8px!important}
 .sidebar nav{gap:3px!important}.sidebar nav button{font-size:12px!important;min-height:32px!important;padding:6px 9px!important;border-radius:3px!important}
 .portal-stat{padding:14px!important;gap:6px!important}.portal-stat>strong{font-size:21px!important}
 .page-savebar{padding:10px 14px!important;gap:10px!important;margin-top:16px!important}
 .page-savebar :is(button,.portal-link){min-height:30px!important;padding:5px 12px!important}
 .draft-toolbar{padding:8px 12px!important;margin-bottom:16px!important;border-radius:4px!important}
 .pagination{margin:12px 0!important;gap:10px!important}.pagination .select-field{max-width:100px;margin:0!important}
 .portal-tabs{gap:18px!important;margin-bottom:14px!important;flex-wrap:wrap}.portal-tabs>a{padding:7px 0!important}
 .portal-facts{gap:14px!important}.portal-facts dt{margin-bottom:4px!important}.portal-facts dd{font-size:13px!important}
 .portal-form label,.portal-form .select-field{margin-block:8px}
 .select-menu{font-size:12px!important}.select-option{font-size:12px!important;min-height:30px!important;padding:6px 10px!important}
 .inventory-table .portal-link{display:inline-flex;padding:2px 6px;align-items:center}
 .inventory-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-block:16px}
 .inventory-metrics>div{display:grid;gap:4px;border-bottom:1px solid var(--line);padding-block:8px}.inventory-metrics span{font-size:11px;color:var(--muted)}.inventory-metrics strong{font-size:16px;font-weight:500}
 .inventory-bar{display:flex;align-items:center;gap:10px}.inventory-bar meter{width:90px;max-width:35%;height:8px;accent-color:var(--wine)}.inventory-bar span{white-space:nowrap}.inventory-explanation{max-width:850px;color:var(--muted)}
 .inventory-table td{font-variant-numeric:tabular-nums}.inventory-table small{display:block;color:var(--muted)}
 .appearance-dialog{border-radius:6px!important;padding:18px!important}
}
@media screen and (max-width:650px){.owner-layout main,.team-layout main{padding:16px!important}.inventory-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.compact-filters>:is(label,.select-field){flex-basis:calc(50% - 14px)!important;max-width:none!important}.inventory-table{overflow:auto}.inventory-table table{min-width:620px}}
/* Preserve usable touch targets and prevent mobile input zoom; desktop stays dense. */
@media screen and (pointer:coarse){html{--control-height:44px}button,.btn,.portal-link,.select-option,.sidebar nav button,.page-savebar button,.page-savebar .portal-link,.portal-filters>button,.report-filters>button{min-height:44px!important}input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px!important}.select-trigger,.sab-date-trigger{font-size:13px!important}}
@media screen {
 :is(.portal-filters,.filterbar,.report-filters,.filter-grid) input:not([type=checkbox]):not([type=radio]){height:var(--control-height)!important}
 #cafe-app .inventory-table .portal-link{display:inline!important;min-height:0!important;padding:0!important;margin:0!important;line-height:1.5!important;white-space:nowrap}
 #cafe-app .inventory-table .portal-link+.portal-link{margin-inline-start:12px!important}
 #cafe-app .inventory-table th:last-child{width:200px}
}
@media screen{.compact-filters{display:flex!important;flex-wrap:wrap!important}.compact-filters>:is(label,.select-field){width:180px;flex:0 1 180px!important;max-width:220px!important}}
@media screen and (max-width:650px){.compact-filters>:is(label,.select-field){width:calc(50% - 14px);flex:1 1 calc(50% - 14px)!important;max-width:none!important}}

/* Fine Lines: compact filters remain in the document, above the results. */
@media screen {
 html{--control-height:28px}
 :is(.portal-filters,.filterbar,.report-filters,.filter-grid){gap:10px 14px!important}
 :is(.portal-filters,.filterbar,.report-filters,.filter-grid)>:is(label,.field,.select-field){font-size:11px!important;line-height:1.35}
 :is(.portal-filters,.filterbar,.report-filters,.filter-grid) :is(input,select,.select-trigger){font-size:12px!important}
 :is(.portal-filters,.filterbar,.report-filters)>:is(button,.btn,.portal-link){min-height:28px!important;padding:4px 10px!important}
 :is(#app,#cafe-app) .product-filters.card{padding:10px 0!important;border:0;border-block:1px solid var(--line,#d8d1cd);border-radius:0!important;background:transparent;margin-block:0 14px!important;box-shadow:none}
 .product-filters>summary{font-size:12px;line-height:1.4;padding:4px 0;font-weight:500}
 .product-filters .filter-grid{grid-template-columns:repeat(4,minmax(0,1fr));margin-block:8px!important;padding:0!important;gap:10px 18px!important}
 .product-filters .filter-grid>:is(label,.field,.select-field){width:100%;max-width:none;margin:0!important;align-content:end}
 .product-filters .actions{margin-block:10px 0!important;gap:8px!important;flex-wrap:wrap}
 .product-filters .actions>button,.catalogue-search form>button{min-height:28px;padding:4px 10px;font-size:12px}
 .catalogue-search{margin-block:12px;}
 .catalogue-search form{padding:0;border:0;border-radius:0;background:transparent;gap:8px}
 .catalogue-search form>input{height:28px!important;min-height:28px!important;font-size:12px!important}
 .product-scope-cards{display:flex;flex-wrap:wrap;gap:0;margin-block:12px 16px;border-block-end:1px solid var(--line,#d8d1cd)}
 .product-scope-cards button{display:flex;align-items:center;gap:8px;min-height:32px;padding:6px 12px;border:0;border-block-end:2px solid transparent;border-radius:0;text-align:start;background:transparent;color:inherit}
 .product-scope-cards button>span{font-size:12px;font-weight:400}
 .product-scope-cards strong{font-size:14px;font-variant-numeric:tabular-nums;font-weight:600}
 .product-scope-cards button>small{display:none}
 .product-scope-cards [aria-pressed=true]{background:transparent;color:var(--wine);border-block-end-color:var(--wine)}
}
@media screen and (max-width:950px){
 .product-filters .filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media screen and (max-width:380px){
 .product-filters .filter-grid{grid-template-columns:minmax(0,1fr)!important}
}
@media screen and (pointer:coarse){
 html{--control-height:44px}
 .product-filters>summary{min-height:44px;box-sizing:border-box;align-content:center}
 .product-filters .actions>button,.catalogue-search form>button,.product-scope-cards button,
 :is(.portal-filters,.filterbar,.report-filters)>:is(button,.btn,.portal-link){min-height:44px!important}
 .catalogue-search form>input{height:44px!important;min-height:44px!important;font-size:16px!important}
 :is(.portal-filters,.filterbar,.report-filters,.filter-grid) :is(input,select){font-size:16px!important}
}

@media screen {
 .pagination{align-items:center!important;gap:6px!important;font-size:11px!important}
 .pagination>button,.pagination>span{min-height:26px!important;height:auto;font-size:11px!important;padding:3px 8px!important;line-height:1.3}
 .pagination>:is(label,.select-field){min-width:0!important;max-width:none!important;flex:0 0 auto!important;display:flex!important;flex-direction:row!important;align-items:center!important;gap:6px!important;font-size:11px!important}
 .pagination .select-wrap{width:58px}.pagination .select-trigger{height:26px!important;min-height:26px!important;font-size:11px!important}
 .inventory-tabs{display:flex;gap:4px!important;border:0!important;margin-block:6px 14px!important;flex-wrap:wrap}
 .inventory-tabs>a{font-size:11px!important;font-weight:500;text-decoration:none!important;padding:5px 10px!important;line-height:1.3;border:0!important;border-radius:3px;min-height:26px;box-sizing:border-box;color:var(--muted)}
 .inventory-tabs>a.selected{background:var(--wine);color:white}
 .delivery-order-details summary{cursor:pointer;font-size:12px}.delivery-order-details ul{padding-inline-start:16px}
}
@media screen and (pointer:coarse){.pagination>button,.pagination .select-trigger,.inventory-tabs>a{min-height:44px!important}.inventory-tabs>a{display:inline-flex;align-items:center}}

@media screen{.pagination>span{white-space:nowrap;display:inline-flex;align-items:center;gap:3px}.pagination .select-field .select-wrap .select-trigger{font-size:11px!important;min-height:26px!important;height:26px!important}}
@media screen and (pointer:coarse){.pagination .select-field .select-wrap .select-trigger{min-height:44px!important;height:44px!important}}

/* Shared section navigation: Products is the reference across workspace pages. */
@media screen {
 :is(.product-tabs,.portal-tabs,.reporting .report-tabs,#app .tabs,.manufacturing-nav>.actions){
  display:flex!important;flex-wrap:wrap!important;align-items:center;gap:4px!important;
  width:auto;max-width:100%;padding:0!important;margin:0 0 16px!important;
  border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;
 }
 :is(.product-tabs,.portal-tabs,.reporting .report-tabs,#app .tabs,.manufacturing-nav>.actions)>:is(a,button){
  display:inline-flex;align-items:center;justify-content:center;flex:0 1 auto!important;
  min-width:0;max-width:100%;min-height:30px!important;height:auto;
  padding:5px 10px!important;margin:0!important;border:1px solid var(--line,#e7e2dc)!important;
  border-radius:9px!important;background:#fff!important;color:var(--ink,#282528)!important;
  font-size:12px!important;font-weight:500;line-height:1.45!important;text-decoration:none!important;
  text-align:center;white-space:normal;overflow-wrap:anywhere;box-shadow:none!important;
 }
 :is(.product-tabs,.portal-tabs,.reporting .report-tabs,#app .tabs,.manufacturing-nav>.actions)>:is(a,button):hover{
  background:var(--rose,#f0e5e7)!important;border-color:#b996a1!important;
 }
 :is(.product-tabs,.portal-tabs,.reporting .report-tabs,#app .tabs,.manufacturing-nav>.actions)>:is(.primary,.selected,[aria-current=page]){
  background:var(--wine,#582633)!important;border-color:var(--wine,#582633)!important;color:#fff!important;
 }
 :is(.product-tabs,.portal-tabs,.reporting .report-tabs,#app .tabs,.manufacturing-nav>.actions)>:is(a,button):focus-visible{
  outline:2px solid var(--wine,#582633)!important;outline-offset:3px;
 }
 .manufacturing-nav{gap:8px;margin-bottom:16px}.manufacturing-nav>.actions{margin-bottom:0!important}
 .sab-dark :is(.product-tabs,.portal-tabs,.reporting .report-tabs,#app .tabs,.manufacturing-nav>.actions)>:is(a,button){background:#2b2b2b!important;color:#f0f0f0!important;border-color:#585858!important}
 .sab-dark :is(.product-tabs,.portal-tabs,.reporting .report-tabs,#app .tabs,.manufacturing-nav>.actions)>:is(.primary,.selected,[aria-current=page]){background:#484848!important;color:#ffffff!important;border-color:#7e7e7e!important}
}
@media screen and (pointer:coarse){
 :is(.product-tabs,.portal-tabs,.reporting .report-tabs,#app .tabs,.manufacturing-nav>.actions)>:is(a,button){min-height:44px!important}
}
/* Loyalty shares the compact field and pagination system. */
#loyal-settings .filter-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 18px}
#loyal-settings .filter-grid>:is(label,.field,.select-field){max-width:none;width:100%}
#loyal-settings>p{max-width:850px;font-size:12px;line-height:1.5}
@media(max-width:1000px){#loyal-settings .filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:500px){#loyal-settings .filter-grid{grid-template-columns:1fr}}

/* Flat monochrome controls: selected state uses an outline, gray is hover-only. */
html.sab-dark body{--wine:#fff;--rose:#222;--dark:#000}
html.sab-dark body :is(button,.btn,.portal-link,.primary,.btn-primary,summary,.select-trigger,.date-trigger,#companion-launcher,#sab-language button){background:transparent!important;background-image:none!important;box-shadow:none!important;color:#fff!important;border-color:#777!important}
html.sab-dark body :is(button,.btn,.portal-link,.primary,.btn-primary,summary,.select-trigger,.date-trigger,#companion-launcher,#sab-language button):hover:not(:disabled){background:#333!important;color:#fff!important}
html.sab-dark body :is(button.active,.selected,button[aria-pressed=true],button[aria-selected=true]){outline:1px solid #fff;outline-offset:-1px;font-weight:700}
html.sab-dark body :is(.session-metric strong,.session-metric,.session-status,.metric,.portal-stat strong){color:#fff!important}
html.sab-dark body .eighty6-wordmark{filter:grayscale(1)}
.boot-shell nav button:disabled{opacity:1;cursor:default}.boot-placeholder{height:12px;border-radius:4px;background:var(--line);margin:14px 0;width:100%;max-width:100%}.boot-short{width:130px}.boot-title{width:220px;height:30px}.boot-value{height:32px;width:100px}.boot-content{margin-top:24px;min-height:220px}.boot-content .boot-placeholder:not(.boot-short){margin-top:28px}.boot-shell .topbar{min-height:80px}.sab-dark .boot-placeholder{background:#333}

/* One dark surface; separation comes from spacing and borders. */
html.sab-dark{--sab-page:#111!important;--paper:#111!important;background:#111!important;color-scheme:dark}
html.sab-dark body{background:#111!important}
html.sab-dark body :is(.card,.panel,.portal-stat,.portal-stats,.portal-intro,.portal-greeting,.welcome,.portal-filters,.ticket,.product-card,.product-detail,.product-page,.builder-group,.builder-option,.app-tile,.portal-list,.sidebar,.rail,.topbar,.workspace,table,tbody,tr,th,td,.product-table,.session-status,.pill,.badge,.tag){background:transparent!important;background-image:none!important;box-shadow:none!important}
html.sab-dark body :is(h1,h2,h3,h4,p,small,.eyebrow){background:transparent!important}
html.sab-dark body meter{accent-color:white;filter:grayscale(1)}
html.sab-dark body meter::-webkit-meter-optimum-value{background:#fff}
html.sab-dark body meter::-moz-meter-bar{background:#fff}
html.sab-dark body .boot-placeholder{background:#333!important}

/* POS cards must share the dark canvas rather than retain light card fills. */
html.sab-dark #pos-app :is(.order-card,.stat-card,.stat,.board-col,.table-floor,.table-place,.summary-block,.table-wrap){background:transparent!important;background-image:none!important;box-shadow:none!important;color:#f5f5f5!important;border-color:#666!important}
html.sab-dark #pos-app :is(.order-card,.stat-card,.stat) :is(strong,h2,h3,p,.order-location){color:#f5f5f5!important}
html.sab-dark #pos-app :is(.order-card,.stat-card,.stat) :is(small,.tag,.muted,.subtle){color:#ccc!important}
html.sab-dark #pos-app .live-clock{color:#ccc!important}
.invoice-attachment{display:grid;gap:12px;min-width:0;margin-block:16px}.invoice-attachment .actions{display:flex;flex-wrap:wrap;gap:10px}.invoice-attachment button{min-height:44px}.invoice-attachment [data-invoice-status]{overflow-wrap:anywhere}
.invoice-camera{width:min(680px,calc(100vw - 32px));max-height:90dvh;overflow:auto;padding:24px;border-radius:16px}.invoice-camera video{display:block;width:100%;max-height:60dvh;background:#000;object-fit:contain;margin-block:16px}.invoice-camera .actions{display:flex;flex-wrap:wrap;gap:12px}.invoice-camera button{min-height:44px}.invoice-camera::backdrop{background:#000b}
.overview-range{display:grid;gap:1rem;margin-block:0 1.5rem}.overview-presets,.overview-custom{display:flex;flex-wrap:wrap;gap:.6rem;align-items:end}.overview-presets button{margin:0;min-height:40px}.overview-presets button[aria-pressed=true]{outline:2px solid currentColor;outline-offset:2px;font-weight:700}.overview-custom label{display:grid;gap:.4rem;margin:0;min-width:130px}.overview-custom input{max-width:100%;box-sizing:border-box}.overview-custom button{margin:0}.overview-bar>span{overflow-wrap:anywhere}
.overview-line-chart{min-width:0}.overview-line-chart svg{display:block;width:100%;height:auto;overflow:visible;color:inherit}.overview-line-chart svg text{fill:currentColor;font:13px system-ui,sans-serif}.overview-grid{stroke:currentColor;opacity:.12;stroke-width:1}.overview-trend{fill:none;stroke:currentColor;stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}.overview-dot{fill:currentColor}.overview-hit{fill:transparent;cursor:pointer;outline:none}.overview-hit:focus{stroke:currentColor;stroke-width:2}.overview-chart-tip{position:fixed;z-index:10000;padding:10px 14px;border:1px solid currentColor;border-radius:8px;background:Canvas;color:CanvasText;box-shadow:0 3px 12px #0002;pointer-events:none;font-size:14px;line-height:1.5}.overview-chart-tip strong{display:block}.portal-split>.card{min-width:0}
.all-order-card{border:1px solid var(--line);border-radius:8px;margin-block:12px;padding:16px}
.all-order-card>summary{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;cursor:pointer;min-height:44px}
.all-order-card>summary>strong:first-child{min-width:80px}
.all-order-card>summary>strong:last-child{margin-inline-start:auto}
.all-order-detail{padding-block-start:24px}
.all-order-detail td small{display:block;white-space:normal}
.all-order-detail .portal-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px}
.all-order-detail .portal-facts dd{margin:6px 0;white-space:nowrap}
.all-order-detail h3{margin-block:20px 12px}
.sidebar,.sidebar nav,.rail{overflow-anchor:none;scroll-behavior:auto}
.recipe-cost-table{overflow-x:auto;margin-block:12px;max-width:100%}
.recipe-cost-table table{width:100%;border-collapse:collapse;min-width:660px;table-layout:auto}
.recipe-cost-table th,.recipe-cost-table td{padding:8px 12px!important;border-bottom:1px solid var(--line);text-align:start;vertical-align:middle;white-space:nowrap}
.recipe-cost-table th:first-child,.recipe-cost-table td:first-child{width:40%;white-space:normal}
.recipe-cost-table .actions{display:flex;flex-wrap:nowrap;gap:8px;margin:0!important}
.recipe-cost-table .actions button{padding:6px 12px;min-height:34px}
.recipe-cost-table small.cost-warning{display:block}
.recipe-cost-table td:has(.line-editor){white-space:normal}
@media(pointer:coarse){.recipe-cost-table .actions button{min-height:44px}}

/* Personal shifts and shared-day closure: compact, responsive in portals and POS dialogs. */
.shift-summary-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr))!important;gap:16px;margin-block:16px}
.shift-summary-grid>.stat-card{min-width:0;margin:0;padding:14px;display:flex;flex-direction:column;gap:8px;border:1px solid var(--border,#d6d1cc);border-radius:8px}
.shift-summary-grid>.stat-card strong{font-size:1.3rem;overflow-wrap:anywhere}
.employee-shift-summary+.employee-shift-summary{margin-block-start:20px}

.employee-shift-view>details{margin-block-start:20px}