.demo-page .demo-home-link{display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;gap:8px;min-height:44px;padding:8px 11px;margin:0 0 18px 8px;border:1px solid var(--kr-border-strong);border-radius:6px;background:var(--kr-surface);color:var(--kr-text);text-decoration:none;font-size:.8125rem;font-weight:650;white-space:nowrap}
.demo-page .demo-home-link:hover{border-color:var(--kr-accent);color:var(--kr-accent);background:var(--kr-accent-soft)}
.demo-page .demo-home-short{display:none}
.demo-page .rail-foot button{display:block;margin-top:9px;padding:0;border:0;background:none;font-size:.8125rem;text-align:left;text-decoration:underline;text-underline-offset:3px}
.demo-page .demo-signin{display:inline-flex;align-items:center;min-height:44px;padding:9px 12px;text-decoration:none;font-size:.875rem}
.demo-page .staff-toolbar{margin-bottom:4px}
.demo-page .agency-identity{flex:1}
.demo-page .sync-bar{margin-bottom:10px}
.demo-page .team-person,.demo-page .audit-item{min-width:0}
.demo-page .team-person strong,.demo-page .team-person small{overflow-wrap:anywhere}
.demo-page .demo-message{padding:12px;border:1px solid var(--kr-border);border-radius:6px;line-height:1.5;color:var(--kr-muted);font-size:.875rem}
.demo-page .demo-message strong{color:var(--kr-text)}
.demo-page .audit-report{cursor:pointer}
.demo-page .audit-item>div{min-width:0}
.demo-page .audit-item button{min-height:44px}
.demo-page .bulk-selected li>div{flex:1;min-width:0}
.demo-page .print-label{justify-content:center}
.demo-page .print-label canvas{width:90px!important;height:90px!important}
.demo-page .panel-footer button{min-height:44px}
@media screen and (min-width:761px){
  .demo-page .nav #branch-audits,.demo-page .nav #manage-staff{min-height:44px}
  .demo-page .main{margin:0 auto;padding-top:28px}
  html:has(.demo-page){scrollbar-gutter:stable}
}
@media screen and (max-width:760px){
  .demo-page .demo-home-link{flex:none;margin:0;min-height:44px;padding:7px 9px}
  .demo-page .demo-home-full{display:none}
  .demo-page .demo-home-short{display:inline}
  .demo-page .main{padding-top:14px}
  .demo-page .sync-bar{margin-bottom:4px}
  .demo-page .staff-toolbar{margin-bottom:4px}
  .demo-page .staff-toolbar .demo-signin{display:none}
  .demo-page .rail{position:relative;z-index:5;gap:6px}
  .demo-page .mobile-menu{display:flex;align-items:center;gap:8px;position:relative;flex:none}
  .demo-page #mobile-menu-toggle{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--kr-border-strong);border-radius:6px;background:var(--kr-surface);color:var(--kr-text)}
  .demo-page #mobile-menu-toggle[aria-expanded="true"]{border-color:var(--kr-accent);color:var(--kr-accent)}
  .demo-page #mobile-menu-panel{position:absolute;right:0;top:calc(100% + 8px);width:190px;padding:5px;background:var(--kr-surface);border:1px solid var(--kr-border-strong);border-radius:8px;box-shadow:0 12px 28px #0009;z-index:6}
  .demo-page #mobile-menu-panel button{display:block;width:100%;min-height:44px;padding:10px 12px;border:0;border-radius:5px;background:transparent;color:var(--kr-text);font-size:.875rem;text-align:left}
  .demo-page #mobile-menu-panel button:hover,.demo-page #mobile-menu-panel button:focus-visible{background:var(--kr-accent-soft);color:var(--kr-accent)}
  .demo-page .main > #branch-audits,.demo-page .main > #manage-staff{display:none!important}
}
@media screen and (max-width:360px){
  .demo-page .demo-home-link{width:44px;padding:7px}
  .demo-page .demo-home-short{display:none}
}
@media print{
  .demo-page .app-shell,.demo-page .scrim,.demo-page .panel-head,.demo-page .panel-footer,.demo-page .labels-note{display:none!important}
  .demo-page .overlay{position:static;display:block!important}
  .demo-page .panel{width:100%;height:auto;box-shadow:none}
  .demo-page .panel-body{overflow:visible;padding:0}
  .demo-page .print-label canvas{width:120px!important;height:120px!important}
  .demo-page .print-label{break-inside:avoid}
}

/* Keep the visitor mode obvious beside sound/menu at narrow widths. */
@media screen and (max-width:420px){
 .demo-page .demo-home-link{width:44px;padding:7px}.demo-page .demo-home-short{display:none}
 .demo-page .rail>.brand{gap:0}.demo-page .rail>.brand>span:last-child{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
 .demo-page .mobile-menu{gap:4px}
}
