[data-access-hidden] { display: none !important; }
.erp-account-bar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 24px; padding: 14px 18px; border: 1px solid #dce5e2; border-radius: 12px; background: #f4f8f6; color: #233f35; font-size: 13px; }
.erp-account-bar > div:first-child { display: flex; gap: 12px; align-items: baseline; flex-wrap: wrap; }
.erp-account-bar > div:first-child span { color: #687970; }
.erp-account-actions { display: flex; align-items: center; gap: 18px; }
.erp-account-actions a { color: #1e6650; text-decoration: none; font-weight: 600; }
.erp-logout { border: 0; background: none; padding: 0; font: inherit; color: #45584e; cursor: pointer; }
.erp-account-status:empty { display: none; }
.erp-account-status { width: 100%; color: #a4372b; }
.erp-readonly-note { margin: -8px 0 24px; padding: 13px 17px; border-left: 3px solid #b89443; background: #fffbef; color: #745a24; font-size: 13px; line-height: 1.7; }
.staff-page { background: #f4f6f3; color: #243c32; }
.staff-shell { max-width: 1200px; margin: auto; padding: 32px 36px 60px; }
.staff-home-link { color: #2c7057; font-size: 13px; text-decoration: none; }
.staff-heading { margin: 22px 0 28px; }
.staff-heading h1 { font-size: 30px; margin: 8px 0 12px; }
.staff-heading p, .staff-help { font-size: 13px; line-height: 1.8; color: #64766b; }
.staff-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(340px, 1fr); gap: 24px; align-items: start; }
.staff-card { background: white; border: 1px solid #dce4dd; border-radius: 16px; padding: 24px; }
.staff-card h2 { font-size: 20px; margin: 0 0 14px; }
.staff-card h3 { font-size: 15px; margin: 8px 0; }
.staff-card fieldset { padding: 0; margin: 0; border: 0; min-width: 0; }
.staff-form { display: grid; gap: 16px; }
.staff-field { display: grid; gap: 7px; font-size: 13px; font-weight: 600; }
.staff-field input, .staff-field select, .staff-permission-row select { width: 100%; min-height: 42px; padding: 10px 12px; border: 1px solid #cdd8d0; border-radius: 8px; background: white; color: #263d31; font: inherit; box-sizing: border-box; }
.staff-field input:focus, .staff-permission-row select:focus { outline: 2px solid #76ae91; outline-offset: 2px; }
.staff-field small { font-weight: 400; color: #687970; line-height: 1.6; }
.staff-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 5px; }
.staff-actions .button { cursor: pointer; }
.staff-alert { padding: 12px 14px; border: 1px solid #eac4bf; border-radius: 8px; background: #fff4f1; color: #8e3026; font-size: 13px; line-height: 1.7; }
.staff-status { font-size: 13px; line-height: 1.7; color: #286342; }
.staff-status:empty { display: none; }
.staff-permissions { display: grid; gap: 12px; }
.staff-permission-row { display: grid; grid-template-columns: minmax(0, 1fr) 115px; align-items: center; gap: 14px; padding-bottom: 12px; border-bottom: 1px solid #edf0ec; }
.staff-permission-row span { display: block; margin-top: 4px; font-size: 12px; font-weight: 400; color: #687970; line-height: 1.6; }
.staff-permission-row label { font-size: 13px; font-weight: 600; }
.staff-list-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 16px; }
.staff-list-head h2 { margin: 0; }
.staff-user { padding: 18px 0; border-top: 1px solid #e5ebe5; }
.staff-user:first-child { border-top: 0; }
.staff-user-heading { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.staff-user-heading strong { font-size: 16px; }
.staff-user-name { color: #69776e; font-size: 13px; }
.staff-badge { font-size: 11px; font-weight: 600; border-radius: 20px; padding: 3px 8px; background: #e8f3e9; color: #38674a; }
.staff-badge.off { color: #836344; background: #f5eddf; }
.staff-user p { font-size: 12px; line-height: 1.9; margin: 10px 0; color: #5d6f63; overflow-wrap: anywhere; }
.staff-reset-panel { padding-top: 20px; margin-top: 22px; border-top: 1px solid #e4e9e3; }
.staff-check { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; line-height: 1.7; }
.staff-check input { margin-top: 5px; flex: none; }
.staff-login-shell { min-height: 100vh; display: grid; place-items: center; padding: 32px 20px; box-sizing: border-box; background: radial-gradient(ellipse at top left, #dfebdf, transparent 65%), #f5f7f3; }
.staff-login-card { width: 100%; max-width: 430px; box-sizing: border-box; padding: 36px; box-shadow: 0 18px 65px #203e2c0c; }
.staff-login-brand { font-size: 12px; letter-spacing: .15em; color: #61836b; }
.staff-login-card h1 { font-size: 28px; margin: 13px 0; }
.staff-login-card .staff-form { margin-top: 24px; }
.staff-login-card .button.primary { width: 100%; justify-content: center; }
.staff-account-card { max-width: 620px; margin: 0 auto; }
.staff-account-summary { display: grid; grid-template-columns: 85px 1fr; gap: 10px; font-size: 13px; padding-bottom: 20px; margin-bottom: 24px; border-bottom: 1px solid #e6ebe5; }
.staff-account-summary dt { color: #6a796f; }.staff-account-summary dd { margin: 0; overflow-wrap: anywhere; }
.access-card { max-width: 520px; margin: 12vh auto; padding: 32px; font-family: system-ui, sans-serif; line-height: 1.8; border: 1px solid #dce4dd; border-radius: 16px; color: #243c32; }
[hidden] { display: none !important; }
@media (max-width: 900px) { .staff-grid { grid-template-columns: 1fr; }.staff-shell { padding: 20px 18px 40px; } }
@media (max-width: 520px) { .staff-card { padding: 20px; }.staff-permission-row { grid-template-columns: 1fr 100px; }.staff-heading h1 { font-size: 25px; }.erp-account-bar { padding: 12px; }.erp-account-actions { gap: 14px; } }
@media print { .erp-account-bar, .erp-readonly-note { display: none; } }