/* SYSTEM workspace: readable records and contained filters. */
.system-task-ui {--system-rule:#e1e6e8;--system-secondary:#53636e}
.system-task-ui .filter-bar{padding:20px;gap:16px}
.system-task-ui .filter-bar>.field{flex-basis:160px;display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:600;color:#344650}
.system-task-ui .filter-bar>.field:first-of-type{flex-grow:1.5}
.system-task-ui .filter-actions{align-items:center;gap:8px}
.system-task-ui .member-directory{display:flex;flex-direction:column}
.system-task-ui .member-tile{display:grid;grid-template-columns:44px minmax(0,1fr) 24px;gap:16px;align-items:center;width:100%;min-height:100px;padding:20px 4px;background:transparent;color:#1d303a;border:0;border-bottom:1px solid var(--system-rule);border-radius:0;text-align:left;font:inherit;cursor:pointer}
.system-task-ui .member-tile:last-child{border-bottom:0}
.system-task-ui .member-tile:hover{background:#f4f8f7}
.system-task-ui .member-tile>span:nth-child(2){display:flex;flex-direction:column;gap:6px;min-width:0}
.system-task-ui .member-tile strong{font-size:16px;font-weight:600;line-height:1.5;overflow-wrap:anywhere}
.system-task-ui .member-tile small{display:block;font-size:13px;line-height:1.6;color:var(--system-secondary)}
.system-task-ui .member-tile>.avatar{width:44px;height:44px;background:#edf3f1;color:#3c6157;font-weight:600}
.system-task-ui .member-tile>span:last-child{color:#58736a}
.system-task-ui .member-summary{display:flex;gap:16px;align-items:center}
.detail-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0}
.detail-metrics>div{display:flex;flex-direction:column;gap:8px}.detail-metrics small{color:#53636e}
.detail-section{padding:20px 0;border-top:1px solid #e1e6e8}.detail-section p{margin:12px 0;line-height:1.7}
.system-session-status{max-width:480px;margin:15vh auto;padding:32px;line-height:1.7;text-align:center;color:#263c46}
.system-session-status h1{font-size:22px;margin:0 0 12px}.system-session-status p{color:#53636e}
#modal .system-submit-error{padding:16px;background:#fff2ef;border:1px solid #e6b0a5;border-radius:8px;color:#923828;line-height:1.7;margin-bottom:16px}
#modal .audience-choice{min-height:44px;font-size:14px}
#modal .audience-choice input{flex:none;margin:0;min-height:0}
.system-task-ui :focus-visible{outline:3px solid #337e70;outline-offset:3px}
@media(max-width:760px){
 .system-task-ui .filter-bar{padding:16px}
 .system-task-ui .member-tile{grid-template-columns:36px minmax(0,1fr) 16px;gap:12px;padding:16px 0}
 .system-task-ui .member-tile>.avatar{width:36px;height:36px}
 .system-task-ui .member-tile strong{font-size:15px}
}

/* Duty Check-in Form Styles */
.duty-checkin-form { gap: 16px; }
.duty-shift-header { padding: 12px 16px; background: #edf4f2; border: 1px solid #d0e4df; border-radius: 8px; }
.duty-shift-header strong { font-size: 15px; color: #1f423a; }
.duty-form-section { padding: 14px 0; border-top: 1px solid #e1e6e8; }
.duty-form-section:first-of-type { border-top: 0; padding-top: 4px; }
.duty-section-title { font-size: 13px; font-weight: 700; color: #344650; margin-bottom: 10px; display: flex; align-items: center; gap: 6px; }
.duty-check-row { display: flex; align-items: center; gap: 12px; padding: 10px 14px; background: #fafcfb; border: 1px solid #e1e8e5; border-radius: 8px; cursor: pointer; transition: background 0.15s; font-size: 14px; font-weight: 600; color: #1d303a; }
.duty-check-row:hover { background: #f0f7f4; border-color: #bcd9d0; }
.duty-check-row input[type="checkbox"] { width: 20px; height: 20px; margin: 0; accent-color: #276254; cursor: pointer; }
.duty-grid-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media(max-width: 600px) { .duty-grid-2col { grid-template-columns: 1fr; } }
.chip-group { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.chip-btn { padding: 5px 11px; font-size: 12px; font-weight: 600; color: #275249; background: #edf5f2; border: 1px solid #c2ded7; border-radius: 999px; cursor: pointer; transition: all 0.15s ease; font-family: inherit; }
.chip-btn:hover { background: #d8ece6; border-color: #2d6b5e; }
.badge-ok { background: #eaf5f0; color: #1b6348; border: 1px solid #bce1ce; }
