/* Shared collection typography and rhythm. Column templates remain view-specific. */
:root{--table-label:10px;--table-body:12px;--table-title:14px;--row-space:16px;--control-height:46px;--control-font:700 11px/1.35 var(--mono)}
#app :is(.project-list-head,.directory-column-head,.project-crew-head,.crew-edit-head,.edit-column-head,.workspace-event-head,.client-visibility-head){font:400 var(--table-label)/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:var(--surface);padding-block:10px;min-height:0}
#app :is(.project-list-head,.directory-column-head,.project-crew-head,.crew-edit-head,.edit-column-head,.workspace-event-head,.client-visibility-head) button{font:inherit;letter-spacing:inherit;text-transform:inherit;min-height:0;padding:0;margin:0}
#app :is(.project-row,.directory-row,.unified-member-summary,.crew-edit-row>.assignment-content>summary,.edit-list-row,.workspace-event-summary,.client-visibility-row,.client-deliverable,.wave-invoice-row,.payment-history-row){font:400 var(--table-body)/1.5 var(--font-body);padding-block:var(--row-space)}
#app :is(.project-row,.directory-row,.unified-member-summary,.edit-list-row,.workspace-event-summary,.client-deliverable) h3{font:600 var(--table-title)/1.45 var(--font-body);letter-spacing:0;margin:0}
#app :is(.directory-role-column,.directory-contact,.edit-list-group,.edit-list-editor,.edit-list-deadline,.member-role,.member-call,.client-deliverable-group){font:400 var(--table-body)/1.5 var(--font-body)}
#app :is(.project-row,.directory-row,.edit-list-row,.workspace-event-summary,.client-deliverable) small{font:400 11px/1.5 var(--font-body)}
/* Keep search, sort, tab and filter controls on the same baseline. */
#app :is(.project-toolbar,.event-toolbar,.client-filters,.edit-tabs,.event-nav,.project-filters,.tabs){gap:10px}
#app :is(.project-toolbar,.event-toolbar,.client-filters,.edit-tabs,.event-nav){margin-block:20px;align-items:center}
#app :is(.project-toolbar,.event-toolbar,.client-filters,.edit-tabs,.event-nav,.project-filters,.tabs) button,
#app :is(.project-toolbar,.event-toolbar,.client-filters) input,
#app .project-sort.field{font:var(--control-font);letter-spacing:.055em;text-transform:uppercase}
#app :is(.project-toolbar,.event-toolbar,.client-filters,.edit-tabs,.event-nav,.project-filters,.tabs) button,
#app :is(.project-toolbar,.event-toolbar,.client-filters) input{min-height:var(--control-height);height:auto;padding:12px 14px;margin-block:0}
#app :is(.project-toolbar,.event-toolbar,.client-filters) input::placeholder{font:inherit;letter-spacing:inherit;text-transform:uppercase}
/* Applies to both generated dropdowns and native fallbacks, including dialogs. */
:is(#app,dialog) .styled-select-trigger,:is(#app,dialog) select:not(.styled-select-native){font:var(--control-font);letter-spacing:.055em;text-transform:uppercase;min-height:var(--control-height);height:auto;padding:12px 36px 12px 12px}
:is(#app,dialog) .styled-select-options button{font:var(--control-font);letter-spacing:.055em;text-transform:uppercase;min-height:40px;height:auto;padding:10px 12px;margin:0}
:is(#app,dialog) .styled-select-options{padding:6px;border-radius:8px}
#app .event-toolbar .event-setup-menu>summary{min-height:var(--control-height);font:var(--control-font);letter-spacing:.055em;padding:12px 14px}
#app .project-sort.field{gap:10px}
@media(max-width:800px){
 #app :is(.project-row,.directory-row,.unified-member-summary,.edit-list-row,.workspace-event-summary,.client-visibility-row,.client-deliverable){row-gap:8px}
 #app .client-filters{flex-wrap:wrap}
 #app .client-filters>*{min-width:0;max-width:100%}
}
#app .styled-select .styled-select-trigger{padding-right:36px}
#app .event-toolbar .event-setup-options>button{min-height:40px;padding:10px 12px}
/* Generated select wrappers must share available width with the search input. */
#app .client-filters:has(#client-search){display:grid;grid-template-columns:minmax(220px,1.4fr) repeat(2,minmax(0,1fr));gap:10px}
#app .client-filters:has(#client-search)>:is(input,select,.styled-select){width:100%;min-width:0;max-width:none}
@media(max-width:800px){#app .client-filters:has(#client-search){grid-template-columns:repeat(2,minmax(0,1fr))}#app .client-filters>#client-search{grid-column:1/-1}}
@media(max-width:450px){#app .client-filters:has(#client-search){grid-template-columns:minmax(0,1fr)}}