:root{color-scheme:dark;font-family:system-ui,-apple-system,'Segoe UI',sans-serif;color:#f3efeb;background:#3d3430;font-size:15.4px;--panel:#2f2926;--muted:#b7aca5;--border:#5a4d44;--field:#443a34;--blue:#3985a2}
*{box-sizing:border-box}
body{max-width:760px;margin:0 auto;padding:24px 24px max(36px,env(safe-area-inset-bottom));line-height:1.5;-webkit-text-size-adjust:100%}
header{display:flex;justify-content:space-between;align-items:center;padding-bottom:18px;margin-bottom:28px;border-bottom:1px solid #ffffff0d}
a{color:var(--muted);text-decoration:none}.attendance-link{font-size:13.2px}
h1{font-size:29.7px;font-weight:450;line-height:1.2;letter-spacing:-.035em;margin:0}
h2{font-size:16.5px;font-weight:550;margin:0 0 18px}
.section-head{display:flex;justify-content:space-between;align-items:center;gap:14px}
.section-head h2{margin:0}.page-heading{margin-bottom:22px}
button{min-height:42px;padding:10px 15px;border:1px solid transparent;border-radius:10px;font:500 13.2px/1.4 system-ui,sans-serif;cursor:pointer;color:#f3efeb;white-space:nowrap}
button:disabled{opacity:.4;cursor:default}.primary{background:var(--blue)}.secondary{background:#51463f;border-color:#65574e}.quiet{background:transparent;color:var(--muted)}
header .quiet{padding:4px 0;min-height:30px}
.list-tools{display:flex;align-items:stretch;gap:12px;margin-bottom:16px}.list-tools .worker-search{flex:1;min-width:0;margin:0}.list-tools .primary{flex-shrink:0;min-height:48px}
.panel{background:var(--panel);border:1px solid #ffffff08;border-radius:17px;padding:22px;margin:18px 0}
.worker-list{padding:0 20px;margin-top:0}
.worker-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;padding:19px 0;border-bottom:1px solid #ffffff0b}
.worker-row:last-child{border-bottom:0}.worker-name{font-size:15.4px;font-weight:550;overflow-wrap:anywhere}.worker-meta{font-size:12.1px;color:var(--muted);margin-top:4px}.inactive{color:#e9974d}
.row-actions{display:flex;align-items:center;gap:7px}.row-actions button{min-height:36px;padding:8px 11px;font-size:12.1px;border:1px solid var(--border);border-radius:9px}.row-actions button:first-child{color:#9fc6d4;border-color:transparent}
label{display:block;color:var(--muted);font-size:13.2px;margin:0 0 18px}
input,select{display:block;width:100%;min-height:48px;padding:12px 13px;font:400 17.6px/1.4 system-ui,sans-serif;background:var(--field);border:1px solid #6c5e55;border-radius:10px;color:#f3efeb;margin-top:7px;outline:none;box-shadow:none}
input::placeholder{font-size:14.3px;color:#b7aca5}
input:focus,input:focus-visible,select:focus,select:focus-visible{outline:none;box-shadow:none;border-color:#6c5e55;background:var(--field)}
input:-webkit-autofill,input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 1000px var(--field) inset!important;box-shadow:0 0 0 1000px var(--field) inset!important;-webkit-text-fill-color:#f3efeb!important;caret-color:#f3efeb}
button:focus-visible,a:focus-visible{outline:2px solid #d7bba4;outline-offset:3px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
#addPanel .section-head{margin-bottom:20px}#addForm .primary,#settingsForm .primary{width:100%;min-height:46px;margin-top:4px}
.back-link{padding:0;min-height:30px;margin:0 0 14px}.back-link:hover,.attendance-link:hover{color:#f3efeb}
#manageName{font-size:27.5px;margin-bottom:22px;overflow-wrap:anywhere}
#managePanel .panel{margin:0 0 18px}.setting-note{font-size:13.2px;color:var(--muted);line-height:1.6;margin:14px 0}.setting-note:last-child{margin-bottom:0}
#message{font-size:13.2px;color:var(--muted);margin:0 0 18px}#message:empty{display:none}#message.error{color:#f1aa70}
.code-panel{border-color:#3985a2}#codeName{font-size:15.4px;overflow-wrap:anywhere}
#newCode{display:block;background:var(--field);padding:16px;border-radius:10px;font:20.9px/1.5 ui-monospace,monospace;overflow-wrap:anywhere;letter-spacing:.03em}
.code-actions{display:flex;gap:10px;margin-top:18px}.muted{color:var(--muted);font-size:13.2px}
[hidden]{display:none!important}
@media(max-width:420px){body{padding:20px 16px max(28px,env(safe-area-inset-bottom))}header{margin-bottom:24px}h1{font-size:27.5px}.panel{padding:18px}.worker-list{padding:0 16px}.worker-row{gap:8px;padding:17px 0}.worker-name{font-size:14.3px}.worker-meta{font-size:11px}.row-actions{gap:2px}.row-actions button{padding:8px;font-size:12.1px}.form-grid{gap:12px}.list-tools{gap:10px}}
@media(max-width:340px){.worker-row{grid-template-columns:1fr}.row-actions{justify-content:flex-end}.form-grid{grid-template-columns:1fr;gap:0}.code-actions{flex-wrap:wrap}}

.danger{background:transparent;color:#e8a79c;border-color:#88594e}.delete-panel{border-color:#6b4b42}

.rate-history-row{display:flex;justify-content:space-between;gap:12px;white-space:normal;width:100%;background:transparent;color:#f3efeb;text-align:left;border-radius:0;border-bottom:1px solid #ffffff0b;padding:12px 0}.rate-history-row span:last-child{color:var(--muted)}.rate-history-row:disabled{opacity:1;cursor:default}

/* Constrain the native iPhone month control and grid items to their card. */
label,.form-grid>*{min-width:0;max-width:100%}
.form-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
#settingMonth{display:block;width:100%;min-width:0;max-width:100%;box-sizing:border-box;-webkit-appearance:none;appearance:none;overflow:hidden;text-align:left}
#settingMonth::-webkit-date-and-time-value{min-width:0;text-align:left}
#settingMonth::-webkit-datetime-edit{padding:0;min-width:0}
.hourly-preview{display:block;color:var(--muted);font-size:12.1px;font-weight:400;line-height:1.5;margin-top:7px;overflow-wrap:anywhere}
#managePanel .support-panel,.support-panel.code-panel{background:transparent;border:0;border-top:1px solid #65574e;border-radius:0;padding:22px 0;margin:0}
#managePanel .support-panel.delete-panel{border-color:#65574e}
@media(max-width:340px){.form-grid{grid-template-columns:1fr}}

/* Hide page scrollbars without disabling wheel or touch scrolling. */
html,body{scrollbar-width:none;-ms-overflow-style:none}
html::-webkit-scrollbar,body::-webkit-scrollbar{display:none;width:0;height:0}
#managePanel #settingsForm+.support-panel{margin-top:30px}

#managePanel #settingsForm{margin-bottom:0}
