.staff-auth { max-width:820px; }
.staff-auth-intro { position:relative; overflow:hidden; background:linear-gradient(145deg,#063f54,#0a6179); }
.staff-auth-intro::after { content:''; position:absolute; width:180px; height:180px; inset-inline-end:-50px; bottom:-95px; border-radius:50%; background:rgba(179,217,87,.18); }
.staff-auth-copy { margin:.65rem 0 0; color:#dcecee; }
.staff-workspace { border-radius:22px; overflow:hidden; box-shadow:0 18px 48px rgba(7,77,101,.09); }
.staff-sidebar { background:linear-gradient(180deg,#074d65,#063d51); }
.staff-sidebar > a.portal-button { border-color:rgba(255,255,255,.45); background:transparent; color:#fff; }
.staff-sidebar > a.portal-button + button { margin-top:0; }
.staff-main { background:linear-gradient(180deg,#fffdf5,#fbfcf7); }
.staff-body,.staff-admin-content,.staff-admin { display:grid; gap:1rem; }
.staff-admin .portal-grid { align-items:start; }
.staff-workspace .portal-button,.staff-admin .portal-button,.staff-admin-accounts .portal-button,.staff-tab { min-height:44px; }
.staff-loading { min-height:180px; display:grid; place-items:center; }
.staff-card { min-width:0; }
.staff-card-title { font-size:1.05rem; }
.staff-form { align-content:start; }
.staff-hint { color:#5b7177; font-size:.78rem; font-weight:500; line-height:1.55; }
.staff-detail-list,.staff-pay-details { display:grid; gap:.2rem; margin:0; }
.staff-detail-list > div,.staff-pay-details > div { display:flex; justify-content:space-between; gap:1rem; padding:.7rem 0; border-bottom:1px solid rgba(7,77,101,.1); }
.staff-detail-list > div:last-child,.staff-pay-details > div:last-child { border-bottom:0; }
.staff-detail-list dt,.staff-pay-details dt { color:#60777b; }
.staff-detail-list dd,.staff-pay-details dd { margin:0; font-weight:750; text-align:end; }
.staff-detail-list dd,.staff-pay-details dd { min-inline-size:0; overflow-wrap:anywhere; }
.staff-field:has(> input[type="checkbox"]) { display:flex; align-items:center; gap:.6rem; min-height:44px; }
@media(max-width:430px){.staff-detail-list > div,.staff-pay-details > div { flex-direction:column; align-items:stretch; gap:.25rem; }.staff-detail-list dd,.staff-pay-details dd { text-align:start; }}
.staff-money { margin:.2rem 0; color:#074d65; font-size:clamp(1.8rem,4vw,2.6rem); font-weight:850; letter-spacing:-.03em; }
.staff-money-small { color:#074d65; font-weight:850; white-space:nowrap; }
.staff-record { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:1rem 0; border-bottom:1px solid rgba(7,77,101,.11); }
.staff-record:last-child { border-bottom:0; padding-bottom:0; }
.staff-record-copy,.staff-record > div:first-child { min-width:0; display:grid; gap:.28rem; }
.staff-prewrap { margin:.3rem 0 0; color:#36545d; font-size:.88rem; white-space:pre-wrap; overflow-wrap:anywhere; }
.staff-decision { margin:.25rem 0 0; padding:.55rem .65rem; border-radius:8px; background:#f3f6ed; color:#36545d; font-size:.82rem; }
.staff-badge { display:inline-flex; width:max-content; max-width:100%; padding:.24rem .55rem; border-radius:99px; background:#e8f0f2; color:#174f62; font-size:.75rem; font-weight:800; }
.staff-badge.is-active,.staff-status-approved,.staff-status-paid { background:#e2f1d0; color:#356218; }
.staff-badge.is-inactive,.staff-status-cancelled,.staff-status-rejected { background:#f7e8e5; color:#8a2f28; }
.staff-status-pending,.staff-status-published { background:#fff0bd; color:#775b00; }
.staff-text-link { color:#075f7a; font-size:.85rem; font-weight:750; text-decoration:underline; text-underline-offset:3px; }
.staff-table-wrap { width:100%; overflow-x:auto; border:1px solid rgba(7,77,101,.11); border-radius:12px; }
.staff-table { width:100%; border-collapse:collapse; font-size:.85rem; background:#fff; }
.staff-table th,.staff-table td { min-width:92px; padding:.72rem .65rem; border-bottom:1px solid rgba(7,77,101,.1); text-align:start; vertical-align:middle; }
.staff-table thead th { background:#eef4e7; color:#174f62; font-size:.77rem; white-space:nowrap; }
.staff-table tbody tr:last-child > * { border-bottom:0; }
.staff-pay-list { display:grid; gap:.8rem; }
.staff-pay-card { padding:1rem; background:#fcfef7; box-shadow:none; }
.staff-pay-header { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; margin-bottom:.6rem; }
.staff-pay-header > div { display:grid; gap:.2rem; }
.staff-pay-details { grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 1rem; }
.staff-pay-details > div { font-size:.82rem; }
.staff-tabs { display:flex; gap:.45rem; overflow-x:auto; padding:.25rem 0; }
.staff-tab { min-height:44px; flex:0 0 auto; border:1px solid rgba(7,77,101,.2); border-radius:99px; padding:.55rem 1rem; background:#fff; color:#074d65; font:inherit; font-size:.88rem; font-weight:800; cursor:pointer; }
.staff-tab.is-active { border-color:#074d65; background:#074d65; color:#fff; }
.staff-tab:focus-visible,.staff-decision-controls input:focus-visible { outline:3px solid #fff; outline-offset:2px; box-shadow:0 0 0 5px #8a4a00; }
.staff-inline-form { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)) auto; gap:.75rem; align-items:end; }
.staff-subform { display:grid; gap:.65rem; margin-top:1rem; padding-top:1rem; border-top:1px solid rgba(7,77,101,.12); }
.staff-subform h4 { margin:0; font-size:.95rem; }
.staff-check-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.6rem; margin-top:1rem; }
.staff-check-grid .portal-field { grid-template-columns:1fr auto; align-items:center; min-height:44px; padding:.5rem .65rem; border:1px solid rgba(7,77,101,.12); border-radius:9px; background:#fffdf5; }
.staff-check-grid input,.staff-permissions input { width:22px; height:22px; min-height:22px; accent-color:#074d65; }
.staff-check-grid .portal-button { grid-column:1/-1; justify-self:start; }
.staff-decision-controls { display:flex; flex-wrap:wrap; gap:.45rem; align-items:center; }
.staff-decision-controls input { min-width:180px; min-height:42px; flex:1; border:1px solid rgba(7,77,101,.28); border-radius:9px; padding:.55rem .65rem; background:#fffdf5; color:#074d65; font:inherit; }
.staff-permissions { min-width:0; margin:0; padding:0; border:0; }
.staff-permissions legend { margin-bottom:.65rem; font-weight:800; }
.staff-permission-table th,.staff-permission-table td { min-width:68px; text-align:center; }
.staff-permission-table th:first-child { min-width:150px; text-align:start; position:sticky; inset-inline-start:0; z-index:1; background:#eef4e7; }
.staff-permission-table tbody th:first-child { background:#fff; }
.staff-inline-status[data-kind="error"] { color:#9b2226; }
.staff-inline-status[data-kind="success"] { color:#36723a; }
.staff-field input[type="checkbox"] { width:22px; height:22px; min-height:22px; accent-color:#074d65; }

@media (max-width:900px) {
  .staff-inline-form { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .staff-inline-form > .portal-button { grid-column:1 / -1; justify-self:start; align-self:end; }
}

@media (max-width:760px) {
  .staff-workspace { border-radius:14px; }
  .staff-pay-details { grid-template-columns:1fr; }
  .staff-check-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:430px) {
  .staff-record,.staff-pay-header { flex-direction:column; }
  .staff-record > .portal-row-actions,.staff-record > .staff-decision-controls { width:100%; }
  .staff-record > .portal-row-actions .portal-button { flex:1; }
  .staff-inline-form,.staff-check-grid { grid-template-columns:1fr; }
  .staff-tabs { margin-inline:-.25rem; }
  .staff-table th,.staff-table td { padding:.65rem .55rem; }
  .staff-decision-controls input { min-width:100%; }
  .staff-permission-table th:first-child { min-width:120px; }
}