/* Screen-only branding overrides for staff and fixed-palette demo; operational states stay fixed. */
@media screen {
 /* Decorative brand stripe only: never a button, text or operational status. */
 body[data-branch-palette="agency-navy"] :is(.branch-card,.agency-identity){border-left:3px solid var(--kr-brand-detail)}
 body[data-branch-palette="agency-navy"] .agency-identity{padding-left:12px}
 body[data-branch-palette] .primary{color:var(--kr-on-accent)}
 body[data-branch-palette] .primary:hover{background:var(--kr-accent-hover);border-color:var(--kr-accent-hover);box-shadow:0 0 16px var(--kr-accent-glow)}
 body[data-branch-palette] :is(input,select,textarea){border-color:var(--kr-accent-border)}
 body[data-branch-palette] :is(button,input,select,textarea,a):focus-visible{outline-color:var(--kr-focus)}
 body[data-branch-palette] .nav :is(a.active,button:hover){border-color:var(--kr-accent-border)}
 body[data-branch-palette] .stat:hover{box-shadow:0 0 16px var(--kr-accent-glow)}
 body[data-branch-palette] .tabs :is(button[data-tab="all"],button[data-tab="in"]){--tab-glow:var(--kr-accent-glow)}
 body[data-branch-palette] .key-icon{color:var(--kr-accent);border-color:var(--kr-accent-border)}
 body[data-branch-palette] .key-row:not(.is-missing):not(.is-overdue):hover{background:var(--kr-accent-soft)}
 body[data-branch-palette] .timeline li::before{box-shadow:0 0 0 1px var(--kr-accent-border)}
 body[data-branch-palette] .scan-area,body[data-branch-palette] .toast{border-color:var(--kr-accent-border)}
 body[data-branch-palette] .print-label,body[data-branch-palette] .print-label :is(strong,small){color:#000;background:#fff}
 #branch-appearance-dialog{width:min(620px,calc(100% - 24px));max-height:calc(100dvh - 24px);margin:auto;padding:24px;background:var(--kr-bg);color:var(--kr-text);border:1px solid var(--kr-border-strong);border-radius:12px;overflow:auto;box-shadow:0 20px 80px #0009}
 #branch-appearance-dialog::backdrop{background:#010409b8}
 #branch-appearance-dialog h2{margin:8px 0}#branch-appearance-dialog p{line-height:1.5}#appearance-branch{color:var(--kr-muted)}
 #appearance-options{border:0;padding:0;display:grid;gap:8px;margin:20px 0}#appearance-options legend{margin-bottom:10px;font-weight:700}
 .palette-option{display:flex;align-items:center;gap:12px;min-height:48px;padding:12px;border:1px solid var(--kr-border-strong);border-radius:6px;cursor:pointer}
 .palette-option:has(:checked){border-color:var(--kr-accent);background:var(--kr-accent-soft)}.palette-option input{accent-color:var(--kr-accent);width:18px;height:18px}.palette-swatch{width:20px;height:20px;border-radius:50%;flex:none}
 .appearance-preview{padding:16px;background:var(--kr-surface);border:1px solid var(--kr-border);border-radius:8px}.appearance-preview h3{margin-top:0}
 .preview-actions,.preview-states{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.appearance-preview .tabs{padding:14px 0;gap:14px;margin-top:10px}.preview-key{display:flex;gap:12px;align-items:center;padding:14px 0}.preview-key:hover{background:var(--kr-accent-soft)}.preview-key small{display:block;color:var(--kr-muted);margin-top:4px}.preview-key .status{margin-left:auto}.preview-states{margin-bottom:18px}.appearance-preview .field{margin:0}
 #appearance-message{min-height:24px}#branch-appearance-dialog footer{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;margin-top:20px}#branch-appearance-dialog button{min-height:44px}
 /* The mobile identity wrapper uses display:contents; stripe its visible branch label. */
 @media(max-width:760px){body[data-branch-palette="agency-navy"] #current-branch{border-left:3px solid var(--kr-brand-detail);padding-left:10px}}
 @media(max-width:480px){#branch-appearance-dialog{padding:16px}.appearance-preview{padding:12px}.preview-key{flex-wrap:wrap}.appearance-preview .fields-two{grid-template-columns:1fr}#branch-appearance-dialog footer{display:grid;grid-template-columns:1fr 1fr}#appearance-reset{grid-column:1/-1}.preview-actions button{flex:1}}
}
@media print{#branch-appearance-dialog{display:none!important}.print-label,.print-label :is(strong,small){color:#000!important;background:#fff!important}}

/* Agency red is branding; operational badges retain fixed colours, words and
   distinct shapes. Masks are decorative: the visible status/error text names
   the problem without requiring colour or an icon to be understood. */
@media screen {
 body[data-branch-palette="agency-red"] .status.missing{border:2px dashed var(--kr-red)}
 body[data-branch-palette="agency-red"] .status.overdue{border:2px solid var(--kr-red)}
 body[data-branch-palette="agency-red"] :is(.status.missing,.status.overdue)::before{
  content:"";display:inline-block;width:14px;height:14px;flex:none;border-radius:0;
  background:currentColor;mask-repeat:no-repeat;mask-position:center;mask-size:contain;
 }
 body[data-branch-palette="agency-red"] .status.missing::before{
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 1 22h22L12 2Zm-1 6h2v7h-2V8Zm0 9h2v2h-2v-2Z' fill-rule='evenodd'/%3E%3C/svg%3E");
 }
 body[data-branch-palette="agency-red"] .status.overdue::before{
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1a11 11 0 1 0 0 22 11 11 0 0 0 0-22Zm0 2a9 9 0 1 1 0 18 9 9 0 0 1 0-18Zm-1 3h2v5h5v2h-7V6Z' fill-rule='evenodd'/%3E%3C/svg%3E");
 }
 body[data-branch-palette="agency-red"] .key-row.is-missing .status{font-weight:800}
 body[data-branch-palette="agency-red"] :is(.validation,.sync-error,#auth-error,.case-warning):not(:empty){
  border-inline-start:4px solid var(--kr-red);padding-inline-start:10px;
 }
 body[data-branch-palette="agency-red"] :is(.validation,.sync-error,#auth-error,.case-warning):not(:empty)::before{
  content:"⚠ ";font-weight:800;
 }
}