:root{
  --navy:#173b67;
  --navy-2:#0f2d50;
  --blue:#2477d4;
  --blue-soft:#edf5ff;
  --ink:#17243a;
  --muted:#6b7a90;
  --line:#e3e9f1;
  --bg:#f4f7fb;
  --card:#ffffff;
  --ok:#157347;
  --ok-bg:#eaf7ef;
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg);font-size:16px}
a{color:inherit}
.topbar{height:92px;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 1px 0 rgba(15,45,80,.02);display:flex;align-items:center;justify-content:space-between;padding:0 max(28px,calc((100vw - 1320px)/2));position:sticky;top:0;z-index:20}
.brand{display:flex;align-items:center;text-decoration:none;min-width:0}
.brand img{display:block;width:315px;max-width:42vw;height:64px;object-fit:contain;object-position:left center}
.system-title{font-size:24px;font-weight:750;letter-spacing:-.02em;color:var(--navy-2);padding-left:30px;border-left:1px solid var(--line);white-space:nowrap}
.page-shell{max-width:1320px;margin:0 auto;padding:46px 28px 70px}
.hero{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px;padding:6px 2px 0}
h1{margin:0;color:var(--navy-2);font-size:42px;line-height:1.08;letter-spacing:-.035em}
.hero p,.section-heading p{margin:10px 0 0;color:var(--muted);font-size:18px}
.dashboard-grid{display:grid;grid-template-columns:minmax(350px,.82fr) minmax(520px,1.18fr);gap:24px;align-items:start}
.action-card,.panel{background:var(--card);border:1px solid var(--line);border-radius:22px;box-shadow:0 12px 34px rgba(19,47,79,.07)}
.action-card{padding:28px}
.card-head{display:flex;align-items:center;gap:14px;margin-bottom:8px}
.card-icon{width:48px;height:48px;border-radius:14px;background:var(--blue-soft);color:var(--blue);display:grid;place-items:center;font-weight:800;font-size:25px;flex:0 0 auto}
h2{margin:0;color:var(--navy-2);font-size:23px;letter-spacing:-.02em}
.action-card>p{margin:0 0 22px;color:var(--muted);line-height:1.55}
.upload-form{display:grid;gap:15px}
.upload-form label,.station-control label{display:grid;gap:7px;color:#52657c;font-size:13px;font-weight:700}
input{width:100%;border:1px solid #cfd9e5;border-radius:11px;background:#fff;color:var(--ink);padding:12px 13px;font:inherit;outline:none;transition:.15s}
input:focus{border-color:#78aee7;box-shadow:0 0 0 3px rgba(36,119,212,.10)}
input[type=file]{padding:9px;background:#fbfcfe}
.primary-button,.secondary-button,.outline-button,.back-link,button{appearance:none;border:0;text-decoration:none;border-radius:11px;min-height:44px;padding:11px 16px;font:inherit;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:7px;cursor:pointer;transition:.15s}
.primary-button{background:var(--navy);color:#fff;box-shadow:0 6px 14px rgba(23,59,103,.16)}
.primary-button:hover{background:var(--navy-2);transform:translateY(-1px)}
.secondary-button{background:var(--blue-soft);color:#175da8}
.secondary-button:hover{background:#e1efff}
.outline-button{background:#fff;color:var(--navy-2);border:1px solid #cfd9e5}
.outline-button:hover{background:#f8fafc}
.back-link{background:#fff;border:1px solid var(--line);color:var(--navy);box-shadow:0 3px 10px rgba(19,47,79,.04)}
.document-list{display:grid;gap:12px;margin-top:18px}
.document-row{display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid var(--line);border-radius:15px;background:#fbfcfe;padding:16px 17px}
.document-meta{min-width:0}
.document-name{font-size:17px;font-weight:760;color:var(--navy-2);overflow-wrap:anywhere}
.document-sub{margin-top:4px;color:var(--muted);font-size:13px}
.document-actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.pin-form{display:flex;gap:8px;align-items:center}.pin-form input{width:115px}
.empty-state{padding:42px 18px;text-align:center;border:1px dashed #c9d5e2;border-radius:15px;color:var(--muted);background:#fafcff}
.page-toolbar{margin-bottom:22px}
.section-heading{margin-bottom:24px}.section-heading h1{font-size:38px}
.panel{padding:24px;margin-bottom:22px}
.station-control{max-width:340px;margin-bottom:22px}
.people.rows{display:grid;gap:10px}.person{text-decoration:none}
.rowperson{display:grid;grid-template-columns:42px minmax(0,1fr) 126px;gap:14px;align-items:center;border:1px solid var(--line);border-radius:14px;background:#fff;padding:10px 13px;transition:.14s}
.rowperson:hover{border-color:#b2cee9;box-shadow:0 5px 16px rgba(19,47,79,.06);transform:translateY(-1px)}
.rowperson.done{background:var(--ok-bg);border-color:#cce9d7}
.row-number{font-weight:800;color:#8393a8;text-align:center}.rowperson img{width:100%;height:70px;object-fit:contain;object-position:left center}
.status{justify-self:end;min-width:108px;padding:8px 10px;border-radius:999px;background:var(--blue-soft);color:#175da8;font-size:13px;font-weight:800;text-align:center}
.status-done{background:#dff2e7;color:var(--ok)}
.employee-preview{padding:14px 18px}.bigrow{width:100%;max-height:125px;object-fit:contain;object-position:left center}
.signature-panel{padding:28px}.signature-panel>p{color:var(--muted)}
canvas{display:block;width:100%;height:auto;aspect-ratio:1000/260;border:2px solid #b9c9da;border-radius:16px;background:#fff;touch-action:none;box-shadow:inset 0 1px 7px rgba(23,59,103,.05)}
.signature-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}
.success-panel{text-align:center;padding:48px}
.admin-summary{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center}.admin-actions{display:flex;gap:9px;flex-wrap:wrap}.admin-summary details{grid-column:1/-1;color:var(--muted)}code{word-break:break-all}
.status-row{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:10px 0;border-bottom:1px solid #edf1f5}.status-row:last-child{border-bottom:0}.status-person{display:grid;grid-template-columns:38px minmax(0,1fr);align-items:center;gap:10px;flex:1}.status-person img{width:min(620px,75vw);height:72px;object-fit:contain;object-position:left center}
.footer{max-width:1320px;margin:0 auto 24px;padding:18px 28px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:#8390a2;font-size:13px}
.footer-right{color:#9aa6b5}
@media(max-width:900px){.topbar{height:82px;padding:0 20px}.brand img{width:260px;height:54px}.system-title{font-size:20px;padding-left:20px}.page-shell{padding:34px 20px 56px}.dashboard-grid{grid-template-columns:1fr}.document-row{align-items:flex-start;flex-direction:column}.document-actions{justify-content:flex-start;width:100%}.rowperson{grid-template-columns:36px minmax(0,1fr)}.rowperson .status{grid-column:2;justify-self:start}.footer{padding-left:20px;padding-right:20px}}
@media(max-width:620px){.topbar{height:auto;min-height:116px;align-items:flex-start;flex-direction:column;justify-content:center;gap:4px;padding:10px 16px}.brand img{width:250px;max-width:88vw;height:52px}.system-title{border-left:0;padding-left:0;font-size:18px}.page-shell{padding:26px 14px 44px}.hero{margin-bottom:22px}h1{font-size:34px}.hero p,.section-heading p{font-size:16px}.action-card,.panel{padding:19px;border-radius:17px}.document-actions,.pin-form{width:100%;align-items:stretch;flex-direction:column}.pin-form input{width:100%}.signature-actions{flex-direction:column}.status-row{align-items:flex-start;flex-direction:column}.status-person img{width:100%}.footer{flex-direction:column;gap:5px}}
.login-wrap{max-width:520px;margin:70px auto}.login-card{padding:32px}.error-box{padding:12px 14px;margin:0 0 16px;border-radius:10px;background:#fff0f0;color:#a12626;border:1px solid #f1caca}.admin-top{display:flex;justify-content:flex-end;align-items:center;gap:14px;margin-bottom:18px;color:var(--muted);font-size:14px}.danger-button{background:#fff;color:#b42318;border:1px solid #efc4c0;border-radius:11px;min-height:44px;padding:11px 16px;font:inherit;font-weight:700;cursor:pointer}.danger-button:hover{background:#fff3f2}.document-actions form{margin:0}