:root{--ink:#18221f;--muted:#63716b;--bg:#f1f5f2;--card:#fff;--line:#dce4de;--accent:#c92b36;--soft:#f9e8e9;--focus:#9c741a}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,Segoe UI,Arial,sans-serif}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.65}[hidden]{display:none!important}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #caa54f;outline-offset:3px}.access-topbar{min-height:76px;padding:14px 26px;background:#151515;color:#fff;display:flex;align-items:center;gap:24px}.access-brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;white-space:nowrap}.access-brand img{width:42px;height:42px;object-fit:contain;background:white;border-radius:8px}.access-brand strong{font-size:18px}.access-context{display:flex;align-items:center;gap:18px;color:#d6e0df;font-size:14px}.access-context #till-label{max-width:330px}.access-context time{white-space:nowrap;color:#c3d3d7}.topbar-button{margin-left:auto;color:white;background:#242424;border:1px solid #444;border-radius:10px;padding:12px 18px;font-size:14px;font-weight:600;white-space:nowrap}.topbar-button:hover{background:#343434}.access-main{max-width:1280px;margin:0 auto;padding:42px 28px 60px}.access-heading h1{font-size:30px;line-height:1.25;margin:9px 0 12px;font-weight:750}.access-heading p{color:var(--muted);margin:0 0 28px;font-size:16px}.eyebrow{font-size:11px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted)}.cashier-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}.cashier-card{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:194px;padding:23px 12px;background:white;border:1px solid var(--line);border-radius:18px;color:var(--ink);box-shadow:0 1px 2px #10251808;transition:border-color .15s,transform .15s,box-shadow .15s}.cashier-card:hover{border-color:#b5c4ba;transform:translateY(-2px);box-shadow:0 6px 18px #1025180c}.cashier-avatar{height:64px;width:64px;margin-bottom:14px;display:flex;align-items:center;justify-content:center;background:var(--soft);color:var(--accent);border-radius:50%;font-size:24px;font-weight:700;overflow:hidden}.cashier-avatar img{width:100%;height:100%;object-fit:cover}.cashier-name{font-size:16px;font-weight:650;line-height:1.45;text-align:center}.cashier-role{margin-top:10px;font-size:14px;color:var(--muted)}.access-empty{padding:28px;background:white;border:1px dashed #bccac1;border-radius:14px;color:var(--muted);line-height:1.7}.password-screen{max-width:440px;margin:24px auto 0}.password-brand{text-align:center;margin-bottom:25px}.password-brand h1{font-size:32px;margin:12px 0}.password-brand p{color:var(--muted);line-height:1.5}.password-card{background:white;border:1px solid var(--line);padding:28px;border-radius:18px;box-shadow:0 8px 32px #15281b08}.password-card label{display:block;font-size:14px;font-weight:650;margin:0 0 9px}.password-card input:not([type=hidden]){width:100%;padding:13px 14px;border:1px solid #d2dcd5;border-radius:9px;font-size:16px;background:white;min-height:48px}.password-card>input{margin-bottom:22px}.password-input-wrap{position:relative;margin-bottom:22px}.password-input-wrap input{padding-right:70px!important}.password-input-wrap button{position:absolute;right:8px;top:8px;border:0;background:#f2f5f2;color:#475c50;border-radius:6px;padding:8px;font-size:12px}.primary-button{width:100%;border:0;border-radius:9px;background:#182c22;color:white;font-weight:650;padding:14px}.primary-button:hover{background:#274735}.form-hint{font-size:12px;line-height:1.7;color:var(--muted);text-align:center;margin:16px 0 0}.text-button{display:block;margin:20px auto;border:0;background:none;text-decoration:underline;color:#40584b;font-size:14px}.access-error{background:#fff0f0;border:1px solid #efc7c9;color:#a31e29;padding:12px;border-radius:8px;font-size:13px;line-height:1.5;margin:12px 0}dialog{padding:0;border:0;border-radius:20px;width:min(560px,calc(100vw - 32px));max-height:calc(100dvh - 32px);background:white;box-shadow:0 24px 80px #0003;overflow:auto}dialog::backdrop{background:#19231dad;backdrop-filter:blur(3px)}.pin-dialog-header{padding:24px 28px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.pin-dialog-header h2{margin:8px 0 0;font-size:20px}.close-button{width:32px;height:32px;border:0;background:transparent;font-size:25px;color:#4d5b53}.pin-dialog-body{padding:24px 28px 16px;max-width:420px;margin:auto}.pin-dialog-body>p:first-child{text-align:center;color:var(--muted);font-size:14px;margin:0 0 12px}.pin-entry{position:relative;height:52px;margin-bottom:20px}.pin-dots{height:100%;display:flex;align-items:center;justify-content:center;gap:16px}.pin-dots span{width:17px;height:17px;border:2px solid #c8d3cc;border-radius:50%;background:white;transition:background .1s}.pin-dots span.filled{background:#243e30;border-color:#243e30}.pin-entry input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:text}.pin-keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.pin-keypad button{border:1px solid #cdd8d0;background:#fff;box-shadow:0 2px 2px #132c1b08;border-radius:12px;min-height:62px;font-size:25px;font-weight:600;color:var(--ink)}.pin-keypad button:hover{background:#f1f6f2}.pin-keypad button:active{background:#e1eae3}.pin-keyboard-hint{text-align:center;color:var(--muted);font-size:13px;line-height:1.5;margin:22px 0 10px}.pin-dialog-footer{border-top:1px solid var(--line);padding:16px 24px;display:flex;justify-content:flex-end;background:#f7f9f7}.secondary-button{background:white;border:1px solid #cdd8d0;border-radius:10px;padding:11px 17px;font-size:14px;font-weight:600;color:var(--ink)}@media(min-width:1200px){.cashier-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}@media(max-width:700px){.access-topbar{padding:12px 16px;gap:12px;flex-wrap:wrap}.access-brand strong{font-size:16px}.access-brand img{height:34px;width:34px}.topbar-button{font-size:12px;padding:10px}.access-context{order:3;flex-basis:100%;justify-content:space-between;font-size:12px;gap:10px}.access-main{padding:27px 18px}.access-heading h1{font-size:26px}.cashier-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.cashier-card{min-height:180px;padding:20px 10px}.cashier-name{font-size:14px}.password-card{padding:22px}.pin-dialog-header{padding:18px 22px}.pin-dialog-body{padding:18px 24px 12px}.pin-keypad button{min-height:55px}.pin-keyboard-hint{margin-top:17px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
