:root { color-scheme: light; font: 16px/1.55 system-ui, sans-serif; color: #1e293b; background: #f6f7fb; }
* { box-sizing: border-box; }
body { margin: 0; }
a { color: #22549d; }
.shell { width: min(100% - 2rem, 1080px); margin: 0 auto; }
.site-header { background: #17283e; color: #fff; }
.site-header .shell, .site-header nav { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; }
.site-header .shell { justify-content: space-between; min-height: 4rem; padding: .65rem 0; }
.site-header a, .nav-button { color: inherit; }
.brand { text-decoration: none; font-weight: 700; font-size: 1.1rem; }
.brand small { margin-left: .4rem; color: #b9c8db; font-weight: 400; }
.nav-button { background: transparent; border: 0; text-decoration: underline; padding: .45rem 0; }
.skip { position: absolute; transform: translateY(-120%); padding: .5rem; background: white; }
.skip:focus { transform: none; z-index: 1; }
main { padding: 1.5rem 0 3rem; overflow-wrap: anywhere; }
h1, h2, h3, p { margin: 0 0 .75rem; }
h1 { font-size: clamp(1.55rem, 4vw, 2.1rem); }
h2 { font-size: 1.25rem; }
.identity, .muted, .hint { color: #526174; }
.panel, section:not(.panel), article:not(.panel) { margin: 1rem 0; padding: 1rem; border: 1px solid #dae1eb; border-radius: .65rem; background: white; }
.notice { border: 1px solid #92c6a9; border-radius: .45rem; background: #ebf7ef; padding: .65rem .85rem; }
.stack { display: grid; gap: .85rem; }
.fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); gap: .85rem; align-items: end; }
form { margin: .4rem 0; }
label { display: block; margin-bottom: .4rem; }
label input:not([type="checkbox"]), label select, label textarea { display: block; width: 100%; margin-top: .2rem; }
input, select, textarea, button { font: inherit; }
input:not([type="checkbox"]), select, textarea { min-height: 2.65rem; border: 1px solid #9ca9bb; border-radius: .35rem; background: white; color: inherit; padding: .45rem .65rem; max-width: 100%; }
textarea { min-height: 5rem; resize: vertical; }
button, .button { cursor: pointer; }
button:not(.nav-button), .button { display: inline-block; min-height: 2.5rem; padding: .42rem .75rem; border: 1px solid #27558a; border-radius: .35rem; background: #27558a; color: #fff; text-decoration: none; }
.button.secondary, button.secondary { background: #fff; color: #22549d; }
:focus-visible { outline: 3px solid #f4a62a; outline-offset: 2px; }
.table-wrap { overflow: auto; }
table { border-collapse: collapse; width: 100%; background: white; margin: .75rem 0; }
th, td { padding: .6rem .75rem; text-align: left; border-bottom: 1px solid #d9e1ec; vertical-align: top; }
dt { font-weight: 650; }
dd { margin: 0 0 .45rem; }
img { max-width: 100%; height: auto; }
video { display: block; max-width: 100%; height: auto; margin-top: .5rem; }
.upload-queue > summary { cursor: pointer; font-weight: 650; }
.upload-queue [data-upload-queue-list] ul { padding-left: 1.25rem; }
.upload-queue [data-upload-queue-list] li + li { margin-top: .75rem; }
.site-photo-preview { display: block; max-height: 10rem; object-fit: contain; margin-bottom: .3rem; border-radius: .35rem; }
.discussion-attachments { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); gap: .5rem; margin-top: .55rem; }
.discussion-attachments a { padding: .55rem .65rem; border: 1px solid #dae1eb; border-radius: .4rem; background: #f6f7fb; }
.discussion-quote { margin: .55rem 0; padding: .45rem .65rem; border-inline-start: .2rem solid #7596bf; background: #f1f5fa; }
.discussion-quote p { margin: .2rem 0; }
#discussion-pins { border-inline-start: .25rem solid #7596bf; }
.discussion-post-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .8rem; margin-top: .4rem; }
.discussion-post-actions form { margin: 0; }
.discussion-search-form { display: flex; flex-wrap: wrap; align-items: end; gap: .5rem .8rem; margin-bottom: 1rem; }
.discussion-search-form label { flex: 1 1 15rem; max-width: 32rem; margin: 0; }
.discussion-search-form a { align-self: center; }
.discussion-message-field .hint { margin: 0; }
.discussion-mention-picker:not([hidden]) { display: grid; gap: .25rem; max-height: 15rem; overflow: auto; padding: .3rem; }
.discussion-mention-picker button { text-align: start; }
.discussion-mention-picker button small { display: block; color: #526174; }
#project-discussion li:target { background: #ebf2fb; }
#discussion-compose, #project-discussion li { scroll-margin-top: .75rem; }
.photo-markup-canvas:not([hidden]) { display: block; max-width: 100%; max-height: 65vh; touch-action: none; }
.photo-markup-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
@media (max-width: 38rem) {
    .shell { width: calc(100% - 1.25rem); }
    .site-header .shell { gap: .35rem; }
    th, td { padding: .5rem; }
}

.schedule-actions { display: flex; flex-wrap: wrap; gap: .45rem; }
.schedule-scroll { overflow-x: auto; margin: 0 0 1rem; border: 1px solid #dae1eb; border-radius: .5rem; }
.schedule-timeline { width: max-content; min-width: 100%; margin: 0; border-collapse: separate; border-spacing: 0; }
.schedule-timeline th, .schedule-timeline td { border-right: 1px solid #dae1eb; }
.schedule-timeline th:last-child, .schedule-timeline td:last-child { border-right: 0; }
.schedule-timeline .schedule-label { position: sticky; left: 0; z-index: 1; width: 13rem; min-width: 13rem; max-width: 13rem; background: #fff; }
.schedule-label small { display: block; font-weight: 400; color: #526174; }
.schedule-timeline .schedule-subtask { padding-left: 1.3rem; }
.schedule-timeline thead th, .schedule-timeline .schedule-project th { background: #e8eef7; }
.schedule-timeline .schedule-day { min-width: 1.8rem; padding: .4rem .25rem; text-align: center; }
.schedule-day.schedule-weekend { background: #f1f4f8; }
.schedule-day.schedule-span { background: #a9c7ea; }
.schedule-project .schedule-span { background: #749fcc; }
.schedule-task-done .schedule-span { background: #b7ddc7; }
.schedule-task-cancelled .schedule-span { background: #d8dde4; }
.schedule-day.schedule-today { box-shadow: inset 2px 0 #22549d; }
@media (max-width: 38rem) {
    .schedule-timeline .schedule-label { width: 10.5rem; min-width: 10.5rem; max-width: 10.5rem; }
    .schedule-timeline .schedule-subtask { padding-left: .9rem; }
}

.material-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: 1rem; padding: 0; list-style: none; }
.material-card { min-width: 0; padding: .85rem; border: 1px solid #dae1eb; border-radius: .65rem; background: #fff; }
.material-option-image { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: contain; background: #f2f5f9; border-radius: .35rem; }
.material-selection { min-width: 0; margin: 0; padding: .65rem; border: 1px solid #dae1eb; border-radius: .5rem; }
.material-selection legend { padding-inline: .35rem; font-weight: 650; }
.material-select-option { display: flex; align-items: center; gap: .55rem; min-height: 2.75rem; padding: .35rem .5rem; margin: .55rem 0 0; border-radius: .35rem; background: #e8eef7; cursor: pointer; }
.material-select-option input[type="radio"] { flex: 0 0 auto; width: 1.1rem; height: 1.1rem; min-height: 0; margin: 0; padding: 0; }
.material-card details { margin: .6rem 0; }

.management-metrics, .management-team { display: grid; gap: .75rem; padding: 0; list-style: none; }
.management-metrics { grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr)); }
.management-metric { display: block; height: 100%; padding: .7rem; border: 1px solid #dae1eb; border-radius: .5rem; background: #fff; text-decoration: none; }
.management-metric strong { display: block; font-size: 1.45rem; color: #17283e; }
.management-metric:hover span { text-decoration: underline; }
.management-section { scroll-margin-top: 1rem; }
.management-items { list-style: none; margin: 0; padding: 0; }
.management-items li { padding: .65rem 0; }
.management-items li + li { border-top: 1px solid #dae1eb; }
.management-items small, .management-team small { display: block; color: #526174; }
.management-items p { margin: .25rem 0 0; }
.management-reminder-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .3rem .75rem; }
.management-reminder-history { margin-top: .55rem; }
.management-reminder-history summary { color: #22549d; cursor: pointer; }
.management-reminder-history ol { margin: .3rem 0 0; padding-inline-start: 1.5rem; }
.management-reminder-history li { padding: .25rem 0; }
.management-team { grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); }
.management-team li { padding: .7rem; border: 1px solid #dae1eb; border-radius: .5rem; }
.management-counts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 6rem), 1fr)); gap: .35rem; margin: .55rem 0 0; }
.management-counts div { padding: .3rem .45rem; background: #f2f5f9; border-radius: .3rem; }
.management-counts dt { color: #526174; font-size: .875rem; font-weight: 500; }
.management-counts dd { margin: 0; font-weight: 650; }
.management-overdue { color: #9a2420; font-weight: 650; }

.timesheet-list, .timesheet-days, .timesheet-events { list-style: none; padding: 0; margin: 0; }
.timesheet-list li, .timesheet-day, .timesheet-events li { padding: .65rem 0; border-bottom: 1px solid #dae1eb; }
.timesheet-list li { display: grid; grid-template-columns: minmax(12rem, 1.2fr) minmax(0, 1fr) auto auto; align-items: start; gap: .25rem 1rem; }
.timesheet-status [data-status], .timesheet-list .timesheet-status { display: inline-block; width: fit-content; padding: .1rem .45rem; border-radius: .35rem; background: #f2f5f9; }
.timesheet-status [data-status="submitted"], .timesheet-list [data-status="submitted"] { background: #e8eef7; }
.timesheet-status [data-status="returned"], .timesheet-list [data-status="returned"] { background: #fff0d6; }
.timesheet-status [data-status="approved"], .timesheet-list [data-status="approved"] { background: #ebf7ef; }
.timesheet-day { display: grid; grid-template-columns: minmax(8rem, .8fr) minmax(9rem, .8fr) minmax(0, 1.4fr); gap: .35rem .75rem; align-items: start; }
.timesheet-day time { color: #526174; }
.timesheet-day label { min-width: 0; margin: 0; }
.timesheet-time-inputs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; }
.timesheet-time-inputs input { width: 100%; }
.timesheet-total { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .15rem .7rem; margin: .65rem 0; padding: .4rem .65rem; border-radius: .35rem; background: #f2f5f9; }
.timesheet-feedback { margin: 0 0 .8rem; padding: .6rem .75rem; border-left: .2rem solid #a9721d; background: #fff8eb; }
.timesheet-feedback p, .timesheet-events p { margin: .2rem 0; }
.timesheet-actions { display: flex; flex-wrap: wrap; gap: .45rem; }
.timesheet-return, .timesheet-history { margin-top: .65rem; }
.timesheet-return summary, .timesheet-history summary { cursor: pointer; font-weight: 650; }
.timesheet-events li:last-child, .timesheet-list li:last-child, .timesheet-day:last-child { border-bottom: 0; }
@media (max-width: 38rem) {
    .timesheet-list li { grid-template-columns: minmax(0, 1fr) auto; }
    .timesheet-list li > strong, .timesheet-list li > span:nth-child(2), .timesheet-note { grid-column: 1 / -1; }
    .timesheet-day { grid-template-columns: minmax(0, 1fr) minmax(7rem, 1fr); }
    .timesheet-actions button, .timesheet-actions form { width: 100%; }
}

.work-timer-running, .work-timer-sessions > li { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: .5rem 1rem; }
.work-timer-running p, .work-timer-sessions p { margin: .15rem 0; }
.work-timer-clock { font-size: 1.55rem; font-weight: 650; font-variant-numeric: tabular-nums; }
.work-timer-sessions, .work-timer-sheet-links { margin: 0; padding: 0; list-style: none; }
.work-timer-sessions > li { padding: .65rem 0; }
.work-timer-sessions > li + li { border-top: 1px solid #dae1eb; }
.work-timer-geotags { margin: .35rem 0; }
.work-timer-geotags summary { cursor: pointer; }
.work-timer-geotags dl { margin: .35rem 0 0; }
.work-timer-geotags dd { margin: 0 0 .25rem; }