*{box-sizing:border-box}body{margin:0;background:#f3f6f9;color:#183046;font:16px/1.55 system-ui,-apple-system,sans-serif}.preview{padding:9px 24px;background:#fff0d1;color:#624600;text-align:center;font-size:13px;font-weight:600}header{display:flex;align-items:center;justify-content:space-between;padding:22px max(24px,calc((100vw - 1160px)/2));background:#fff;border-bottom:1px solid #dce5ec}header img{width:165px;height:auto}header span{font-size:22px;font-weight:700}nav{display:flex;align-items:center;gap:28px;max-width:1208px;margin:auto;padding:18px 24px}nav form{margin-left:auto}main{max-width:1208px;margin:24px auto 64px;padding:0 24px}h1{font-size:34px;letter-spacing:-1px}h2{font-size:22px;margin:12px 0}.card{background:white;border:1px solid #dce5ec;border-radius:16px;padding:26px;margin:20px 0;box-shadow:0 6px 20px #18304605}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}.grid .card{margin:0}.badge{background:#e5f1ef;color:#005c4d;padding:5px 10px;border-radius:6px;font-weight:700;font-size:14px}.login{max-width:440px;margin:30px auto}label{display:block;font-weight:600;margin:18px 0 6px}input,select{width:100%;font:inherit;padding:12px;border:1px solid #acbdcb;border-radius:8px}button,.button{font:inherit;background:#007564;color:#fff;border:0;border-radius:8px;padding:11px 20px;cursor:pointer;display:inline-block;text-decoration:none}.login button{margin-top:24px;width:100%}a{color:#00695a;text-underline-offset:3px}.link{padding:0;background:none;color:#00695a;text-decoration:underline}.muted,footer{color:#62758a;font-size:14px}footer{padding:24px;text-align:center;border-top:1px solid #dce5ec}.notice{padding:16px;background:#fff0d1;border-radius:8px}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:14px}th,td{text-align:left;padding:14px 12px;border-bottom:1px solid #e3eaf0}th{background:#f7f9fb;white-space:nowrap}:focus-visible{outline:3px solid #d3941c;outline-offset:3px}@media(max-width:600px){header{padding:18px}header span{font-size:18px}header img{width:120px}nav{gap:14px;font-size:14px;flex-wrap:wrap}main{padding:0 16px}h1{font-size:28px}.card{padding:20px}}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:18px}.actions{display:flex;gap:20px;align-items:center;flex-wrap:wrap}textarea{width:100%;font:inherit;padding:12px;border:1px solid #acbdcb;border-radius:8px;resize:vertical}fieldset{border:1px solid #dce5ec;border-radius:8px;margin:24px 0;padding:20px}legend{font-weight:700;padding:0 8px}.check{display:flex;gap:8px;align-items:center;font-weight:400}.check input{width:auto}.checks{display:flex;gap:18px;flex-wrap:wrap}.nowrap{white-space:nowrap}[hidden]{display:none!important}

/* Customer forms share sizing, spacing and clear keyboard focus. */
textarea {
    display: block;
    width: 100%;
    max-width: 100%;
    min-height: 200px;
    font: inherit;
    line-height: 1.6;
    padding: 14px;
    background: #fff;
    color: inherit;
    border: 1px solid #acbdcb;
    border-radius: 8px;
    resize: vertical;
}
.actions { gap: 12px; margin: 24px 0 0; }
.button.secondary { background: #eef4f7; color: #183046; border: 1px solid #cedce5; }
.button.delete-link { background: #fff; color: #a62e33; border: 1px solid #dfbfc2; }
button.danger { background: #a62e33; }
button:hover, .button:hover { filter: brightness(.95); }
.field-help { color: #52677b; margin: 6px 0 18px; }
h3 { font-size: 17px; margin: 28px 0 6px; }
.access-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr); gap: 24px; align-items: start; }
.access-content, .access-sidebar { min-width: 0; }
.access-layout .card { margin-top: 0; margin-bottom: 24px; }
.account-details h2 { margin-top: 18px; overflow-wrap: anywhere; }
.account-details p { margin-bottom: 0; }
.account-picker label { margin-top: 0; }
.access-editor h2 { margin-top: 0; }
.access-editor fieldset { padding: 22px 0 0; border: 0; border-top: 1px solid #dce5ec; border-radius: 0; margin: 28px 0; min-width: 0; }
.access-editor legend { padding: 0 10px 0 0; font-size: 18px; }
.paired-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.paired-fields label { margin-top: 8px; }
input, select { min-width: 0; background-color: #fff; color: inherit; }
.check input { width: 20px; height: 20px; margin: 0; padding: 0; accent-color: #007564; flex-shrink: 0; }
.weekday-options { gap: 10px; }
.weekday-options .check { margin: 0; padding: 8px 10px; border: 1px solid #dce5ec; border-radius: 8px; background: #f7fafb; font-size: 14px; cursor: pointer; }
.weekday-options .check:has(input:checked) { border-color: #007564; background: #e5f1ef; }
.staff-level { display: flex; align-items: center; gap: 18px; }
.staff-level input { padding: 10px 0; accent-color: #007564; }
.staff-level output { min-width: 65px; padding: 6px 10px; border-radius: 6px; background: #e5f1ef; color: #005c4d; font-weight: 700; text-align: center; }
.notes-field { border-top: 1px solid #dce5ec; padding-top: 8px; }
.notes-field label { font-size: 18px; }
.access-rule { border-left-width: 5px; }
.rule-0 { border-left-color: #bc453b; }
.rule-1 { border-left-color: #a77115; }
.rule-2 { border-left-color: #007564; background: #f5fbf9; }
.rule-3 { border-left-color: #39729a; }
.rule-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.rule-heading h2 { margin: 0; }
.review-status { font-size: 12px; color: #52677b; background: #eef3f6; border-radius: 20px; padding: 5px 10px; }
.day-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 18px; }
.day-tags span { font-size: 13px; border-radius: 5px; padding: 4px 8px; background: #e0eee9; color: #005c4d; }
.opening-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 22px 0; }
.opening-summary dt { color: #52677b; font-size: 14px; }
.opening-summary dd { margin: 2px 0 0; font-size: 24px; font-weight: 700; }
.rule-notes { overflow-wrap: anywhere; }
@media (max-width: 850px) {
    .access-layout { grid-template-columns: minmax(0, 1fr); }
    .access-sidebar { grid-row: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
    .access-sidebar .card { margin-bottom: 0; }
}
@media (max-width: 600px) {
    .access-sidebar { grid-template-columns: minmax(0, 1fr); }
    .paired-fields { grid-template-columns: minmax(0, 1fr); gap: 6px; }
    textarea { min-height: 180px; }
    .access-editor fieldset { padding-top: 16px; }
}