/* Shared presentation only. Business gates, hidden states and data values remain owned by existing views. */
/* Keep native select semantics while styling the browser-rendered expanded picker. */
@supports (appearance:base-select){
  :is(.app-shell,.drawer,.people-modal,body:has(.directory)) select:not([multiple]):not([size]),
  :is(.app-shell,.drawer,.people-modal,body:has(.directory)) select:not([multiple]):not([size])::picker(select){appearance:base-select}
  :is(.app-shell,.drawer,.people-modal,body:has(.directory)) select:not([multiple]):not([size]){background-image:none;padding-right:12px;gap:12px;align-items:center}
  :is(.app-shell,.drawer,.people-modal,body:has(.directory)) select::picker-icon{color:#527089;transition:rotate .15s}
  :is(.app-shell,.drawer,.people-modal,body:has(.directory)) select:open::picker-icon{rotate:180deg}
  :is(.app-shell,.drawer,.people-modal,body:has(.directory)) select::picker(select){box-sizing:border-box;border:1px solid #bfcdd9;border-radius:10px;padding:6px;background:#fff;color:#24374a;box-shadow:0 8px 24px #12344d26;max-height:min(320px,60vh);max-width:calc(100vw - 24px);overflow:auto}
  :is(.app-shell,.drawer,.people-modal,body:has(.directory)) select option{display:flex;align-items:center;gap:8px;min-height:44px;padding:10px 12px;border-radius:6px;white-space:normal;overflow-wrap:anywhere;line-height:1.5}
  :is(.app-shell,.drawer,.people-modal,body:has(.directory)) select option:is(:hover,:focus-visible){background:#eaf3fa;outline:2px solid #147caa;outline-offset:-2px}
  :is(.app-shell,.drawer,.people-modal,body:has(.directory)) select option:checked{background:#eaf3fa;color:#125c82;font-weight:600}
  :is(.app-shell,.drawer,.people-modal,body:has(.directory)) select option:disabled{color:#68798b;background:#f2f4f6}
  :is(.app-shell,.drawer,.people-modal,body:has(.directory)) select option::checkmark{color:#147caa;margin-left:auto;order:1}
}
:root{--ui-space:24px;--ui-control:44px;--ui-radius:12px;--ui-focus:#147caa}
.app-shell .main{line-height:1.65}
.app-shell .metrics article{grid-template-columns:minmax(0,1fr);gap:6px;align-content:start}
.app-shell .metrics small{margin-top:0}
@media(min-width:1421px){.app-shell .content-grid{grid-template-columns:minmax(0,1fr) 280px}}
.app-shell .route-view,.app-shell .route-page{min-width:0}
.app-shell .route-page{gap:var(--ui-space)}
.app-shell .route-view>.route-heading{margin-bottom:24px}
@media(max-width:760px){.app-shell .route-view>.route-heading{margin-bottom:16px}}
.environment-notice{margin:0 0 20px;padding:12px 16px;border-left:3px solid var(--brand);border-radius:6px;background:#eaf3fa;color:#245578;font-size:13px;line-height:1.7}
.app-shell .route-view .panel{padding:20px;border:1px solid var(--line);border-radius:var(--ui-radius);box-shadow:none;min-width:0}
.app-shell .route-view .panel-head{padding:0 0 16px;margin-bottom:16px;gap:16px;align-items:flex-start}
.app-shell .route-view .panel .panel{padding:16px 0;margin:16px 0 0;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent;box-shadow:none}
.app-shell .route-view .panel .panel .panel{padding:12px 0;margin:12px 0 0}
.app-shell .route-view :is(.action-box,.candidate-card,.validation-card,.fe004-record,.fe004-incident){padding:16px;min-width:0;border-radius:10px;box-shadow:none}
.app-shell .route-view .panel .action-box{padding:16px 0;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent;box-shadow:none}
.app-shell .route-view :is(form,fieldset){min-width:0}
.app-shell .route-view form:not(.history-filters){display:grid;gap:16px}
.app-shell .route-view>.panel{margin-bottom:24px}
.app-shell .route-view form.action-box{grid-template-columns:repeat(2,minmax(0,1fr))}
.app-shell .route-view form.action-box>:is(h2,h3,h4,p,button,fieldset),.app-shell .route-view form.action-box>label:has(textarea){grid-column:1/-1}
.app-shell .route-view form>button{justify-self:start}
.app-shell .route-view .action-box label{margin:0}
.app-shell .route-view :is(h2,h3,h4){line-height:1.45;margin-top:0;margin-bottom:12px;overflow-wrap:anywhere}
.app-shell .route-view p,.drawer p{line-height:1.75;overflow-wrap:anywhere}
.app-shell .route-view label,.drawer label{display:grid;gap:8px;line-height:1.6;min-width:0;font-size:13px;font-weight:600}
.app-shell .route-view label:has(input[type=checkbox]),.drawer label:has(input[type=checkbox]){display:flex;align-items:flex-start;gap:10px}
.app-shell .route-view :is(input:not([type=checkbox]):not([type=radio]),select,textarea),.drawer :is(input:not([type=checkbox]):not([type=radio]),select,textarea){width:100%;max-width:100%;min-width:0;min-height:var(--ui-control);font:inherit;font-size:14px;line-height:1.5;padding:10px 12px;color:var(--ink);background:#fff;border:1px solid #bfccd8;border-radius:8px;box-sizing:border-box}
.app-shell .route-view textarea,.drawer textarea{min-height:100px;resize:vertical}
.app-shell .route-view select,.drawer select{appearance:none;padding-right:36px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%2352667a' stroke-width='1.8' d='m4 6 4 4 4-4'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat}
.app-shell .route-view :is(input[type=checkbox],input[type=radio]),.drawer :is(input[type=checkbox],input[type=radio]){width:18px;height:18px;flex:0 0 18px;margin:3px 0;accent-color:var(--brand)}
.app-shell .route-view button,.drawer button,.people-modal button{min-height:var(--ui-control);height:auto;font:inherit;font-size:13px;font-weight:600;line-height:1.4;padding:10px 14px;border:1px solid #bfccd8;border-radius:8px;background:#fff;color:var(--brand);cursor:pointer;white-space:normal;max-width:100%}
:is(.app-shell .route-view,.drawer,.people-modal) button.primary{background:var(--brand);color:#fff;border-color:var(--brand);box-shadow:none}
:is(.app-shell .route-view,.drawer,.people-modal) button:not(:disabled):hover{background:#eef5fb;border-color:#8eacc6}
:is(.app-shell .route-view,.drawer,.people-modal) button.primary:not(:disabled):hover{background:#0b477f;color:#fff}
.app-shell .route-view .text-action{padding:6px 0;min-height:36px;background:transparent;border:0;border-radius:4px;text-align:left}
.app-shell :is(button,input,select,textarea,a,summary):focus-visible{outline:3px solid var(--ui-focus);outline-offset:3px}
.app-shell :is(button,input,select,textarea):disabled{cursor:not-allowed;opacity:1;color:#68798b;background:#edf1f5;border-color:#d5dde5;box-shadow:none}
.app-shell .route-view :is([role=alert],.warning-text,.boundary-banner,.guard-note){padding:12px 16px;border-radius:8px;line-height:1.7;overflow-wrap:anywhere}
.app-shell .route-view [role=alert]{border-left:3px solid var(--danger);background:#fff3f1;color:#8e302a}
.app-shell .route-view details{min-width:0}
.app-shell .route-view summary{padding:10px 0;line-height:1.6;cursor:pointer;overflow-wrap:anywhere}
.app-shell .route-view .table-wrap{max-width:100%;overflow-x:auto}
.app-shell .route-view :is(th,td){padding:14px 12px;line-height:1.6}
.app-shell .route-view :is(small,code){overflow-wrap:anywhere}
.app-shell .route-view :is(.candidate-actions,.validation-actions,.form-actions,.heading-actions){display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.app-shell .route-view .owner-workload-grid{padding:0;gap:16px}
.app-shell .route-view .owner-workload-group{border:0;border-bottom:1px solid var(--line);border-radius:0;padding:12px 0;background:transparent}
.app-shell .route-view .owner-workload-group[data-owner-kind=unassigned]{border-left:3px solid #b7791f;padding-left:12px;background:#fff8e8}
.app-shell .route-view .history-filters{gap:16px;padding:16px;box-shadow:none}
.drawer-body{padding:20px;line-height:1.65}
.drawer-section{margin:0;border:0;border-top:1px solid var(--line);border-radius:0}
.drawer-section:not(.action-box){padding:20px 0}
.drawer .drawer-section.action-box{padding:20px;margin-block:16px;border:1px solid #cbe6f3;border-radius:10px;background:#f3f9fd}
@media(max-width:760px){.drawer .drawer-section.action-box{padding:16px}}
.drawer .info-grid{gap:16px}
body:has(.directory) button{min-height:44px;height:auto;padding:10px 14px;border-radius:8px}
body:has(.directory) .directory-group{border:0;border-bottom:1px solid var(--line);border-radius:0}
body:has(.directory) .panel{box-shadow:none}
body:has(.directory) .directory{gap:16px}
@media(max-width:760px){:root{--ui-space:16px}.app-shell .route-view .panel{padding:16px}.app-shell .route-view .panel-head{flex-wrap:wrap}.app-shell .route-view .panel .panel{padding:16px 0}.app-shell .route-view form.action-box,.app-shell .route-view .history-filters{grid-template-columns:1fr}.app-shell .route-view :is(.form-actions,.heading-actions){align-items:stretch}.app-shell .route-view :is(.form-actions,.heading-actions)>button{flex:1}.drawer-body{padding:16px}.environment-notice{margin-bottom:16px;padding:12px;font-size:12px}}

.people-modal :is(input:not([type=checkbox]):not([type=radio]),select,textarea){min-height:44px;padding:10px 12px;font:inherit;border:1px solid #bfccd8;border-radius:8px;max-width:100%;box-sizing:border-box}
.drawer :is(button,input,select,textarea,a,summary):focus-visible,.people-modal :is(button,input,select,textarea,a,summary):focus-visible{outline:3px solid var(--ui-focus);outline-offset:3px}/* Follow-up: compact empty states and distinguish inactive technical references. */
.app-shell .route-view .empty-state{padding:24px 16px;min-height:0;line-height:1.7}
.app-shell .route-view>.route-page+.panel{margin-top:24px}
.app-shell .route-view .technical-reference>summary{font-size:14px;font-weight:600;color:var(--brand);padding:12px 0}
.app-shell .route-view .technical-reference[open]>summary{margin-bottom:12px;border-bottom:1px solid var(--line)}
.app-shell .route-view .technical-reference>.candidate-workspace,.app-shell .route-view .technical-reference>.validation-workspace{margin-top:16px}
@media(max-width:760px){.app-shell .route-view .empty-state{padding:20px 12px}.app-shell .route-view>.route-page+.panel{margin-top:16px}}
/* Keep disabled primary actions visibly disabled despite the primary class. */
:is(.app-shell .route-view,.drawer,.people-modal) :is(button,input,select,textarea):disabled{color:#68798b;background:#edf1f5;border-color:#d5dde5;opacity:1;cursor:not-allowed;box-shadow:none}

/* First page-review fixes: scoped to read-only technical references and route tables. */
.app-shell .route-view .table-scroll-hint{display:none}
.app-shell .route-view .technical-reference :is(p,li,small){white-space:normal;overflow-wrap:anywhere;max-width:100%;min-width:0}
.app-shell .route-view .technical-reference :is(.candidate-workspace,.validation-workspace){min-width:0;max-width:100%}
.app-shell .route-view .technical-reference .fe004-workspace{width:100%;max-width:100%;min-width:0;box-sizing:border-box;grid-template-columns:minmax(0,1fr)}
.app-shell .route-view .technical-reference .fe004-workspace :is(.route-heading,.fe004-baseline,.fe004-grid,.fe004-detail,.panel-head,.fe004-baseline header,.fe004-baseline header>div){min-width:0;max-width:100%;box-sizing:border-box}
.app-shell .route-view .technical-reference .fe004-workspace>.fe004-grid{display:grid;grid-template-columns:minmax(0,1fr)}
.app-shell .route-view .technical-reference .fe004-grid>*{min-width:0;max-width:100%}
@media(max-width:760px){.app-shell .route-view .table-scroll-hint{display:block;margin:0 0 12px;color:var(--text);font-size:13px;line-height:1.7}}