/* Authenticated staff controls inherit compact defaults, including dialogs appended to body.
   Public applications, private Model pages and sign-in keep their own reading/form scale.
   Component rules still own planner geometry, people chips, switches and folder tabs. */
@media screen{
body.staff-interface:has(#app>.shell){
  --text-body:.875rem;
  --control-action-padding:3px 7px;
  --control-action-height:28px;
  --control-action-font:600 11px/1.3 var(--font-mono);
  --control-action-spacing:.04em;
  --control-action-case:uppercase;
  --control-field-padding:5px 8px;
  --control-field-font:400 12px/1.3 var(--font-sans);
  --control-label-font:600 11px/1.3 var(--font-mono);
  --control-label-spacing:.04em;
  --control-label-case:uppercase;
  --control-form-gap:8px;
}
/* Native editable controls share sizing even inside older component styles. */
body.staff-interface:has(#app>.shell) :where(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=range]):not([type=color]),select,textarea):where(:not([name=document]):not(.attendance-select)){
  font:var(--control-field-font);padding:var(--control-field-padding);
  letter-spacing:0;text-transform:none;
}
body.staff-interface:has(#app>.shell) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=range]):not([type=color]),select){height:auto;min-height:28px}
body.staff-interface:has(#app>.shell) :is(.inline-profile-editor,.application-answer-list,.profile-answers,.equipment-markdown){
  --text-body:1rem;font-size:16px;
}
body.staff-interface:has(#app>.shell) label small{
  font:400 var(--text-caption)/1.45 var(--font-sans);letter-spacing:0;text-transform:none;
}
body.staff-interface:has(#app>.shell) :is(.session-id-table input,.quiet-hours input,.rule-sentence input[type=number],.rule-sentence input[type=time]){font-family:var(--font-mono)}
body.staff-interface:has(#app>.shell) .rule-sentence :is(select,input){font-weight:600}
body.staff-interface:has(#app>.shell) label:has(input:is([type=checkbox],[type=radio])){
  --control-label-font:400 14px/1.4 var(--font-sans);
  --control-label-case:none;
  --control-label-spacing:0;
}
}
@media screen and (any-pointer:coarse),screen and (max-width:700px){
  body.staff-interface:has(#app>.shell){
    --control-action-height:44px;
    --control-field-font:400 16px/1.3 var(--font-sans);
  }
  body.staff-interface:has(#app>.shell) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=range]):not([type=color]),select){min-height:44px;font-size:16px}
  body.staff-interface:has(#app>.shell) textarea{font-size:16px}
  body.staff-interface:has(#app>.shell) .attendance-select{width:150px;max-width:100%}
  body.staff-interface:has(#app>.shell) :is(.model-booking-actions,.model-roster-person-name) .attendance-select{width:100%}
  body.staff-interface:has(#app>.shell) .topbar-profile{width:44px;min-width:44px;height:44px;min-height:44px}
  body.staff-interface:has(#app>.shell) :is(.participant-request-actions button,.wrangler-workload-leaders button,.location-hero-actions button,.location-directory-filters button,.unassigned-location button,.venue-heading-actions button,.equipment-row-action,.operations-person-media .model-roster-edit,.topbar .help-link,.question-drag-handle,.toggle-control,.message-test-person,.editor-check){min-height:44px}
  body.staff-interface:has(#app>.shell) :is(.modal-close,.question-drag-handle){min-width:44px}
}

/* Existing compact layout hooks remain available for filters and action rows. */
:root :is(.filter-bar,.compact-filters){gap:8px;min-width:0}
:root .compact-form label{display:grid}
:root .filter-bar{margin:8px 0 12px;padding:10px 0}
:root :is(.filter-bar,.compact-filters,.compact-form) label,
:root label.compact-filter-field{
  min-width:0;max-width:100%;gap:4px;
  font:600 11px/1.3 var(--font-mono);letter-spacing:.04em;text-transform:uppercase;
}
:root :is(.filter-bar,.compact-filters,.compact-filter-field,.compact-form) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select),
:root .compact-filter-input{
  max-width:100%;height:auto;min-height:28px;padding:5px 8px;
  font:400 var(--text-caption)/1.3 var(--font-sans);letter-spacing:0;text-transform:none;
}
:root :is(.filter-bar,.compact-filters,.compact-filter-field,.compact-form) :where(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select){width:100%;min-width:0}
:root :is(.filter-bar,.compact-filters,.compact-actions,.compact-form) button{
  min-width:24px;min-height:28px;height:auto;padding:3px 7px;max-width:100%;
  font:600 11px/1.3 var(--font-mono);letter-spacing:.04em;text-transform:uppercase;
}
:root :is(.filter-bar,.compact-filters) label:has(input[type=checkbox]),
:root label.compact-filter-field:has(input[type=checkbox]){
  display:flex;align-items:center;gap:6px;min-height:28px;
}
:root .contact-filter-toolbar{padding:10px 0}
:root .contact-filter-toolbar>label{flex:1 1 140px}
:root .contact-filter-toolbar>label:has(#peopleQuery){flex:2 1 210px;min-width:0}
:root .contact-filter-summary{min-height:0;flex-wrap:wrap;overflow:visible;white-space:normal}
:root .contact-filter-summary>*{max-width:100%;flex-shrink:1}
:root .contact-filter-summary #contactClear{
  min-height:28px;padding:3px 7px;font:600 11px/1.3 var(--font-mono);
  letter-spacing:.04em;text-transform:uppercase;white-space:normal;overflow-wrap:anywhere;
}
:root .contact-filter-summary .contact-filter-chip{
  min-height:28px;padding:3px 7px;font:500 var(--text-caption)/1.3 var(--font-sans);
  letter-spacing:0;text-transform:none;white-space:normal;overflow-wrap:anywhere;
}
:root .contact-filter-editor :is(.contact-filter-match,.contact-filter-group-head) select{width:auto}
:root .contact-filter-rule{grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1.4fr) auto}
:root .people-alpha{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:12px}
:root .people-alpha button{flex:1 0 24px;padding-inline:4px}
:root .people-alpha button:first-child{flex-basis:40px}
:root .application-filter-panel{padding:12px}
:root .application-filter-panel>h2{margin-bottom:10px;font-size:var(--text-body)}
:root .application-filter-panel .application-filters{margin:10px 0;padding:0 0 10px}
:root .application-answer-filter-head{font-size:var(--text-caption)}
:root .application-answer-filter-row>button{font-size:var(--text-body);padding:3px}
:root .report-controls label{margin-bottom:8px}
:root .report-controls{padding-top:10px}
:root .session-id-filters{gap:8px;padding:10px 0}
:root .session-id-filters label{flex:1 1 150px;max-width:300px}
:root .location-planner-filters label{flex:1 1 140px}
:root .equipment-ops .equipment-filters{padding:10px 0}
:root .equipment-ops .equipment-filters label{min-width:0;flex:1 1 140px}
:root .equipment-ops .equipment-filters .equipment-kit-search{flex:2 1 220px}
:root .equipment-ops .equipment-filters select{max-width:100%}
:root .command-day-filter{display:grid}
:root .placement-search{max-width:100%}

/* Keep automation checkboxes and the existing switch aligned within compact forms. */
:root #emailAutomationForm label:has(input[type=checkbox]){display:flex;align-items:center;min-height:28px;gap:6px}
:root #emailAutomationForm .template-channel-options label{padding:3px 7px}
:root #emailAutomationForm .template-delay-control input{width:90px;flex-shrink:0}
:root #emailAutomationForm .template-delay-control select{width:auto;flex:1;min-width:0}
:root .automation-window input{width:96px}
:root .person-switch .rail-signout{margin-top:8px}

/* Wrap dense desktop bars while the navigation rail is a sidebar. Keep the tablet columns. */
@media(min-width:901px){
  :root .filter-bar:not(.application-filters){grid-template-columns:repeat(auto-fit,minmax(min(100%,140px),1fr))}
}
@media(max-width:650px){
  :root .contact-filter-rule{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto}
}
/* Any coarse pointer covers iPads with a keyboard/mouse too. 16px avoids iOS input zoom. */
@media(any-pointer:coarse),(max-width:700px){
  :root :is(.filter-bar,.compact-filters,.compact-filter-field,.compact-form) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select),
  :root .compact-filter-input{min-height:44px;font-size:16px}
  :root :is(.filter-bar,.compact-filters,.compact-actions,.compact-form) button,
  :root .contact-filter-summary :is(.contact-filter-chip,#contactClear){min-width:44px;min-height:44px;white-space:normal}
  :root :is(.filter-bar,.compact-filters) label:has(input[type=checkbox]),
  :root label.compact-filter-field:has(input[type=checkbox]),
  :root .planner-tool-picker label{min-height:44px;min-width:44px}
  :root #emailAutomationForm label:has(input[type=checkbox]){min-height:44px}
  :root .people-alpha button{flex-basis:44px}
  :root .application-answer-filter-row,:root .application-answer-filter-head{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) 44px}
}