:root { --navy:#08243a; --navy2:#061b2b; --cyan:#126b91; --ink:#102739; --muted:#61717d; --line:#d8e0e5; --bg:#f2f6f8; --white:#fff; --danger:#a33434; }
* { box-sizing:border-box; }
html, body { margin:0; min-height:100%; background:var(--bg); color:var(--ink); font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif; }
a { color:var(--cyan); }
button, input, select, textarea { font:inherit; }
.page-wrap { width:min(1180px, calc(100% - 36px)); margin:auto; }
.topbar { background:var(--navy2); color:#fff; }
.topbar-inner { min-height:62px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand { color:#fff; font-weight:700; text-decoration:none; }
.topbar-meta { color:#d2dde4; font-size:12px; }
.ops-nav { border-bottom:1px solid var(--line); background:#fff; }
.nav-inner { min-height:44px; display:flex; align-items:center; gap:20px; }
.nav-inner a { font-weight:700; text-decoration:none; }
.nav-link { align-self:stretch; display:inline-flex; align-items:center; padding:0 12px; color:var(--cyan); }
.nav-link.active { background:#e7eef2; color:var(--navy); box-shadow:inset 0 -3px 0 var(--cyan); }
.nav-link:focus-visible { outline:3px solid rgba(18,107,145,.28); outline-offset:-3px; }
.nav-account { margin-left:auto; color:var(--muted); font-size:13px; }
.link-button { padding:0; border:0; background:none; color:var(--cyan); cursor:pointer; font-weight:700; }
.page-content { padding:42px 0 70px; }
.page-heading { margin-bottom:24px; }
.split-heading, .panel-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; }
.eyebrow { margin:0 0 7px; color:var(--cyan); font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
h1 { margin:0; font-size:clamp(30px,4vw,46px); line-height:1.08; letter-spacing:-.035em; }
h2 { margin:0; font-size:21px; }
.lead { max-width:730px; margin:10px 0 0; color:var(--muted); }
.back-link { display:inline-block; margin-bottom:20px; font-weight:700; text-decoration:none; }
.panel { margin:18px 0; padding:24px; border:1px solid var(--line); background:#fff; box-shadow:0 8px 28px rgba(15,40,58,.04); }
.metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.metrics div { min-height:116px; padding:20px; border:1px solid var(--line); background:#fff; }
.metrics span, .metrics small { display:block; color:var(--muted); }
.metrics strong { display:block; margin:6px 0 3px; font-size:21px; }
.fixture-chip { padding:5px 9px; border:1px solid #a9ccd8; background:#edf8fb; color:#0b607c; font-size:11px; font-weight:700; }
.table-scroll { margin-top:18px; overflow:auto; }
.report-heading { align-items:center; }
.quarterly-report { min-width:0; }
.quarterly-report .table-scroll { max-width:100%; }
.report-quarter-navigation { flex-wrap:nowrap; }
.report-quarter-navigation>.calendar-nav-arrow { flex:0 0 42px; }
.report-quarter-navigation>.report-quarter-picker { min-width:0; flex:0 1 auto; }
.report-quarter-navigation .report-quarter-picker .button { flex:0 0 auto; }
.report-quarter-picker { display:flex; gap:8px; }
.report-quarter-picker select { min-width:126px; }
.quarterly-report h3 { margin:24px 0 0; font-size:16px; }
.quarterly-report .table-scroll { margin-top:10px; }
.quarterly-report table { min-width:570px; }
.quarterly-report .report-delivery-table { min-width:300px; }
.quarterly-report th:not(:first-child), .quarterly-report td { text-align:center; font-variant-numeric:tabular-nums; }
.quarterly-report tbody th { background:none; color:var(--ink); text-transform:none; letter-spacing:normal; font-size:14px; }
.quarterly-report tfoot { font-weight:800; }
.report-note { padding:10px 12px; border-left:3px solid var(--cyan); background:#edf2f5; color:var(--ink); font-size:13px; }
.report-quarter-go[hidden] { display:none; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
table { width:100%; min-width:800px; border-collapse:collapse; }
th, td { padding:13px 12px; border-bottom:1px solid var(--line); text-align:left; }
th { background:#edf2f5; color:#435662; font-size:11px; letter-spacing:.05em; text-transform:uppercase; }
.row-link { font-weight:700; }
.status { display:inline-block; padding:4px 8px; border-radius:20px; background:#e8eef2; font-size:11px; font-weight:800; }
.status.confirmed { background:#dff3e3; color:#1e6533; }
.status.cancelled { background:#f4e2e2; color:#8d2e2e; }
.status.previewed { background:#e5eef5; color:#315d78; }
.status.applied { background:#dff3e3; color:#1e6533; }
.status.rolled_back, .status.rejected { background:#f4e2e2; color:#8d2e2e; }
.status.active { background:#dff3e3; color:#1e6533; }
.status.inactive { background:#f4e2e2; color:#8d2e2e; }
.status.required { background:#fff1c9; color:#725407; }
.button { display:inline-flex; min-height:42px; align-items:center; justify-content:center; padding:9px 15px; border:1px solid transparent; text-decoration:none; cursor:pointer; font-weight:750; }
.button.primary { background:var(--navy); color:#fff; }
.button.secondary { border-color:#bdc9d0; background:#fff; color:var(--ink); }
.button.danger { background:var(--danger); color:#fff; }
.button.danger-outline { border-color:#ca9a9a; background:#fff; color:var(--danger); }
.button:disabled { opacity:.42; cursor:not-allowed; }
.button-row, .form-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.form-panel fieldset { margin:0 0 24px; padding:0; border:0; }
.form-panel legend { width:100%; margin-bottom:14px; padding-bottom:8px; border-bottom:1px solid var(--line); font-size:18px; font-weight:800; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:17px; }
.field-wide { grid-column:1/-1; }
.field label { display:block; margin-bottom:6px; font-size:13px; font-weight:750; }
.form-control, .stack-form input { width:100%; min-height:42px; padding:9px 10px; border:1px solid #aebbc4; background:#fff; color:var(--ink); }
textarea.form-control { min-height:80px; resize:vertical; }
.errorlist { margin:5px 0 0; padding:0; color:var(--danger); list-style:none; font-size:12px; }
.public-fieldset { padding:18px !important; border-left:4px solid #58a9c6 !important; background:#f1f9fc; }
.private-fieldset, .private-panel { padding:18px !important; border-left:4px solid #a5803a !important; background:#fffaf0; }
.detail-grid, .preview-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.detail-grid .panel, .preview-grid .panel { margin:0; }
.details { margin:18px 0 0; }
.details div { display:grid; grid-template-columns:150px 1fr; gap:18px; padding:10px 0; border-top:1px solid var(--line); }
.details dt { color:var(--muted); font-weight:700; }
.details dd { margin:0; }
.audit-list { margin:18px 0 0; padding-left:22px; }
.audit-list li { padding:5px 0 14px 6px; }
.audit-list span { display:block; color:var(--muted); font-size:12px; }
.audit-list p { margin:4px 0 0; }
.validation-ok { padding:12px; background:#e8f6eb; color:#1f6533; font-weight:800; }
.validation-error, .message.error { background:#fae8e8; color:#8c2929; }
.validation-list { margin:18px 0 0; padding-left:22px; }
.validation-list li { margin:7px 0; padding-left:4px; }
.validation-list .validation-error { padding:7px 9px; }
.validation-warning { color:#765c06; }
.validation-pass { color:#285f39; }
.rule-note { color:var(--muted); font-size:12px; }
.message { margin:0 0 18px; padding:12px 14px; border:1px solid var(--line); background:#e8f6eb; }
.login-shell { min-height:calc(100vh - 174px); display:grid; place-items:center; }
.login-card { width:min(460px,100%); padding:34px; border:1px solid var(--line); background:#fff; box-shadow:0 18px 50px rgba(12,39,56,.09); }
.login-links { margin:20px 0 0; font-weight:700; }
.stack-form { display:grid; gap:17px; margin-top:24px; }
.stack-form label { display:block; margin-bottom:6px; font-weight:750; }
.password-help { margin-top:7px; color:var(--muted); font-size:12px; }
.password-help ul { margin:6px 0 0; padding-left:20px; }
.narrow-panel { max-width:720px; }
.bulk-delete-confirmation { border-left:5px solid var(--danger); }
.bulk-delete-count { margin-top:0; font-size:21px; }
.access-table { min-width:920px; }
.access-audit-list { padding-left:24px; }
.access-audit-list strong { overflow-wrap:anywhere; }
.checkbox-field label { display:inline-block; margin:0 8px 0 0; }
.checkbox-field input { width:18px; height:18px; vertical-align:middle; }
.access-guard-note { margin:22px 0 0; padding:12px; border-left:4px solid #a5803a; background:#fffaf0; }
.access-warning-panel { border-left:5px solid var(--danger); }
.planner-isolation { border-left:4px solid #3a91ad; background:#edf8fb; }
.planner-version-choice { padding:14px 16px; border:1px solid #cbd7de; background:#f7fafb; }
.planner-version-choice .password-help { margin:8px 0 0; }
.planner-version-options { display:grid; gap:8px; }
.planner-version-options label { display:flex; align-items:flex-start; gap:9px; margin:0; padding:9px 10px; border:1px solid #d7e0e5; background:#fff; cursor:pointer; }
.planner-version-options input { flex:0 0 auto; width:18px; height:18px; margin:2px 0 0; }
.table-note { display:block; margin-top:3px; color:var(--muted); font-size:11px; }
.plan-status { align-self:flex-start; margin-top:26px; }
.hash-value { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; }
.rota-plan-table { min-width:900px; table-layout:fixed; }
.rota-plan-table th:nth-child(1) { width:64px; }
.rota-plan-table th:nth-child(2) { width:90px; }
.rota-plan-table th:nth-child(3) { width:190px; }
.rota-plan-table td { vertical-align:top; }
.rota-org { display:inline-block; padding:5px 8px; border-left:4px solid var(--rota-colour,#7ba3b5); background:#edf3f5; font-weight:800; }
.two-panel-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.two-panel-grid>.panel { min-width:0; margin:18px 0 0; }
.compact-table { min-width:520px; }
.compact-table th, .compact-table td { padding:9px 8px; }
.wrap-code { overflow-wrap:anywhere; }
.approval-panel { border-left:5px solid #2d8a50; }
.rollback-panel { border-left:5px solid var(--danger); }
.calendar-range { margin:4px 0 0; color:var(--muted); font-size:13px; }
.calendar-preview { margin-top:18px; }
.calendar-scroll { max-width:100%; overflow:auto; }
.calendar-scroll:focus-visible { outline:3px solid rgba(18,107,145,.25); outline-offset:2px; }
.rota-calendar-grid { display:grid; gap:18px; }
.rota-four-week-block { min-width:0; border:1px solid var(--line); }
.rota-four-week-block h3 { margin:0; padding:8px 10px; background:var(--navy); color:#fff; font-size:14px; text-align:center; }
.rota-calendar { position:relative; width:max(100%,var(--timeline-width)); }
.day-header { display:grid; grid-template-columns:72px repeat(var(--day-count),minmax(0,1fr)); }
.day-header { min-height:42px; border-bottom:1px solid var(--line); background:#eef3f5; }
.calendar-corner { position:sticky; left:0; z-index:8; display:grid; place-items:center; border-right:1px solid var(--line); background:#eef3f5; }
.day-heading { min-width:0; display:grid; align-content:center; justify-items:center; border-right:1px solid var(--line); background:#eef3f5; }
.day-heading.weekend { background:#e8eef1; }
.day-heading span { color:var(--muted); font-size:8px; font-weight:400; text-transform:uppercase; }
.day-heading strong { margin-top:1px; color:var(--navy); font-size:10px; }
.day-heading.bank-holiday span,.day-heading.bank-holiday strong,.bank-holiday-marker { color:var(--danger); font-weight:800; }
.bank-holiday-marker { font-size:7px; line-height:1; text-decoration:none; }
.day-heading.outside-month { background:#f4f6f7; }
.day-heading.outside-month.weekend { background:#f0f3f4; }
.day-heading.outside-month span,.day-heading.outside-month strong { color:#96a2aa; }
.day-heading.outside-month.bank-holiday span,.day-heading.outside-month.bank-holiday strong,.day-heading.outside-month .bank-holiday-marker { color:#b98787; }
.bank-holiday-marker:focus-visible { outline:2px solid rgba(163,52,52,.35); outline-offset:1px; }
.calendar-row { display:grid; grid-template-columns:72px minmax(0,1fr); border-bottom:1px solid var(--line); }
.calendar-row:last-child { border-bottom:0; }
.notice-row { height:38px; }
.krios2,.krios3 { height:54px; }
.row-label { position:sticky; left:0; z-index:7; display:grid; place-items:center; padding:4px 3px; border-right:1px solid var(--line); background:#e7edf0; color:var(--navy); font-weight:700; text-align:center; }
.row-label strong { font-size:11px; letter-spacing:.06em; text-transform:uppercase; }
.row-track { position:relative; min-width:0; height:100%; overflow:hidden; }
.day-cell-layer { position:absolute; inset:0; display:grid; grid-template-columns:repeat(var(--day-count),minmax(0,1fr)); }
.day-cell { border-right:1px solid #e7edef; background:#fff; }
.day-cell.weekend { background:#f8fafb; }
.day-cell.outside-month { background:#f7f9fa; }
.closure-layer { position:absolute; inset:0; z-index:1; pointer-events:none; }
.closure-shade { position:absolute; top:0; bottom:0; background:rgba(112,124,132,.28); box-shadow:inset 1px 0 rgba(78,91,99,.16),inset -1px 0 rgba(78,91,99,.16); }
.event-layer { position:absolute; inset:0; pointer-events:none; }
.month-emphasis-layer { position:absolute; inset:0; z-index:3; display:grid; grid-template-columns:repeat(var(--day-count),minmax(0,1fr)); pointer-events:none; }
.month-emphasis-layer .outside-month { background:rgba(244,247,249,.54); }
.today-line-overlay { position:absolute; top:42px; right:0; bottom:0; left:72px; z-index:6; overflow:hidden; pointer-events:none; }
.today-line { position:absolute; top:0; bottom:0; width:2px; background:#238b57; box-shadow:0 0 0 1px rgba(255,255,255,.28); transform:translateX(-1px); }
.session-span,.holiday-span { position:absolute; z-index:2; overflow:hidden; border-radius:0; text-align:center; text-decoration:none; }
.session-span,.holiday-span { pointer-events:auto; }
.session-span { top:0; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; min-width:2px; padding:3px; border:0; color:#263744; }
.session-span.special-session { box-shadow:inset 0 0 0 2px #b42318; }
a.session-span,a.holiday-span { cursor:pointer; }
.session-span:hover,.holiday-span:hover { z-index:4; filter:brightness(.96); }
.session-span:focus-visible,.holiday-span:focus-visible { z-index:5; outline:3px solid rgba(18,107,145,.3); outline-offset:-3px; }
.session-span strong { display:block; overflow:hidden; max-width:100%; color:#263744; font-size:11px; line-height:1.15; overflow-wrap:anywhere; text-overflow:ellipsis; white-space:normal; }
.session-span small { display:block; margin-top:2px; color:#4e5f69; font-size:8px; font-weight:800; line-height:1; text-transform:uppercase; }
.session-span.micro { padding:0; }
.session-span.micro strong,.session-span.micro small { display:none; }
.session-span.clipped-start,.holiday-span.clipped-start { border-left-style:dashed; border-radius:0 2px 2px 0; }
.session-span.clipped-end,.holiday-span.clipped-end { border-radius:2px 0 0 2px; }
.holiday-span { top:0; height:100%; display:grid; place-items:center; min-width:3px; padding:3px; border:0; color:#684a16; }
.holiday-span.muted-holiday { color:#4f405f; }
.holiday-span strong { overflow:hidden; max-width:100%; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.empty-calendar { margin:14px 0 0; color:var(--muted); font-size:13px; }
.upcoming-panel-heading { align-items:center; }
.calendar-navigation { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.calendar-navigation .calendar-nav-arrow { min-width:42px; padding-right:12px; padding-left:12px; }
.calendar-navigation .calendar-nav-today { min-width:82px; }
.compact-button { min-width:auto; }
.calendar-hint { margin:14px 0 0; color:var(--muted); font-size:12px; }
.calendar-selectable-cell { position:relative; cursor:crosshair; transition:background-color .12s ease, box-shadow .12s ease; }
.calendar-selectable-cell:hover,.calendar-selectable-cell:focus-visible { z-index:1; outline:none; background:#d9eef5; box-shadow:inset 0 0 0 2px #4a9bb8; }
.calendar-selectable-cell.is-selected { z-index:1; background:#bfe1ed; box-shadow:inset 0 2px 0 #257c9c,inset 0 -2px 0 #257c9c; }
.calendar-drawer { position:fixed; inset:0; z-index:100; display:grid; grid-template-columns:minmax(0,1fr) min(520px,calc(100% - 26px)); }
.calendar-drawer[hidden] { display:none; }
.drawer-backdrop { grid-column:1; width:100%; border:0; background:rgba(5,24,37,.48); cursor:pointer; }
.drawer-panel { grid-column:2; min-width:0; height:100%; overflow:auto; padding:26px; background:#fff; box-shadow:-12px 0 42px rgba(5,29,44,.2); }
.drawer-topline { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; }
.drawer-topline .eyebrow { margin:0; }
.drawer-close { width:38px; height:38px; border:1px solid var(--line); border-radius:50%; background:#fff; color:var(--ink); cursor:pointer; font-size:24px; line-height:1; }
.drawer-heading h2 { font-size:27px; line-height:1.15; }
.drawer-subtitle { margin:7px 0 0; color:var(--muted); }
.drawer-details { margin-top:22px; }
.drawer-details div { grid-template-columns:120px 1fr; }
.drawer-private { margin:22px 0; padding:16px; border-left:4px solid #a5803a; background:#fffaf0; }
.drawer-private p { margin:5px 0; }
.drawer-actions { margin-top:22px; }
.drawer-audit { margin-top:26px; border-top:1px solid var(--line); padding-top:15px; }
.drawer-audit summary { cursor:pointer; font-weight:800; }
.drawer-form { display:grid; gap:16px; margin-top:22px; }
.drawer-form .field-help,.field-help { display:block; margin-top:4px; color:var(--muted); font-size:11px; }
.drawer-form .form-actions { margin-top:4px; }
.custom-session-fields { grid-column:1/-1; display:grid; grid-template-columns:minmax(0,1fr) 84px; gap:12px; }
.custom-session-fields[hidden] { display:none; }
.custom-colour-field input[type="color"] { min-width:64px; padding:3px; cursor:pointer; }
.drawer-success { padding-top:18vh; }
.drawer-success h2 { font-size:30px; }
body.drawer-open { overflow:hidden; }
.sr-only { position:absolute; left:0; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:720px) { .page-wrap{width:min(100% - 22px,1180px)} .page-content{padding-top:26px} .split-heading,.panel-heading{display:block} .split-heading>.button,.split-heading>.button-row{margin-top:18px} .metrics,.detail-grid,.preview-grid,.form-grid,.two-panel-grid{grid-template-columns:1fr} .field-wide{grid-column:auto} .metrics div{min-height:0} .panel{padding:18px} .nav-account{display:none} .details div{grid-template-columns:1fr;gap:2px} .plan-status{margin-top:14px} .calendar-navigation{justify-content:flex-start;margin-top:16px;flex-wrap:nowrap}.calendar-navigation .button{flex:1 1 0;min-width:0}.calendar-drawer{grid-template-columns:1fr}.drawer-backdrop{display:none}.drawer-panel{grid-column:1;padding:20px}.drawer-details div{grid-template-columns:105px 1fr;gap:10px} }
.session-span.compensation-session {
  background-image: repeating-linear-gradient(135deg, transparent 0, transparent 8px, rgba(38, 55, 68, .16) 8px, rgba(38, 55, 68, .16) 10px);
}
.field .checkbox-label { display: flex; align-items: center; gap: .5rem; }
.field .form-checkbox { width: 1rem; height: 1rem; min-height: auto; padding: 0; }