.hr-review { margin: 0 0 26px; padding: 20px; border: 1px solid var(--line-2-c, #514832); background: var(--panel-c, #171717); }
.hr-header, .hr-row__head { display: flex; align-items: start; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.hr-header h2 { margin: 0; font-size: 23px; }
.hr-note { font-size: 13px; line-height: 1.5; color: var(--text-c, #c7c2b8); margin: 8px 0; }
.hr-figures { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 18px 0; }
.hr-figures > div { border: 1px solid var(--line-c, #39362f); padding: 13px; min-width: 0; }
.hr-figures dt { font-size: 12px; line-height: 1.4; color: var(--text-c, #c7c2b8); }
.hr-figures dd { margin: 7px 0 0; }
.hr-figures strong { display: block; font-size: 21px; color: var(--ink-c, #f6f0e6); }
.hr-figures dd span { display: block; margin-top: 5px; font-size: 15px; color: var(--accent-c, #e8ae40); overflow-wrap: anywhere; }
.hr-rows { display: grid; gap: 14px; margin-top: 22px; }
.hr-row { min-width: 0; padding: 16px; border: 1px solid var(--line-c, #39362f); }
.hr-row h3 { margin: 0; font-size: 16px; }
.hr-history-label { font-size: 12px; color: var(--muted-c, #aba69b); }
.hr-figures--compact { gap: 8px; margin: 14px 0; }
.hr-figures--compact > div { padding: 9px; }
.hr-figures--compact strong { font-size: 17px; }
.hr-figures--compact dd span { font-size: 13px; }
.hr-flags { display: flex; gap: 7px; flex-wrap: wrap; }
.hr-flags:empty { display: none; }
.hr-flag { border-left: 3px solid var(--accent-c, #e8ae40); padding: 5px 8px; font-size: 12px; background: #e8ae4010; color: var(--ink-c, #f6f0e6); }
.hr-timecard { margin-top: 10px; }
.hr-timecard > summary, .hr-audit > summary { cursor: pointer; min-height: 44px; padding: 12px 0; font-size: 13px; color: var(--accent-c, #e8ae40); }
.hr-times, .hr-entry { font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.hr-times { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.hr-times p { margin: 5px 0; }
.hr-entry { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line-c, #39362f); }
.hr-entry > .btn { margin: 8px 0; white-space: normal; }
.hr-audit ol { padding-left: 22px; }
.hr-audit li { margin: 10px 0; }
.hr-audit p { margin: 4px 0; }
.hr-message { font-size: 14px; line-height: 1.5; }
.hr-dialog { box-sizing: border-box; width: min(620px, calc(100% - 24px)); max-height: calc(100dvh - 32px); overflow: auto; border: 1px solid var(--line-2-c, #514832); background: var(--panel-c, #171717); color: var(--ink-c, #f6f0e6); padding: 24px; }
.hr-dialog::backdrop { background: #000b; }
.hr-dialog h2 { margin: 0 0 14px; font-size: 23px; }
.hr-person { font-weight: 700; }
.hr-field { display: flex; flex-direction: column; gap: 8px; margin: 16px 0; font-size: 13px; }
.hr-field input, .hr-field select, .hr-field textarea { box-sizing: border-box; width: 100%; padding: 12px; border: 1px solid var(--line-2-c, #514832); background: var(--bg-c, #101010); color: inherit; font: inherit; font-size: 16px; }
.hr-field textarea { resize: vertical; }
.hr-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; }
.hr-review :is(button, summary):focus-visible, .hr-dialog :is(button, input, select, textarea):focus-visible { outline: 2px solid var(--accent-c, #e8ae40); outline-offset: 3px; }
.hr-dialog button:disabled { opacity: .5; }
.hr-profile { min-width: 0; margin: 18px 0; }
.hr-profile-controls, .hr-profile-dates { display: flex; align-items: end; gap: 12px; flex-wrap: wrap; }
.hr-profile-controls { margin-bottom: 12px; }
.hr-profile-controls .hr-field { margin: 0; flex: 1 1 160px; min-width: 0; }
.hr-profile-dates { flex: 2 1 300px; min-width: 0; }
.hr-profile-dates[hidden] { display: none; }
.hr-profile-dates .btn { min-height: 44px; }
.hr-profile .hr-figures { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hr-profile-summary { border-left: 3px solid var(--accent-c, #e8ae40); background: #e8ae4010; padding: 14px; margin: 16px 0; overflow-wrap: anywhere; }
.hr-profile-summary strong { display: block; font-size: 18px; color: var(--ink-c, #f6f0e6); }
.hr-profile-summary span { display: block; margin-top: 6px; font-size: 13px; line-height: 1.5; }
.hr-profile .hr-profile-pending { margin-top: 14px; }
.hr-profile-controls :is(button, input, select):focus-visible { outline: 2px solid var(--accent-c, #e8ae40); outline-offset: 3px; }
@media (max-width: 700px) { .hr-review { padding: 14px; } .hr-row { padding: 12px; } .hr-figures { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } .hr-figures > div { padding: 10px; } .hr-dialog { padding: 18px; } }
@media (max-width: 420px) { .hr-times, .hr-profile .hr-figures { grid-template-columns: minmax(0, 1fr); } }