:root{--brand:#16324f;--accent:#14b8a6;--ink:#132238;--muted:#65758b;--line:#dfe6ee;--surface:#fff;--canvas:#f4f7fb;--shadow:0 12px 34px rgba(15,36,61,.08)}*{box-sizing:border-box}body{margin:0;background:var(--canvas);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;font-size:15px}h1,h2,h3,strong{font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif}h1{font-size:clamp(1.8rem,3vw,2.5rem);letter-spacing:-.04em;margin:.2rem 0}h2{letter-spacing:-.025em;margin:.25rem 0}p{line-height:1.6}.sidebar{background:var(--brand);color:#fff;position:fixed;inset:0 auto 0 0;width:254px;padding:26px 18px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;gap:12px;align-items:center;color:white;text-decoration:none;padding:0 8px 28px}.brand img,.brand-mark{width:42px;height:42px;border-radius:12px;object-fit:contain;background:white;color:var(--brand);display:grid;place-items:center;font-weight:800}.brand strong,.brand small{display:block}.brand strong{font-size:14px}.brand small{font-size:11px;opacity:.68;margin-top:2px}.sidebar nav{display:grid;gap:5px}.sidebar nav a{color:rgba(255,255,255,.72);padding:12px 14px;border-radius:9px;text-decoration:none;font-weight:600;display:flex;justify-content:space-between}.sidebar nav a:hover,.sidebar nav a.active{background:rgba(255,255,255,.12);color:white}.sidebar nav em{font-size:9px;font-style:normal;text-transform:uppercase;letter-spacing:.08em;opacity:.6}.sidebar-user{margin-top:auto;border-top:1px solid rgba(255,255,255,.15);padding:18px 10px 0}.sidebar-user span,.sidebar-user small{display:block}.sidebar-user small{opacity:.65}.sidebar-user form{margin-top:10px}.sidebar-user button{background:none;border:0;padding:0;color:#fff;opacity:.72;cursor:pointer}.topbar{margin-left:254px;height:68px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 36px;color:var(--muted);position:sticky;top:0;z-index:10}.status-dot{display:inline-block;width:8px;height:8px;background:#22c55e;border-radius:50%;margin-right:7px}.menu-button{display:none}.messages{margin-left:254px}.page{padding:42px;max-width:none;margin:0 0 0 254px}.page.narrow{max-width:850px}.page-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:30px}.page-heading p{margin:.4rem 0;color:var(--muted)}.eyebrow{color:var(--accent)!important;font-size:11px!important;text-transform:uppercase;letter-spacing:.14em;font-weight:800;margin:0}.eyebrow.light{color:#79eadf!important}.button{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:9px;background:var(--brand);color:#fff;text-decoration:none;padding:11px 18px;font-weight:700;cursor:pointer}.button:hover{filter:brightness(1.1)}.button.secondary{background:#fff;color:var(--brand);border:1px solid var(--line)}.button-small{padding:8px 13px;font-size:13px}.button-full{width:100%;padding:13px}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:22px}.metric-grid article,.panel{background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:0 2px 4px rgba(15,35,55,.02)}.metric-grid article{padding:21px;display:flex;gap:16px;align-items:flex-start}.metric-icon{width:43px;height:43px;border-radius:11px;display:grid;place-items:center;background:#d9f7f3}.metric-icon.blue{background:#e2edff}.metric-icon.amber{background:#fff0cc}.metric-icon.purple{background:#eee7ff}.metric-grid small,.metric-grid strong,.metric-grid p{display:block}.metric-grid small{color:var(--muted)}.metric-grid strong{font-size:26px;margin:2px 0}.metric-grid p{font-size:12px;color:var(--muted);margin:0}.dashboard-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:22px}.panel{padding:24px}.panel-head{display:flex;justify-content:space-between;align-items:start;border-bottom:1px solid var(--line);padding-bottom:17px}.panel-head h2{font-size:18px}.panel-head a{color:var(--brand);font-size:13px;font-weight:700}.person-row{display:flex;align-items:center;gap:13px;padding:15px 0;border-bottom:1px solid #edf1f5}.person-row>div{flex:1}.person-row small,.table-person small{display:block;color:var(--muted);margin-top:3px}.avatar{width:38px;height:38px;border-radius:10px;background:#e7f2f2;color:var(--brand);font-weight:800;display:grid;place-items:center}.pill{padding:5px 9px;border-radius:30px;background:#edf1f5;font-size:11px;font-weight:700}.pill.active{background:#dff8ed;color:#13734f}.pill.onboarding{background:#fff3d9;color:#986500}.empty{text-align:center;padding:44px 15px}.empty>span{font-size:30px}.empty h3{margin-bottom:0}.empty p{color:var(--muted)}.timeline>div{display:flex;gap:13px;padding:12px 0}.timeline i{width:9px;height:9px;border:2px solid var(--accent);border-radius:50%;margin-top:6px}.timeline p{margin:0;font-size:13px}.timeline span{color:var(--muted)}.search-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.search-row input{max-width:370px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%}th,td{text-align:left;padding:15px;border-bottom:1px solid var(--line)}th{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.table-person{display:flex;gap:11px;align-items:center}.tags{display:flex;gap:5px;flex-wrap:wrap}.tags span{font-size:11px;padding:4px 7px;background:#edf3f7;border-radius:5px}.empty-cell{text-align:center;color:var(--muted);padding:50px}.data-form{margin-top:24px;display:grid;grid-template-columns:1fr 1fr;gap:20px}.data-form>div{display:grid;gap:6px}.data-form label{font-weight:700;font-size:13px}.data-form .helptext{font-size:11px;color:var(--muted)}input,select,textarea{font:inherit;border:1px solid #cbd5df;border-radius:8px;padding:11px;background:#fff;width:100%}input[type=checkbox]{width:auto}.form-actions,.data-form>button{grid-column:1/-1}.form-actions{display:flex;justify-content:flex-end;gap:10px;border-top:1px solid var(--line);padding-top:20px}.settings-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:24px}.settings-grid .data-form{margin:0}.brand-preview{background:var(--brand);color:#fff;border-radius:16px;padding:28px;align-self:start;position:sticky;top:92px}.preview-card{background:white;color:var(--ink);border-radius:14px;padding:28px;margin:16px 0}.preview-logo{width:54px;height:54px;border-radius:13px;background:var(--accent);color:var(--brand);font-weight:800;display:grid;place-items:center}.preview-logo img{max-width:100%;max-height:100%}.preview-card button{background:var(--accent);border:0;border-radius:7px;padding:10px 16px;font-weight:700}.messages{padding:15px 42px 0}.message,.error{background:#def8ed;color:#12674a;border-radius:8px;padding:12px}.error{background:#fee8e8;color:#a32727;margin:15px 0}.auth-main{min-height:100vh}.login-shell{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr}.login-art{background:linear-gradient(145deg,#102a43,var(--brand) 60%,#135569);color:#fff;padding:9vw;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}.login-art:after{content:'';position:absolute;width:420px;height:420px;border:1px solid rgba(255,255,255,.1);border-radius:50%;right:-150px;bottom:-150px;box-shadow:0 0 0 70px rgba(255,255,255,.03)}.hero-mark{width:58px;height:58px;background:var(--accent);color:var(--brand);border-radius:15px;display:grid;place-items:center;font:800 20px Inter,ui-sans-serif,system-ui,sans-serif;margin-bottom:44px}.login-art h1{font-size:clamp(2.3rem,4.2vw,4.2rem);line-height:1.06;color:white}.login-art>p:not(.eyebrow){max-width:560px;color:rgba(255,255,255,.7);font-size:17px}.trust-row{display:flex;gap:24px;margin-top:40px;font-size:12px;color:rgba(255,255,255,.7)}.login-panel{display:grid;place-items:center;padding:40px}.login-card{width:min(420px,100%)}.login-card h2{font-size:30px}.muted{color:var(--muted)}.stacked-form{display:grid;gap:18px;margin-top:28px}.stacked-form label{display:grid;gap:7px;font-weight:700;font-size:13px}.login-help{text-align:center;color:var(--muted);font-size:12px;margin-top:25px}
@media(max-width:1050px){.metric-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid,.settings-grid{grid-template-columns:1fr}.brand-preview{position:static}.login-art{padding:7vw}.trust-row{flex-direction:column;gap:7px}}
@media(max-width:760px){.sidebar{transform:translateX(-100%);transition:.2s}.menu-open .sidebar{transform:none}.topbar,.page,.messages{margin-left:0}.topbar{padding:0 18px}.menu-button{display:block;background:none;border:0;font-size:20px}.page{padding:26px 18px}.page-heading{align-items:flex-start;gap:18px;flex-direction:column}.metric-grid{grid-template-columns:1fr}.dashboard-grid{grid-template-columns:1fr}.data-form{grid-template-columns:1fr}.login-shell{grid-template-columns:1fr}.login-art{min-height:42vh;padding:45px 28px}.login-art h1{font-size:2.5rem}.hero-mark{margin-bottom:25px}.login-panel{padding:42px 24px}.trust-row{display:none}}
.actions,.clock-actions{display:flex;gap:10px;flex-wrap:wrap}.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}.site-list{margin-top:18px;border-top:1px solid var(--line)}.site-list>div{padding:13px 0;border-bottom:1px solid var(--line)}.site-list small,table td small{display:block;color:var(--muted);margin-top:3px}.clock-card{text-align:center;margin-bottom:22px}.clock-card label{display:grid;gap:7px;text-align:left;max-width:520px;margin:20px auto}.clock-now{font:800 clamp(2rem,8vw,4rem) Inter,ui-sans-serif,system-ui;letter-spacing:-.05em}.clock-actions{justify-content:center;margin:22px 0}.pill.expired,.pill.revoked,.pill.suspended,.pill.rejected{background:#fee2e2;color:#991b1b}.pill.pending,.pill.unverified{background:#fff3d9;color:#986500}.pill.published,.pill.accepted{background:#dff8ed;color:#13734f}
.skip-link{position:fixed;left:12px;top:12px;z-index:1000;transform:translateY(-200%);background:#fff;color:#111;padding:10px 14px;border:2px solid var(--brand);border-radius:6px}.skip-link:focus{transform:none}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.invitation-link{margin-bottom:24px}.invitation-link label{display:block;font-weight:700;margin:12px 0 6px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.sidebar-user>a{display:block;color:#fff;text-decoration:none;margin-bottom:8px;opacity:.82}.sidebar-user>a:hover,.sidebar-user>a:focus-visible{opacity:1;text-decoration:underline}
.nav-section{margin:16px 14px 4px;font-size:9px;text-transform:uppercase;letter-spacing:.12em;font-weight:800;color:rgba(255,255,255,.5)}
.tabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin-bottom:22px}
.tabs a{padding:11px 15px;text-decoration:none;color:var(--muted);font-weight:700;font-size:13px;border-bottom:2px solid transparent;display:flex;gap:7px;align-items:center}
.tabs a:hover{color:var(--brand)}
.tabs a.active{color:var(--brand);border-bottom-color:var(--accent)}
.tabs em{font-style:normal;font-size:10px;background:#edf3f7;border-radius:20px;padding:2px 7px;color:var(--brand)}
.table-panel{margin-bottom:22px}
.people-list{margin-top:8px}
.profile-list{display:grid;grid-template-columns:1fr 1fr;gap:0 22px;margin:0}
.profile-list dt{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:800;margin-top:14px}
.profile-list dd{margin:3px 0 0;font-weight:600}
.setting-card{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px}
.setting-card h3{margin:0 0 6px;font-size:15px}
.setting-card a{color:var(--brand);text-decoration:none}
.setting-card p{margin:0;font-size:13px}
.inline-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.inline-form input,.inline-form select{width:auto;min-width:140px}
.pill.missing{background:#fee2e2;color:#991b1b}
.pill.clean,.pill.on-time{background:#dff8ed;color:#13734f}
.pill.inactive,.pill.cancelled{background:#edf1f5;color:#5b6b7f}
.pill.draft,.pill.not-sourced{background:#fff3d9;color:#986500}
.pill.restricted{background:#fff3d9;color:#986500}
.pill.sealed{background:#fee2e2;color:#991b1b}
.pill.not-evaluated{background:#edf1f5;color:#5b6b7f}
.breakdown,.history{margin-top:18px;border-top:1px solid var(--line);padding-top:16px}
.breakdown h3,.history h3{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0 0 10px}
table.compact th,table.compact td{padding:9px 12px;font-size:13px}
table.compact th{font-size:10px}
.history .panel-head{border:0;padding:0;margin-bottom:10px;align-items:baseline}
.history .panel-head h3{margin:0}
.history .panel-head a{font-size:12px;font-weight:700;color:var(--brand);text-decoration:none}
.page-heading form{display:inline}
.scope-note{border-left:3px solid var(--accent);background:#eef4fb;color:var(--ink);border-radius:8px;padding:11px 14px;margin:0 0 18px;font-size:13px}
.scope-pill{display:inline-block;width:auto;background:#eef4fb;color:var(--muted);border-radius:20px;padding:4px 9px;font-size:10px;letter-spacing:.02em;margin-top:7px;line-height:1.4}
.sidebar-user .scope-pill{background:rgba(255,255,255,.14);color:#fff;opacity:.86}
.authority-list dt{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.authority-list dd{margin:2px 0 14px}
.decide-form{display:grid;gap:8px;min-width:230px}
.message.warning{background:#fff3d9;color:#986500}
.pill.declined{background:#fee2e2;color:#991b1b}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.bar{height:10px;background:#e9eef5;border-radius:6px;overflow:hidden;margin:14px 0}
.bar span{display:block;height:100%;background:var(--accent)}
.figure{font-size:34px;letter-spacing:-.04em;white-space:nowrap}
.tags span.warn{background:#fee2e2;color:#991b1b;font-weight:700}
.pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.pagination-total{margin:14px 0 0;font-size:12px}
@media(max-width:760px){.profile-list{grid-template-columns:1fr}.tabs a{padding:9px 11px;font-size:12px}}
/* Only the combined menu grows and scrolls; small utilities must not divide its height. */
.sidebar .sidebar-navigation{flex:1;min-height:0;overflow-y:auto;display:block;padding-bottom:10px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.28) transparent}
.sidebar nav::-webkit-scrollbar{width:6px}
.sidebar nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.25);border-radius:8px}
.allauth-page.page .stacked-form{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:26px;max-width:600px}
.allauth-page .form-actions{margin-top:8px}
.allauth-messages{margin-bottom:18px}
.allauth-messages .message{margin-bottom:8px}
.allauth-page.entrance{width:min(440px,100% - 40px);margin:96px auto 48px;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:34px;position:relative}
.allauth-page.entrance::before{content:'TS';position:absolute;top:-76px;left:0;width:52px;height:52px;background:var(--accent);color:var(--brand);border-radius:14px;display:grid;place-items:center;font:800 17px Inter,ui-sans-serif,system-ui,sans-serif}
.allauth-page.entrance h1{font-size:24px}
.allauth-page.entrance p{color:var(--muted)}
.stacked-form .field{display:grid;gap:7px}
.stacked-form .helptext{font-size:11px;color:var(--muted)}
.stacked-form .error{margin:0}
.check-field{display:flex;gap:9px;align-items:center;font-weight:600;font-size:13px}
.button.danger{background:#fee8e8;color:#a32727}
.button-link{background:none;color:var(--muted);text-decoration:underline}
.button-link:hover{filter:none;color:var(--brand)}
.allauth-page .panel{margin-top:18px}
.allauth-panel .panel-body{padding-top:16px}
.allauth-panel .panel-body p{margin:6px 0;color:var(--muted)}
.allauth-panel .panel-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.qr-img{width:190px;height:190px;display:block;border:1px solid var(--line);border-radius:10px;background:#fff;padding:8px;margin:4px 0}
hr{border:0;border-top:1px solid var(--line);margin:24px 0}
/* In-page record viewer. The overlay is the whole viewport so a click outside the frame closes it,
   and [hidden] has to be restated because the open state is a display:grid — a modal that cannot be
   hidden is one a worker cannot dismiss. */
.preview-modal{position:fixed;inset:0;z-index:900;background:rgba(19,34,56,.62);display:grid;place-items:center;padding:20px}
.preview-modal[hidden]{display:none}
.preview-frame{background:var(--surface);border-radius:14px;width:min(1040px,100%);height:min(88vh,900px);display:flex;flex-direction:column;overflow:hidden;box-shadow:var(--shadow)}
.preview-head{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line)}
.preview-head strong{font-size:15px}
.preview-head .muted{font-size:12px;margin-right:auto}
.preview-body{flex:1;background:#eef2f7;position:relative;overflow:hidden}
.preview-pages{height:100%;overflow:auto;padding:18px;display:flex;flex-direction:column;align-items:center;gap:14px}
.preview-pages[hidden],.preview-body img[hidden],.preview-body pre[hidden]{display:none}
.preview-page{flex:none;width:100%;max-width:900px;background:#fff;box-shadow:0 1px 4px rgba(19,34,56,.18)}
.preview-page canvas{display:block;width:100%;height:100%}
.preview-status{position:absolute;inset:0;margin:0;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center;color:var(--muted);font-size:14px;pointer-events:none}
.preview-status[hidden]{display:none}
.preview-body img{max-width:100%;max-height:100%;display:block;margin:auto;padding:18px;object-fit:contain}
.preview-body pre{margin:0;height:100%;overflow:auto;padding:20px;font-size:13px;white-space:pre-wrap;word-break:break-word;text-align:left}
.preview-frame>p{margin:0;padding:10px 18px;border-top:1px solid var(--line);font-size:11px}
@media(max-width:760px){.preview-modal{padding:0}.preview-frame{width:100%;height:100vh;border-radius:0}.preview-pages{padding:8px;gap:8px}}
/* CLK-2. The station screen. Large touch targets, nothing that persists, and no dependence on the
   sidebar the anonymous page never gets. `[hidden]` is restated because the pad is a grid — a display
   rule beats the browser's default and would otherwise leave both halves on screen at once. */
.kiosk{width:min(560px,100%);margin:6vh auto;padding:26px;background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:14px}
.kiosk-brand{margin:0;color:var(--accent);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.14em}
.kiosk-station{margin:0;font-size:clamp(1.6rem,5vw,2.2rem);letter-spacing:-.04em}
.kiosk-where{margin:0;color:var(--muted)}
.kiosk-pad,.kiosk-person{display:flex;flex-direction:column;gap:14px}
.kiosk-pad[hidden],.kiosk-person[hidden]{display:none}
.kiosk-pin{margin:0;text-align:center;font-weight:800;font-size:clamp(1.4rem,5vw,2rem);letter-spacing:.3em;min-height:2.2rem;color:var(--brand)}
.kiosk-keys{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.kiosk-key{font:inherit;font-size:1.4rem;font-weight:700;padding:18px 0;border-radius:12px;border:1px solid var(--line);background:var(--canvas);color:var(--ink);cursor:pointer}
.kiosk-key.secondary{font-size:1rem;color:var(--muted)}
.kiosk-go{padding:15px;font-size:1.05rem}
.kiosk-hint{margin:0;font-size:12px;color:var(--muted);line-height:1.5}
.kiosk-hello{margin:0;font-size:1.3rem}
.kiosk-status{margin:0;min-height:2.4rem;padding:10px 14px;border-radius:10px;background:var(--canvas);color:var(--brand);font-weight:600}
.kiosk-posts{display:flex;flex-direction:column;gap:8px}
.kiosk-post{display:flex;flex-direction:column;gap:3px;text-align:left;font:inherit;padding:13px 15px;border-radius:12px;border:1px solid var(--line);background:#fff;cursor:pointer}
.kiosk-post small{color:var(--muted);font-size:12px}
.kiosk-post.selected{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.kiosk-actions{display:flex;gap:10px;flex-wrap:wrap}
.kiosk-finish{background:none;border:0;color:var(--muted);text-decoration:underline;padding:0;cursor:pointer;font:inherit}
.field-error{display:block;color:#a32727;font-size:11px;margin-top:4px}
/* NTF-4. The consent tick is the one checkbox on its page that must not read like a preference: the
   sentence beside it is what the person is agreeing to, so it sits at label size and wraps. */
.consent-prompt{margin-bottom:22px}
.consent-line{display:flex;gap:10px;align-items:flex-start;font-weight:600;font-size:14px;line-height:1.5}
.consent-line input{margin-top:4px;width:auto;flex:none}
.pill.blocked{background:#fee8e8;color:#a32727}
.pill.granted{background:#dff8ed;color:#13734f}
.pill.revoked{background:#edf1f5;color:#65758b}
/* CLK-1. The capture panel is deliberately not a modal: an officer holding a phone at arm's length in
   a doorway should see the frame they are about to send on the same page they clock from, with nothing
   to dismiss. Mirrored to match what the front camera shows them, so the thumbnail is not a surprise
   flip of the face they just framed. */
.selfie-capture{margin-top:14px;padding:14px;border:1px dashed #c3ccd8;border-radius:10px;background:#f7f9fc}
.selfie-capture video,.selfie-capture img{display:block;width:100%;max-width:280px;aspect-ratio:4/3;object-fit:cover;border-radius:8px;background:#0b1220;margin-bottom:10px;transform:scaleX(-1)}
.selfie-capture img{transform:none;background:#eef1f6}
.selfie-capture .clock-actions{flex-wrap:wrap}
.selfie-capture[hidden]{display:none}

/* Workspace navigation and layout */
.page.narrow{max-width:1234px}
.data-form{align-items:start}
.data-form>.form-sections,.data-form>.form-error-summary,.data-form>h2,.data-form>h3,.data-form>p,.data-form>.field-row{grid-column:1/-1}
.form-sections{display:grid;gap:24px;min-width:0}
.data-form>.form-sections{gap:24px}
.data-form>.form-actions{display:flex;gap:10px;flex-wrap:wrap}
.form-section{border:0;padding:0;margin:0;min-width:0}
.form-section>legend{font-size:16px;font-weight:700;width:100%;padding:0 0 12px;border-bottom:1px solid var(--line);margin-bottom:16px}
.form-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 22px}
.form-field{display:flex;flex-direction:column;gap:7px;min-width:0}
.form-field-wide{grid-column:1/-1}
.form-field label,.form-field legend{font-size:13px;font-weight:700}
.form-field fieldset{margin:0;padding:0;border:0;min-width:0}
.form-field legend{padding:0;margin-bottom:10px}
.form-field fieldset>div{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:8px}
.form-field fieldset label{display:flex;align-items:flex-start;gap:8px;min-height:36px;padding:6px 8px;border:1px solid var(--line);border-radius:7px;font-weight:500}
.form-field input[type=checkbox]{flex-shrink:0;margin-top:2px}
.form-field .check-field{min-height:40px;align-items:center}
.form-field .check-field input[type=checkbox]{margin:0}
.form-field .check-field label{font-weight:600}
.form-field .helptext{font-size:12px;line-height:1.5;color:var(--muted)}
.form-field input,.form-field select,.form-field textarea{max-width:100%;min-width:0}
.form-field textarea{min-height:100px;resize:vertical}
.form-field input[type=color]{height:44px;padding:5px}
.form-field-invalid input,.form-field-invalid select,.form-field-invalid textarea{border-color:#a32727}
.errorlist{margin:0;padding-left:18px;color:#a32727;font-size:12px;line-height:1.5}
.form-error-summary{padding:14px 18px;border:1px solid #f4b4b4;border-radius:9px;background:#fff1f1;color:#a32727}
.form-error-summary ul{margin:8px 0 0;padding-left:18px}
.form-error-summary a{color:inherit}
.data-form>.field-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:18px}
.data-form>label,.field-row>label{display:flex;flex-direction:column;gap:7px;min-width:0}
.data-form>label.check,.field-row>label.check{flex-direction:row;align-items:center}
.data-form>.field-row~label{grid-column:1/-1}
.stacked-form .form-fields{grid-template-columns:1fr}
.inline-form input:not([type=hidden]),.inline-form select{width:auto;max-width:100%;flex:1 1 180px;min-width:0}
.inline-form label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600}
.search-row{gap:12px;flex-wrap:wrap}
.search-row input{flex:1 1 220px;min-width:0}
.table-wrap td{vertical-align:top}
.dashboard-grid>*{min-width:0}
.panel+.panel,.panel+.dashboard-grid,.dashboard-grid+.panel{margin-top:22px}
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible,.button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.sidebar{padding:18px 14px}
.sidebar-dismiss{display:none}
.brand{flex-shrink:0;padding-bottom:18px}
.sidebar .nav-section{display:grid;gap:3px;margin-bottom:12px}
.nav-heading{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.6);margin:8px 12px}
.sidebar nav a{min-height:40px;padding:10px 12px;font-size:13px;justify-content:flex-start;text-align:left}
.workspace-link{border-radius:8px;transition:background .2s ease}
.workspace-link:hover{background:rgba(255,255,255,.08);color:white}
.sidebar nav a.active{background:rgba(255,255,255,.18);color:#fff;box-shadow:inset 3px 0 0 var(--accent)}
.sidebar nav a:focus-visible,.settings-group summary:focus-visible{outline:2px solid #fff;outline-offset:-2px}
.sidebar .quick-link{background:rgba(255,255,255,.06)}
.sidebar-user{flex-shrink:0;margin-top:0;padding:12px 10px 0;font-size:12px}
.sidebar-user>span{overflow-wrap:anywhere;margin-top:10px}
.sidebar-utilities{display:flex;flex-wrap:wrap;gap:8px 12px}
.sidebar-utilities a{color:#fff;text-decoration:none}
.sidebar-utilities a:hover,.sidebar-utilities a:focus-visible{text-decoration:underline}
.search-row select{width:auto}

.settings-group{color:rgba(255,255,255,.72);width:100%;border-top:1px solid rgba(255,255,255,.12);padding-top:6px}
.settings-group summary{padding:10px 12px;border-radius:8px;font-weight:600;font-size:13px;cursor:pointer}
.settings-group summary:hover{background:rgba(255,255,255,.08);color:white}
.settings-group[open] summary{background:rgba(255,255,255,.08);color:white}
.settings-list{display:grid;gap:3px;padding:6px 0 6px 10px}
.settings-list a{padding:9px 12px;border-radius:6px;color:rgba(255,255,255,.64);text-decoration:none;font-size:12px;display:block;transition:all .15s ease}
.settings-list a:hover{background:rgba(255,255,255,.1);color:white}
.settings-list a.active{background:rgba(255,255,255,.15);color:white;font-weight:600}

/* Workspace grid for card-based layouts */
.workspace-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));grid-auto-rows:1fr;gap:18px;margin:24px 0}
.card{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:24px;display:flex;flex-direction:column;gap:14px;box-shadow:0 2px 4px rgba(15,35,55,.02)}
.card>p{margin:0}
.card-actions{display:grid;gap:10px;margin-top:auto;padding-top:8px}
.card-actions>form{display:grid;margin:0}
.card-actions .button{display:flex;align-items:center;justify-content:center;min-height:44px;text-align:center;white-space:normal}
.card-actions>a:not(.button){font-size:13px;line-height:1.5}
.card h2{font-size:16px;margin:0;font-weight:700}
.card .metric{font-size:32px;font-weight:700;color:var(--brand);margin:8px 0 0}
.card .muted{color:var(--muted);font-size:13px}
.card.card-primary{background:var(--brand);color:white;border-color:var(--brand)}
.card.card-primary h2{color:white}
.card.card-primary .metric{color:white}
.card.card-primary .muted{color:rgba(255,255,255,.7)}
.card.card-primary .button{background:white;color:var(--brand)}
.card.card-primary .button:hover{filter:brightness(.95)}
.card.card-primary a:not(.button){color:white}
.card.card-primary small{color:rgba(255,255,255,.85)}
.card.card-attention{border-color:#fbbf24;background:#fffbf0}
.card.card-attention h2{color:#b45309}

.posts-list,.punches-list,.person-list,.rules-list{list-style:none;padding:0;margin:12px 0;display:grid;gap:8px}
.posts-list li,.punches-list li,.person-list li,.rules-list li{padding:10px 0;border-bottom:1px solid var(--line)}
.posts-list li:last-child,.punches-list li:last-child,.person-list li:last-child,.rules-list li:last-child{border:0}
.person-list li{padding:12px 0}
.person-list a{text-decoration:none;font-weight:600;color:var(--ink)}
.person-list a:hover{color:var(--accent)}
.person-list small{display:block;color:var(--muted);font-size:12px;margin-top:3px}

.clock-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.next-shift{background:#f0fdf4;color:var(--ink);border:1px solid #dbeafe;border-radius:10px;padding:16px;margin:16px 0}
.next-shift strong{display:block;color:var(--brand);font-size:12px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}
.next-shift p{margin:6px 0;font-weight:600}
.next-shift small{display:block;color:var(--muted);font-size:12px}

/* Responsive workspace layout */
@media(max-width:760px){
  .form-fields{grid-template-columns:1fr}
  .sidebar{width:min(290px,85vw)}
  .sidebar-dismiss{display:block;align-self:flex-end;flex-shrink:0;min-height:40px;margin-bottom:8px;padding:8px 12px;background:transparent;border:1px solid rgba(255,255,255,.4);border-radius:8px;color:#fff;cursor:pointer}
  .workspace-grid{grid-template-columns:1fr;grid-auto-rows:auto;gap:14px}
  .card{padding:16px}
}

/* Schedule: toolbar, week grid (officers down, days across), and the row cancel disclosure. */
.schedule-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:0 0 16px}
.schedule-range{font-size:15px;margin-right:auto}
.schedule-queue-link{font-size:13px;font-weight:600}
.segmented{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
.segmented a{padding:7px 12px;font-size:13px;font-weight:600;color:var(--brand);text-decoration:none;border-right:1px solid var(--line);white-space:nowrap}
.segmented a:last-child{border-right:0}
.segmented a:hover,.segmented a:focus-visible{background:#eef4fa}
.segmented a[aria-current]{background:var(--brand);color:#fff}
.schedule-grid-panel{padding:0;overflow:hidden}
.schedule-grid-wrap{overflow:auto;max-height:calc(100vh - 220px)}
.schedule-grid{border-collapse:separate;border-spacing:0;width:100%;min-width:1080px;table-layout:fixed}
.schedule-grid th,.schedule-grid td{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:6px;vertical-align:top;text-align:left;background:#fff}
.schedule-grid thead th{position:sticky;top:0;z-index:2;background:#f8fafc;font-weight:600}
.schedule-grid thead th span{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.schedule-grid thead th strong{display:block;font-size:15px}
.schedule-grid thead th small,.schedule-grid tbody th small{display:block;font-size:11px;font-weight:500;color:var(--muted);margin-top:2px}
.schedule-grid thead th.is-today{background:#e6f7f5;box-shadow:inset 0 -3px 0 var(--accent)}
.schedule-grid tbody th{position:sticky;left:0;z-index:1;width:190px;font-size:14px}
.schedule-grid .grid-corner{left:0;z-index:3;width:190px;vertical-align:bottom}
.schedule-grid col,.schedule-grid thead th:first-child{width:190px}
.schedule-grid tbody th a{color:var(--ink);text-decoration:none;font-weight:600}
.schedule-grid tbody th a:hover{text-decoration:underline}
.schedule-grid td{height:64px}
.schedule-grid td:hover .grid-add,.schedule-grid td:focus-within .grid-add{opacity:1}
.grid-open-row th,.grid-open-row td{background:#fffaf0}
.grid-open-row th{box-shadow:inset 3px 0 0 #e0a100}
.schedule-grid td.on-leave{background:repeating-linear-gradient(135deg,#fff,#fff 6px,#fdf1f1 6px,#fdf1f1 12px)}
.grid-leave{display:block;font-size:11px;font-weight:700;color:#a32727;margin-bottom:4px}
.grid-shift{display:block;padding:5px 7px;margin-bottom:4px;border-radius:7px;border:1px solid #9fd8d0;border-left:4px solid var(--accent);background:#effaf8;color:var(--ink);text-decoration:none;font-size:12px;line-height:1.3;overflow:hidden}
.grid-shift strong{display:block;font-size:12px;white-space:nowrap}
.grid-shift span,.grid-shift small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.grid-shift small{color:var(--muted);font-size:11px}
.grid-shift:hover,.grid-shift:focus-visible{filter:brightness(.96);box-shadow:0 2px 6px rgba(15,36,61,.12)}
.grid-shift.draft{background:#fffaf0;border:1px dashed #d9a400;border-left:4px dashed #d9a400}
.grid-shift.completed{background:#f1f4f8;border-color:var(--line);border-left-color:#8a9bb0}
.grid-shift.conflict{background:#fee8e8;border-color:#f0b4b4;border-left-color:#c53030}
.grid-open-row .grid-shift.published{background:#fff3d9;border-color:#f1d08a;border-left-color:#e0a100}
.grid-add{display:block;text-align:center;border:1px dashed var(--line);border-radius:7px;color:var(--muted);text-decoration:none;font-weight:700;line-height:22px;opacity:0;transition:opacity .12s}
.grid-add:focus-visible{opacity:1}
.grid-legend{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;padding:10px 14px;font-size:12px}
.grid-legend .grid-shift{display:inline-block;margin:0;padding:2px 8px}
.row-actions{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.row-menu{position:relative}
.row-menu>summary{list-style:none;cursor:pointer}
.row-menu>summary::-webkit-details-marker{display:none}
.row-menu[open]>summary{background:#eef4fa}
.row-menu-panel{position:absolute;right:0;top:calc(100% + 6px);z-index:5;width:260px;display:grid;gap:8px;padding:12px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow)}
.row-menu-panel label{display:grid;gap:4px;font-size:12px;font-weight:600}
.row-menu-panel input{width:100%}
@media (hover:none){.grid-add{opacity:1}}
@media (max-width:760px){.schedule-range{margin-right:0;width:100%}.schedule-grid tbody th,.schedule-grid .grid-corner{width:140px}}
.sidebar-user>a.sidebar-account{margin-top:10px;margin-bottom:2px;font-weight:600;overflow-wrap:anywhere}
.schedule-grid th{text-transform:none;letter-spacing:normal;color:var(--ink)}.schedule-grid thead th span{text-transform:uppercase}
.row-menu[open]{flex-basis:100%}.row-menu-panel{position:static;width:auto;max-width:280px;margin-top:6px;box-shadow:none}

/* Employee "My week" strip on My shifts */
.my-week-panel .schedule-toolbar h2{margin:0 6px 0 0}
.my-week-hours{font-size:13px;font-weight:600;color:var(--muted)}
.my-week-hours.over{color:#a32727}
.my-week{list-style:none;margin:0 0 12px;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border:1px solid var(--line);border-radius:10px;overflow:hidden}
.my-week-day{min-height:150px;padding:8px;border-right:1px solid var(--line);background:#fff;display:flex;flex-direction:column;gap:2px;min-width:0}
.my-week-day:last-child{border-right:0}
.my-week-day header{margin-bottom:6px}
.my-week-day header span{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.my-week-day header strong{font-size:15px}
.my-week-day header em{margin-left:6px;font-style:normal;font-size:11px;font-weight:700;color:var(--accent)}
.my-week-day.is-today{background:#f3fbfa;box-shadow:inset 0 3px 0 var(--accent)}
.my-week-day.is-past{background:#fafbfc}
.my-week-day.is-past .grid-shift{opacity:.75}
.my-week-day.on-leave{background:repeating-linear-gradient(135deg,#fff,#fff 8px,#fbeeee 8px,#fbeeee 16px)}
.my-week-off{margin:0;font-size:12px;color:var(--muted)}
.my-week-avail{display:block;margin-top:auto;padding-top:6px;font-size:11px;color:var(--muted)}
.my-week-open{display:block;margin-top:4px;padding:4px 6px;border-radius:6px;background:#fff3d9;border:1px solid #f1d08a;color:var(--ink);font-size:11px;font-weight:600;text-decoration:none}
.my-week-open:hover,.my-week-open:focus-visible{filter:brightness(.96)}
@media (max-width:900px){.my-week{grid-template-columns:1fr}.my-week-day{min-height:0;border-right:0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:72px 1fr;column-gap:10px}.my-week-day:last-child{border-bottom:0}.my-week-day header{grid-row:span 6;margin:0}.my-week-day>*:not(header){grid-column:2}.my-week-avail{margin-top:2px;padding-top:0}}
@media (max-width:900px){.my-week-day header em{display:block;margin:2px 0 0}.my-week-day header strong{white-space:nowrap}}

/* My shifts "Coming up" cards: one post per card so the move action never hides behind a scroll */
.shift-cards{list-style:none;margin:0;padding:0}
.shift-card{display:grid;grid-template-columns:170px minmax(0,1fr) auto auto;gap:6px 18px;align-items:center;padding:14px 0;border-top:1px solid var(--line);scroll-margin-top:80px}
.shift-card:first-child{border-top:0}
.shift-card:target{background:#f3fbfa;box-shadow:-12px 0 0 #f3fbfa,12px 0 0 #f3fbfa}
.shift-card-when strong,.shift-card-where strong{display:block}
.shift-card-when span,.shift-card-where span:not(.pill){display:block;font-size:13px;color:var(--muted)}
.shift-card-where .pill{margin-top:4px}
.shift-card-state{font-size:13px;text-align:right}
.shift-card-brief{grid-column:1/-1;font-size:14px}
.shift-card-brief summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--brand)}
.shift-card-brief[open]{padding:4px 0 2px}
.shift-card-empty{padding:14px 0}
@media (max-width:760px){.shift-card{grid-template-columns:1fr;gap:6px}.shift-card-state{text-align:left}.shift-card-action .button{display:block;text-align:center}}
.my-week-panel{scroll-margin-top:84px}

/* About page and product attribution */
.sidebar-version{display:block;margin-top:12px;color:#fff;opacity:.55;font-size:11px;text-decoration:none}
.sidebar-version:hover,.sidebar-version:focus-visible{opacity:.9;text-decoration:underline}
.login-copyright{text-align:center;color:var(--muted);font-size:11px;margin-top:8px}
.login-copyright a{color:inherit}
.about-product address{font-style:normal;line-height:1.6;margin:8px 0 12px}
.about-copyright{font-weight:700;margin:0 0 8px}
.about-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin:16px 0 0}
.about-facts div{border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.about-facts dt{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.about-facts dd{margin:4px 0 0;font-weight:700}
.about-list{list-style:none;margin:12px 0 0;padding:0}
.about-item{border-top:1px solid var(--line)}
.about-item:first-child{border-top:0}
.about-item summary{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:10px 0;cursor:pointer}
.about-name{font-weight:700}
.about-version{color:var(--muted);font-variant-numeric:tabular-nums;margin-right:auto}
.about-file{font-size:12px;margin:12px 0 6px;color:var(--muted);font-family:ui-monospace,Consolas,monospace;font-weight:600}
.about-license{white-space:pre-wrap;word-break:break-word;max-height:320px;overflow:auto;background:#f6f8fb;border:1px solid var(--line);border-radius:8px;padding:12px;font-size:11.5px;line-height:1.45}
.about-footer{text-align:center;font-size:12px;margin:8px 0 24px}
.sms-summary p{margin:0 0 8px}
.sms-table td{vertical-align:top}.sms-table td small{display:block;color:#65758b;margin-top:3px}
.sms-table .pill{margin-top:6px}
.sms-sample{max-width:460px;white-space:pre-wrap;font-size:.92rem;color:#334155}
.sms-editor{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:20px;align-items:start}
.sms-editor textarea{font:inherit;min-height:120px;resize:vertical}
.sms-editor .data-form{display:flex;flex-direction:column;align-items:stretch;gap:14px}.sms-editor .data-form>.sms-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:flex-start;width:auto}
.sms-chip{border:1px solid #cbd5e1;background:#f8fafc;color:#1e3a5f;border-radius:999px;padding:3px 10px;font:600 .82rem ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;cursor:pointer}
.sms-chip:hover,.sms-chip:focus-visible{background:#e8f0fb;border-color:#93b4dd}
.sms-reset{margin-top:14px}
.sms-bubble{background:#e9e9eb;color:#111;border-radius:18px 18px 18px 4px;padding:12px 16px;max-width:340px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.4}
.sms-meter{margin:12px 0}.sms-meter.over{color:#986500}
.sms-placeholders{display:grid;grid-template-columns:max-content 1fr;gap:6px 14px;margin:0}.sms-placeholders dd{margin:0;color:#475569}