:root{--bg:#f8fafc;--panel:#fff;--line:#cbd5e1;--text:#0f172a;--muted:#475569;--accent:#1d4ed8;--in:#166534;--out:#854d0e;--deny:#b91c1c;--font:Attendance,system-ui,sans-serif;--mono:Attendance,system-ui,sans-serif}*{box-sizing:border-box;margin:0;padding:0}[hidden]{display:none!important}html,body{height:100%}body{font:18px/1.4 var(--font);color:var(--text);background:var(--bg);overflow:hidden}button,input,select{font:inherit;touch-action:manipulation}button{cursor:pointer;border-radius:8px;border:1px solid var(--line);min-height:60px;background:white;color:var(--text);padding:10px 20px}button:disabled{background:#e2e8f0;color:#475569;cursor:wait}button:active{background:#eff6ff}:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.screen{position:fixed;inset:0;display:flex;flex-direction:column}.topbar{display:flex;justify-content:space-between;align-items:center;padding:14px 28px;border-bottom:1px solid var(--line);background:white;height:80px}.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:16px;letter-spacing:.07em}.brand .dot{width:12px;height:12px;background:var(--accent);border-radius:3px}.clock-wrap{display:flex;align-items:center;gap:24px}.net{font-size:14px;color:var(--in);max-width:300px}.net.off{color:var(--out)}.clock{font-size:28px;font-weight:700;font-variant-numeric:tabular-nums;text-align:right}.clock .date{font-size:14px;font-weight:400;color:var(--muted)}.stage{flex:1;display:flex;align-items:center;justify-content:center;position:relative;min-height:0;padding-bottom:64px}.panes{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.pane{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.pane-title{font-size:14px;color:var(--muted);margin-bottom:10px}.scanner-slot{width:128px;height:128px;display:grid;place-items:center;margin-bottom:16px}.scanner{width:120px;height:120px;position:relative;display:grid;place-items:center;background:#eff6ff;border-radius:32px;border:1px solid #bfdbfe}.ring,.scanline{display:none}.print{width:82px;height:82px;color:var(--accent)}.print svg,.mini-print svg{width:100%;height:100%}.scan-label{font-size:42px;line-height:1.2;font-weight:700;letter-spacing:-.025em}.scan-sub{font-size:24px;color:var(--muted);margin-top:10px}.scan-active .scanner{border:3px solid var(--accent)}.scan-active .scan-label{color:var(--accent)}.pinbtn{font-size:22px;font-weight:600;margin-top:24px;min-height:72px;padding:12px 36px;background:var(--accent);color:white;border-color:var(--accent)}.pinbtn-note{font-size:14px;color:var(--muted);margin-top:8px}.enrollbtn{position:fixed;right:24px;bottom:16px;min-height:52px;font-size:16px;color:var(--muted);background:white;z-index:5}.result{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:var(--bg);z-index:6;padding:28px}.result.show{display:flex}.card{width:min(94%,820px);padding:32px;border:1px solid var(--line);border-radius:12px;background:white;text-align:center}.card .name{font-size:48px;line-height:1.2;font-weight:700;overflow-wrap:anywhere}.card .meta{font-size:20px;color:var(--muted);margin-top:12px}.badge{margin-top:24px;display:inline-block;padding:16px 20px;border-radius:8px;font-size:36px;font-weight:700}.badge.in{background:#f0fdf4;color:var(--in)}.badge.out{background:#fefce8;color:var(--out)}.badge.saved{background:#eff6ff;color:var(--accent);font-size:28px}.offnote{font-size:18px;color:var(--out);margin-top:16px}.msg{text-align:center;max-width:850px}.msg .headline{font-size:40px;line-height:1.2;font-weight:700}.msg .sub{font-size:24px;color:var(--muted);margin-top:16px}.msg.deny .headline{color:var(--deny)}.msg.ok .headline{color:var(--in)}#result-dismiss{margin-top:24px}.overlay{position:fixed;inset:0;display:none;place-items:center;padding:16px;background:#0f172a80;z-index:20}.overlay.show{display:grid}.sheet{width:min(100%,920px);max-height:calc(100vh - 32px);overflow:auto;background:white;border:1px solid var(--line);border-radius:12px;padding:22px 24px}.sheet h2{font-size:28px;line-height:1.2;margin:4px 0 10px}.enroll-top{display:flex;gap:16px;align-items:center;margin-bottom:16px}.mini-scanner{width:72px;height:72px;flex-shrink:0;display:grid;place-items:center;border-radius:20px;background:#eff6ff}.mini-print{width:50px;height:50px;color:var(--accent)}.enroll-kicker{font-size:14px;font-weight:600;color:var(--muted)}.enroll-copy{font-size:16px;color:var(--muted);line-height:1.45}.enroll-auth{font-size:14px;color:var(--accent);margin-top:8px}.e-status{padding:12px 16px;border:1px solid var(--line);border-radius:8px;background:#f8fafc;color:var(--muted);font-size:16px;margin:14px 0}.e-status strong{display:block;font-size:20px;color:var(--text);margin-bottom:3px}.e-status.scan{background:#eff6ff;color:#1e40af;border-color:#93b4ef}.e-status.ok{background:#f0fdf4;color:var(--in);border-color:#86c99b}.e-status.deny{background:#fef2f2;color:var(--deny);border-color:#eaa1a1}.e-status.deny strong{color:var(--deny)}.enroll-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.enroll-form label,.employee-number-label,.target-tools label{font-size:14px;font-weight:600;display:flex;flex-direction:column;gap:6px}.sheet input,.sheet select,.picker-btn{width:100%;min-height:54px;border:1px solid #94a3b8;border-radius:6px;padding:10px 14px;background:white;color:var(--text);font-size:20px}.sheet input:disabled{background:#f1f5f9;color:var(--muted)}.sheet .acts{display:flex;gap:12px;justify-content:flex-end;margin-top:16px}.btn{min-height:60px;font-size:18px;font-weight:600}.btn.primary{background:var(--accent);color:white;border-color:var(--accent)}.btn.link{border-color:transparent;color:var(--accent);background:transparent}.btn.ghost{background:white}.bootstrap-row{border-top:1px solid var(--line);display:flex;align-items:center;gap:16px;padding-top:14px;margin-top:16px}.bootstrap-copy{font-size:14px;color:var(--muted);flex:1}.bootstrap-row .btn{font-size:16px}.picker{position:relative;grid-column:span 2;align-self:end}.picker-btn{text-align:left;padding-right:36px}.picker-btn::after{content:'⌄';position:absolute;right:14px}.picker-pop{position:absolute;left:0;right:0;z-index:40;background:white;border:2px solid var(--accent);border-radius:6px;overflow:auto;box-shadow:0 10px 30px #0f172a30}.picker-opt{width:100%;text-align:left;border:0;border-bottom:1px solid var(--line);border-radius:0;min-height:56px}.picker-opt.sel{background:#eff6ff;color:var(--accent)}.pin-sheet{width:min(100%,860px);display:grid;grid-template-columns:1fr 300px;grid-template-areas:'info pad' 'acts pad';gap:0 28px;align-items:start}.pin-info{grid-area:info}.pin-pad{grid-area:pad}.pin-sheet .acts{grid-area:acts;justify-content:flex-start}.pin-sheet h2{font-size:32px}.employee-number-label{margin-top:18px}.employee-number-label span{font-weight:400;color:var(--muted)}.pindisplay{min-height:64px;border:1px solid #94a3b8;background:#f8fafc;border-radius:8px;font-size:30px;text-align:center;color:var(--accent);padding:10px;margin-bottom:12px;font-variant-numeric:tabular-nums}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.keypad button{min-height:72px;font-size:28px;font-weight:600;padding:8px}.keypad .kp-ok{background:var(--accent);border-color:var(--accent);color:white}.keypad .kp-sec{color:var(--muted)}.admin-sheet{width:min(100%,860px)}.admin-head{display:flex;align-items:center;gap:14px;margin-bottom:12px}.admin-head h2{margin:0;font-size:26px}.admin-back{min-height:48px;font-size:16px;padding:8px}.auth-grid{display:grid;grid-template-columns:1fr 300px;gap:28px;margin-top:14px}.admin-scan-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;border:1px solid var(--line);background:#f8fafc;border-radius:8px;padding:18px;text-align:center}.admin-scan-card .scan-label{font-size:24px}.admin-scan-card .scan-sub{font-size:18px;margin:0}.admin-scan-card.deny{border-color:var(--deny)}.admin-status{margin:8px 0}.admin-pin-card .pindisplay{min-height:48px;font-size:24px;padding:6px}.target-tools{display:flex;align-items:end;gap:10px;margin:12px 0}.target-tools label{flex:1}.target-tools .btn{min-height:54px;font-size:16px;padding:8px 12px}#target-results{max-height:180px;overflow:auto;display:grid;gap:6px;margin-bottom:12px}.target-result{text-align:left;font-size:16px}.vk{position:fixed;left:12px;right:12px;bottom:10px;z-index:60;background:white;border:1px solid var(--line);border-radius:10px;padding:10px;box-shadow:0 10px 40px #0f172a30;display:none}.vk.show{display:block}.vk-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-size:14px}.vk-bar button{min-height:44px;padding:8px 18px;color:var(--accent)}.vk-row{display:flex;justify-content:center;gap:6px;margin-top:6px}.vk-key{min-width:54px;min-height:44px;padding:6px 8px;font-size:18px}.vk-key.wide{min-width:70px}.vk-key.space{min-width:240px}.vk-key.accent{background:var(--accent);color:white}.vk-open .overlay.show{place-items:start center}.vk-open .sheet{max-height:calc(100vh - 330px)}
@media(max-height:620px){.sheet{padding:16px 20px}.admin-head{margin-bottom:8px}.admin-sheet .enroll-copy{font-size:14px}.auth-grid{margin-top:10px;gap:20px}.admin-status{padding:6px 12px}.admin-status strong{font-size:18px}.scanner-slot{margin-bottom:12px;width:108px;height:108px}.scanner{width:104px;height:104px}.print{width:70px;height:70px}.pinbtn{margin-top:20px}.stage{padding-bottom:60px}.sheet h2{font-size:26px}.enroll-top .enroll-copy{font-size:14px}.enroll-top{margin-bottom:8px}.bootstrap-row{margin-top:12px;padding-top:10px}.enroll-form input,.picker-btn{min-height:48px}.target-tools input,.target-tools .btn{min-height:48px}.target-tools{margin:8px 0}.e-status{margin:10px 0;padding:9px 12px}}
@media(max-width:700px){.topbar{padding:12px}.brand{font-size:13px}.net{font-size:12px;max-width:160px}.clock-wrap{gap:12px}.scan-label{font-size:32px}.scan-sub{font-size:20px}.pin-sheet{grid-template-columns:1fr 240px;gap:16px}.keypad button{min-height:60px}.enroll-form{grid-template-columns:1fr 1fr}.sheet{padding:16px}.auth-grid{grid-template-columns:1fr 240px;gap:14px}.bootstrap-row{flex-wrap:wrap}.target-tools{flex-wrap:wrap}.target-tools label{flex-basis:100%}.vk-key{min-width:32px;font-size:16px}.vk-key.space{min-width:140px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
body.kiosk-rotate-right,body.kiosk-rotate-left{width:100vh;height:100vw;transform-origin:top left}body.kiosk-rotate-right{transform:rotate(90deg) translateY(-100%)}body.kiosk-rotate-left{transform:rotate(-90deg) translateX(-100%)}
button,input,.sheet input,.sheet select,.picker-btn{border-color:#64748b}.btn.primary,.keypad .kp-ok,.pinbtn{border-color:var(--accent)}
.station-notice{position:fixed;left:24px;bottom:22px;max-width:62%;font-size:14px;color:var(--out);z-index:7;padding:8px 12px;background:#fefce8;border-radius:6px}.overlay.show~.station-notice{display:none}
.office-requests-btn{font-size:16px;min-height:48px;padding:8px 14px}#office-requests{display:grid;gap:8px;max-height:180px;overflow:auto;margin:8px 0}#office-requests:empty{display:none}
@media(max-height:420px){.stage{display:block;overflow-y:auto;padding:16px 12px;margin-bottom:72px}.panes{height:auto;min-height:100%;align-items:flex-start}.pane{width:100%}.scanner-slot{display:none}.result{overflow-y:auto;align-items:flex-start}.overlay{padding:8px}.sheet{max-height:calc(100vh - 16px)}.vk-open .sheet{max-height:calc(100vh - 16px)}}

@media(max-height:420px){.vk{max-height:calc(100vh - 16px);overflow:auto;bottom:8px}}