.sp-side, .sp-side *, .sp-bar, .sp-bar *, .sp-sheet, .sp-sheet * { box-sizing: border-box; }
.sp-side, .sp-bar, .sp-sheet { font-family: var(--sp-font-ui); -webkit-font-smoothing: antialiased; line-height: 1.35; }
.sp-side button, .sp-bar button, .sp-sheet button { font: inherit; }
.sp-side [hidden], .sp-bar [hidden], .sp-sheet[hidden], .sp-side-sub[hidden] { display: none !important; }

                                             
.sp-side { flex: 0 0 var(--sp-side-width); width: var(--sp-side-width); background: var(--sp-side-bg); color: var(--sp-side-brand);
  padding: 18px 12px; display: flex; flex-direction: column; gap: 2px; border-right: 1px solid var(--sp-side-edge);
  position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.sp-side .sp-brand { padding: 4px 10px 18px; font-weight: 600; font-size: 20px; letter-spacing: -0.3px; color: var(--sp-side-brand); text-decoration: none; }
.sp-side .sp-brand:hover { color: var(--sp-side-brand); }
.sp-side-group { padding: 16px 10px 6px; font-size: 12px; color: var(--sp-side-group); }
.sp-side .sp-side-item { min-height: var(--sp-target); padding: 0 10px; display: flex; align-items: center; justify-content: space-between; gap: 8px;
  color: var(--sp-side-link); border-radius: var(--sp-radius-item); text-decoration: none; font-size: 15px; }
.sp-side .sp-side-item:hover { color: var(--sp-side-brand); }
.sp-side .sp-side-item.is-current { background: var(--sp-side-active-bg); color: var(--sp-side-active-ink); font-weight: 600; }
.sp-side .sp-side-settings { margin-top: auto; }
                                                                                                                               
.sp-account-names { display: flex; flex-direction: column; min-width: 0; }
.sp-account-who, .sp-account-biz { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sp-account-who { font-size: 14px; color: var(--sp-side-brand); }
.sp-account-biz { font-size: 12px; color: var(--sp-side-group); }
.sp-sign-out { min-height: var(--sp-target); padding: 0 12px; border: 1px solid var(--sp-side-edge); border-radius: var(--sp-radius-item);
  background: transparent; color: var(--sp-side-link); cursor: pointer; font-family: var(--sp-font-ui); font-size: 14px; }
.sp-sign-out:hover { color: var(--sp-side-brand); }
.sp-sign-out:focus-visible { outline: 2px solid var(--sp-count); outline-offset: 2px; }
.sp-side .sp-side-account { display: flex; flex-direction: column; align-items: stretch; gap: 8px; margin-top: 12px; padding: 12px 10px 0;
  border-top: 1px solid var(--sp-side-edge); }
                                                               
.sp-side button.sp-side-parent { width: 100%; border: 0; background: transparent; text-align: left; cursor: pointer; font-family: var(--sp-font-ui); }
.sp-side-chev { font-family: var(--sp-font-num); font-size: 14px; color: var(--sp-side-group); }
.sp-side-sub { display: flex; flex-direction: column; gap: 2px; }
.sp-side .sp-side-subitem { padding-left: 24px; font-size: 14px; }
.sp-sheet-sub { padding: 8px 10px 2px; font-size: 13px; color: var(--sp-side-group); }
body[data-room] .sp-sheet-subitem { padding-left: 24px; }
.sp-count { font-family: var(--sp-font-num); font-size: 12px; color: var(--sp-count); }
.sp-count.sp-count-zero { color: inherit; }                                                                         
.sp-side .sp-side-item:focus-visible, .sp-bar-item:focus-visible, .sp-sheet-item:focus-visible { outline: 2px solid var(--sp-count); outline-offset: 2px; }

                                            
.sp-bar { display: none; }
                                                                                                                                        
.sp-side-mark { flex: 0 0 22px; width: 22px; height: 22px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  font-size: 10px; font-weight: 600; border: 1px solid currentColor; }
.sp-side .sp-side-setup { font-weight: 600; }
@media (max-width: 767px) {
  .sp-side { display: none; }
  .sp-bar { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
    height: var(--sp-bar-height); background: var(--sp-side-bg); border-top: 1px solid var(--sp-side-edge); font-family: var(--sp-font-ui); }
  .sp-bar.sp-bar-has-setup { grid-template-columns: repeat(6, minmax(0, 1fr)); }
                                                                                                                                      
                                                                                                        
  .sp-bar, .sp-bar.sp-bar-has-setup { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
                                                                                                                                   
                                                                                                                                 
                                                                                                          
  body.sp-shelled nav[data-staff-bar] > a[data-area-link]:not([data-area-link="books"]),
  body.sp-shelled nav[data-staff-bar] > #staff-signout { display: none !important; }
  body.sp-shelled nav[data-staff-bar]:not(:has(> a[data-area-link="books"])) { display: none !important; }
}
.sp-bar-item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-height: var(--sp-target);
  color: var(--sp-side-link); text-decoration: none; font-size: 12px; background: transparent; border: 0; padding: 0; cursor: pointer; }
body[data-room] .sp-bar-item, body[data-room] .sp-bar-item:hover { color: var(--sp-side-link); }
body[data-room] .sp-bar-item.is-current { color: var(--sp-side-brand); background: var(--sp-side-edge); font-weight: 600; }
.sp-bar-count { font-size: 15px; line-height: 20px; min-height: 20px; }                                                          
.sp-sheet { position: fixed; left: 0; right: 0; bottom: var(--sp-bar-height); z-index: 49; background: var(--sp-side-bg);
  border-top: 1px solid var(--sp-side-edge); padding: 12px 12px 14px; display: flex; flex-direction: column; gap: 2px; }
.sp-sheet-title { padding: 4px 10px 6px; font-size: 12px; color: var(--sp-side-group); }
body[data-room] .sp-sheet-item { min-height: var(--sp-target); padding: 0 10px; display: flex; align-items: center; color: var(--sp-side-link);
  border-radius: var(--sp-radius-item); text-decoration: none; font-size: 15px; }
body[data-room] .sp-sheet-item.is-current { background: var(--sp-side-active-bg); color: var(--sp-side-active-ink); font-weight: 600; }


                                                                                                             
                                                                                                                               
                                                                                                                               
                                                                                               
@media (min-width: 768px) {
  body.sp-shelled { margin-left: var(--sp-side-width); }
  .sp-side.sp-side-fixed { position: fixed; top: 0; left: 0; bottom: 0; z-index: 90; }
                                                                                                                                  
                                                                                                                
  body.sp-shelled > main.card { max-width: 1280px; }
                                                                                                           
                                                                                                 
  body.sp-shelled .pwa-bar, body.sp-shelled .cr-actionbar, body.sp-shelled #build-update-bar, body.sp-shelled .startup-failure { left: var(--sp-side-width); }
  body.sp-shelled .back-bar { left: calc(var(--sp-side-width) + 12px); }
}
@media (max-width: 767px) {
                                                                        
  body.sp-shelled .cr-actionbar { bottom: var(--sp-bar-height); }
}
@media (max-width: 767px) {
  body.sp-shelled { margin-bottom: var(--sp-bar-height); }
                                                                                                                
                                                         
  html:has(> body .sp-bar) { scroll-padding-bottom: var(--sp-bar-height); }                                 
  html:has(> body.sp-shelled .rv2e-bar) { scroll-padding-bottom: 0; }
                                                                                                                                 
                                                                                                     
  html:has(> body.pwa-bar-open .sp-bar) { scroll-padding-bottom: calc(var(--sp-bar-height) + var(--pwa-bar-h, 0px)); }
  html:has(> body.sp-shelled.pwa-bar-open .rv2e-bar) { scroll-padding-bottom: var(--pwa-bar-h, 0px); }
  body.sp-shelled .pwa-bar { bottom: var(--sp-bar-height); }
  body.sp-shelled:not(:has(.rv2e-bar)) #ask-open, body.sp-shelled:not(:has(.rv2e-bar)) .askp-nav { display: none !important; }
                                                                                                                                    
                                                                                                                                   
  body.sp-shelled:has(.rv2e-bar) { margin-bottom: 0; }
  body.sp-shelled:has(.rv2e-bar) #sp-bar, body.sp-shelled:has(.rv2e-bar) .sp-sheet { display: none !important; }
  body.sp-shelled:has(.rv2e-bar) .pwa-bar { bottom: 0; }
}
body.sp-shelled nav.nav-bar:not([data-staff-bar]) > a[href="/"],
body.sp-shelled nav.nav-bar:not([data-staff-bar]) > a[href="/home"],
body.sp-shelled nav.nav-bar:not([data-staff-bar]) > a[href="/invoice-entry"],
body.sp-shelled nav.nav-bar:not([data-staff-bar]) > a[href="/modifiers"],
body.sp-shelled #nav-home, body.sp-shelled #nav-entry { display: none !important; }
body.sp-shelled nav.nav-bar.sp-nav-empty:not([data-staff-bar]) { display: none !important; }

                                            
                                                                                                                  
                                                                                    
.sp-bar .sp-bar-item { font-size: 12px; line-height: 1.35; }

                                                                                                                                  
                                                         
.sp-label-short { display: none; }
@media (max-width: 767px) {
  .sp-label-full { display: none; }
  .sp-label-short { display: inline; }
}

                                                                                                                                  
                                                                                                                               
                                                                                                                               
                        
.sp-top { display: none; }
@media (max-width: 767px) {
  .sp-top { display: flex; align-items: center; gap: 12px; position: fixed; top: 0; left: 0; right: 0; z-index: 96; box-sizing: border-box;
    height: var(--sp-top-height); padding: env(safe-area-inset-top, 0px) 16px 0; background: var(--sp-side-bg); border-bottom: 1px solid var(--sp-side-edge);
    font-family: var(--sp-font-ui); -webkit-font-smoothing: antialiased; }
  .sp-top .sp-top-brand, body[data-room] .sp-top .sp-top-brand { display: inline-flex; align-items: center; min-height: var(--sp-target); font-weight: 600; font-size: 20px;
    letter-spacing: -0.3px; color: var(--sp-side-brand); text-decoration: none; }
  .sp-top .sp-top-page { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; color: var(--sp-side-link); }
  .sp-top .sp-top-account { margin-left: auto; display: flex; align-items: center; gap: 8px; min-width: 0; }
  .sp-top .sp-top-account[hidden] { display: none; }
  .sp-top .sp-top-account .sp-account-names { max-width: 34vw; text-align: right; }
                                                                                                                                    
                                                                                                                             
                                                                                                                                  
                                                                                                           
  .sp-top .sp-top-brand, .sp-top .sp-top-back, .sp-top .sp-sign-out { flex: none; white-space: nowrap; }
  .sp-top .sp-top-account { flex: 1 1 auto; justify-content: flex-end; }
  .sp-top .sp-top-account .sp-account-names { flex: 0 1 auto; max-width: none; }
                                                                                                                               
                                                                                                                              
                              
  html.sp-has-top:not(:has(.rv2e-bar)) { scroll-padding-top: var(--sp-top-height); }
  html.sp-has-top:not(:has(.rv2e-bar)) body { margin-top: var(--sp-top-height); }
  html.sp-has-top:has(.rv2e-bar) .sp-top { display: none; }
                                                       
  html.sp-has-top:not(:has(.rv2e-bar)) .askp-sticky, html.sp-has-top:not(:has(.rv2e-bar)) .cr-caption, html.sp-has-top:not(:has(.rv2e-bar)) .ic-strip, html.sp-has-top:not(:has(.rv2e-bar)) .rg-postbar,
  html.sp-has-top:not(:has(.rv2e-bar)) table.t th, html.sp-has-top:not(:has(.rv2e-bar)) .rv2e-sticky { top: var(--sp-top-height); }
                                           
  html.sp-has-top:not(:has(.rv2e-bar)) #build-update-bar, html.sp-has-top:not(:has(.rv2e-bar)) .rs-bar { top: var(--sp-top-height); }
  html.sp-has-top:not(:has(.rv2e-bar)) .back-bar { top: calc(var(--sp-top-height) + 10px); }
}

                                                                                                                                 
                                                                                                                                
                                                                                                                             
.sp-back { display: inline-flex; align-items: center; gap: 6px; min-height: var(--sp-target); padding: 0 14px; box-sizing: border-box;
  border-radius: var(--sp-radius); font-family: var(--sp-font-ui); font-size: 14px; font-weight: 500; cursor: pointer;
  background-color: var(--sp-o-card); color: var(--sp-o-ink); border: 1px solid var(--sp-o-button-edge); }
.sp-back:hover { background-color: var(--sp-o-band); }
body[data-room="kitchen"] .sp-back { background-color: var(--sp-k-paper); color: var(--sp-k-paper-ink); border-color: var(--sp-k-paper-rule); }
body[data-room="kitchen"] .sp-back:hover { background-color: var(--sp-k-paper-2); }
.sp-backrow { display: none; }
@media (min-width: 768px) {
                                                                                                                                     
  html.sp-has-back:not(:has(.rv2e-bar)):not(:has(#rv2e .rv2e-top)) .sp-backrow { display: flex; align-self: flex-start; margin: 0 0 12px; }
  body.sp-shelled > .sp-backrow { padding: 16px 20px 0; }
}
@media (max-width: 767px) {
  .sp-top .sp-top-back, body[data-room] .sp-top .sp-top-back { flex: none; padding: 0 10px; margin-left: -6px; background-color: transparent;
    color: var(--sp-side-brand); border: 1px solid var(--sp-side-edge); }
  .sp-top .sp-top-back:hover { background-color: var(--sp-side-edge); }
}
                                                                                                                                
                                                                                                        
@media (max-width: 479px) {
  .sp-top { gap: 8px; }
  .sp-top .sp-top-back .sp-back-word { display: none; }
  .sp-top .sp-top-back, body[data-room] .sp-top .sp-top-back { min-width: var(--sp-target); justify-content: center; padding: 0 10px; margin-left: -4px; }
  .sp-top .sp-sign-out { padding: 0 10px; }
  .sp-top:has(.sp-top-account:not([hidden])) .sp-top-page { display: none; }
}