:root{font-family:system-ui,sans-serif;color:#193338;background:#f2f5f2;line-height:1.5}*{box-sizing:border-box}body{margin:0}header{display:flex;gap:1rem;align-items:center;background:#133d3d;color:white;padding:1.4rem max(1rem,calc((100vw - 900px)/2))}header h1,header p{margin:0}.mark{font-size:2.5rem}main{max-width:900px;margin:auto;padding:1rem}section,details,form.account{background:white;border:1px solid #cbd8d3;border-radius:.6rem;padding:1.2rem;margin-bottom:1rem}section section{background:#f5faf7}h2,h3{margin-top:.4rem}label{display:block;margin:.8rem 0}input,select,button{font:inherit;max-width:100%}input:not([type=checkbox]),select{display:block;width:100%;padding:.65rem;border:1px solid #6b8580;border-radius:.3rem}input[type=checkbox]{width:1.2rem;height:1.2rem;vertical-align:middle}button{padding:.65rem 1rem;background:#17625a;color:white;border:1px solid #17625a;border-radius:.3rem;cursor:pointer;margin:.3rem .4rem .3rem 0}button.secondary{background:white;color:#174d46}button:disabled{opacity:.6;cursor:wait}:focus-visible{outline:3px solid #b57613;outline-offset:3px}.bar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center}#notice:not(:empty){padding:1rem;border-left:4px solid #b57613;background:#fff4d9}dialog{max-width:min(90vw,480px);border:2px solid #17625a;border-radius:.6rem}dialog::backdrop{background:#102a2ab0}code,pre{overflow-wrap:anywhere;white-space:pre-wrap;font-size:.9rem}footer{font-size:.85rem;padding:1rem 0;color:#425e57}[hidden]{display:none!important}

textarea{display:block;width:100%;max-width:100%;font:inherit;padding:.6rem;border:1px solid #6b8580}#feedback-open{position:sticky;top:.5rem;z-index:1}summary{cursor:pointer}#system-status{max-width:100%}
/* Reception controls work with touch and keyboard; identity is short-lived. */
.terminal main { max-width: 1200px; }
.terminal button, .terminal input, .terminal select { min-height: 48px; font-size: 1.1rem; }
.keypad { display: grid; grid-template-columns: repeat(3, minmax(64px, 1fr)); max-width: 360px; gap: 8px; margin: 12px 0; }
.terminal-lists { display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 16px; }
#connection:not(:empty) { padding: 16px; border: 2px solid #9b332c; color: #7b1d17; background: #fff1ef; }
#clock-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 16px 0; }

#work-panel p { overflow-wrap:anywhere; }
#work-panel button { min-height:44px; }

.schedule-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.35rem}.schedule-day{padding:.4rem;min-width:0}.schedule-day h3{font-size:.95rem}.schedule-card{border-top:3px solid #17625a;margin:.7rem 0;padding:.3rem;overflow-wrap:anywhere}.schedule-card h4{margin:.3rem 0}.schedule-card p{font-size:.8rem}.schedule-card button{font-size:.8rem;padding:.45rem;margin:.15rem 0;width:100%;min-height:44px}.schedule-card[draggable=true]{cursor:grab}#schedule-editor{overflow-wrap:anywhere}#schedule-editor input{min-width:0}@media(max-width:760px){.schedule-grid{grid-template-columns:1fr}.schedule-card button{width:auto;margin-right:.3rem}.schedule-day{padding:.75rem}}

/* Dated leave uses nested interval fieldsets; keep native min-content sizes within mobile width. */
#leave{overflow-wrap:anywhere}#leave fieldset{min-width:0;max-width:100%;padding:.7rem}#leave input,#leave select{min-width:0}#leave button{min-height:44px}

/* Artifact hashes and exact revision identities must wrap on narrow screens. */
#delivery{overflow-wrap:anywhere}#delivery input,#delivery select{min-width:0}#delivery button{min-height:44px}

#payroll {overflow-wrap:anywhere; min-width:0} #payroll pre {white-space:pre-wrap; overflow-wrap:anywhere} #payroll section {border-top:1px solid #ccd4d9; padding-block:1rem} #payroll input {max-width:100%; min-width:0}
#payroll button {min-height:44px}
@media(max-width:600px){#payroll{padding:.65rem}#payroll section,#payroll details{padding:.5rem}#payroll-review>section{border:0;padding:.5rem 0}#payroll button{padding:.6rem;max-width:100%}}

#reporting,#settings-navigation{overflow-wrap:anywhere;min-width:0} #reporting button,#settings-navigation button{min-height:44px;max-width:100%} #settings-navigation [role=tablist]{display:flex;flex-wrap:wrap;gap:.3rem} #settings-navigation [aria-selected=true]{background:#17625a;color:white}
