:root{--navy:#0b2035;--navy-2:#102c48;--cyan:#18b7c9;--cyan-soft:#e2f8fa;--paper:#f4f7f8;--white:#fff;--ink:#172532;--muted:#647380;--line:#dce4e8;--green:#12805c;--red:#bd3d45;--shadow:0 18px 60px rgba(12,36,57,.12);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper);font-size:16px}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:linear-gradient(135deg,#f7fafb 0%,#eef5f6 100%)}button,input{font:inherit}.hidden{display:none!important}.topbar{height:76px;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 4.5vw;border-bottom:3px solid var(--cyan)}.brand,.sidebar-brand{display:flex;gap:12px;align-items:center;color:#fff;text-decoration:none;font-weight:800;letter-spacing:.14em}.brand-mark{width:36px;height:36px;border-radius:10px;background:var(--cyan);display:grid;place-items:center;color:var(--navy);font-weight:900;letter-spacing:0}.manager-link{background:transparent;border:0;color:#d8e5ed;cursor:pointer;padding:12px;font-weight:650}.manager-link:hover{color:#fff}.clock-view{min-height:calc(100vh - 76px);display:grid;grid-template-columns:minmax(400px,620px) 320px;justify-content:center;align-items:center;gap:56px;padding:48px}.clock-panel{text-align:center}.eyebrow{font-size:.75rem;letter-spacing:.16em;font-weight:800;color:var(--cyan);margin:0 0 10px;text-transform:uppercase}.clock-panel h1{font-size:clamp(4rem,8vw,6.6rem);line-height:1;margin:0;color:var(--navy);letter-spacing:-.05em}.clock-caption{color:var(--muted);margin:14px 0 28px}.pin-display{display:flex;justify-content:center;gap:18px;margin:0 auto 25px}.pin-display i{width:15px;height:15px;border:2px solid #a6b4bc;border-radius:50%;transition:.2s}.pin-display i.filled{background:var(--cyan);border-color:var(--cyan);transform:scale(1.08)}.keypad{width:350px;max-width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:auto}.key{aspect-ratio:1.25;border:1px solid var(--line);border-radius:16px;background:#fff;color:var(--navy);font-size:1.6rem;font-weight:700;box-shadow:0 5px 15px rgba(15,39,59,.05);cursor:pointer}.key:hover{border-color:var(--cyan);background:var(--cyan-soft)}.key:active{transform:scale(.97)}.clear-key{border:0;background:transparent;color:var(--muted);margin-top:15px;cursor:pointer}.status-message{min-height:54px;margin-top:12px;font-weight:700;color:var(--green)}.status-message.error{color:var(--red)}.on-shift-card{background:var(--navy);color:#fff;border-radius:22px;padding:24px;min-height:390px;box-shadow:var(--shadow)}.aside-heading{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(255,255,255,.14);padding-bottom:18px;font-weight:700}.aside-heading strong{background:var(--cyan);color:var(--navy);width:29px;height:29px;border-radius:50%;display:grid;place-items:center}.working-list{display:flex;flex-direction:column;gap:14px;padding-top:18px}.worker{display:flex;align-items:center;gap:12px;padding:10px 0}.avatar{width:42px;height:42px;border-radius:13px;background:#1b4161;color:#7fe5ee;display:grid;place-items:center;font-weight:800}.worker div{display:flex;flex-direction:column}.worker small{color:#9fb3c2;margin-top:3px}.empty{color:#9fb3c2;text-align:center;padding:55px 10px}.setup-view{min-height:100vh;display:grid;place-items:center;padding:30px}.setup-card{background:#fff;border-radius:24px;padding:42px;width:min(480px,100%);box-shadow:var(--shadow)}.setup-icon{width:55px;height:55px;background:var(--navy);color:var(--cyan);border-radius:15px;display:grid;place-items:center;font-weight:900;font-size:1.4rem;margin-bottom:25px}.setup-card h2,.modal-card h2{font-size:2rem;color:var(--navy);margin:0 0 10px}.setup-card>p:not(.eyebrow){color:var(--muted);line-height:1.6}.setup-card form,.modal-card{display:flex;flex-direction:column;gap:18px}label{display:flex;flex-direction:column;gap:7px;font-weight:700;font-size:.88rem;color:#344653}input{border:1px solid #cfd9de;border-radius:10px;padding:13px 14px;background:#fff;color:var(--ink);outline:none}input:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(24,183,201,.13)}.primary{border:0;border-radius:11px;background:var(--cyan);color:var(--navy);font-weight:800;padding:14px 18px;cursor:pointer}.primary:hover{background:#26c7d8}.manager-view{min-height:100vh;display:grid;grid-template-columns:235px 1fr}.sidebar{background:var(--navy);padding:30px 18px;display:flex;flex-direction:column;color:#fff}.sidebar-brand{padding:0 12px 28px}.sidebar nav{display:flex;flex-direction:column;gap:5px}.nav-item{border:0;background:transparent;color:#aabcca;padding:13px 16px;border-radius:10px;text-align:left;cursor:pointer;font-weight:650}.nav-item:hover,.nav-item.active{background:#173c5c;color:#fff}.nav-item.active{box-shadow:inset 3px 0 var(--cyan)}.return-clock{margin-top:auto}.dashboard{padding:38px 44px;overflow:auto}.dashboard-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.dashboard-head h2{margin:0;font-size:2rem;color:var(--navy)}.manager-badge{display:flex;align-items:center;gap:11px}.manager-badge>span{width:42px;height:42px;border-radius:50%;background:var(--cyan-soft);display:grid;place-items:center;color:#087a89;font-weight:800}.manager-badge div{display:flex;flex-direction:column}.manager-badge small{color:var(--muted)}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:24px}.stat,.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px;box-shadow:0 5px 20px rgba(20,45,65,.04)}.stat small{color:var(--muted);font-weight:650}.stat strong{display:block;font-size:1.85rem;color:var(--navy);margin-top:9px}.stat .accent{color:#0793a4}.card{margin-bottom:20px}.card-head,.page-actions{display:flex;justify-content:space-between;align-items:center;gap:12px}.card h3{margin:0 0 18px;color:var(--navy)}.card-head h3{margin:0}.secondary{border:1px solid var(--line);background:#fff;color:var(--navy);border-radius:9px;padding:10px 14px;font-weight:700;cursor:pointer}.secondary:hover{border-color:var(--cyan)}table{width:100%;border-collapse:collapse;margin-top:17px}th{text-align:left;font-size:.73rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);padding:11px 12px;border-bottom:1px solid var(--line)}td{padding:14px 12px;border-bottom:1px solid #edf1f3;font-size:.9rem}tr:last-child td{border-bottom:0}.status-pill{display:inline-flex;padding:5px 9px;border-radius:20px;font-size:.75rem;font-weight:750;background:#edf1f3;color:#60717d}.status-pill.on{background:#ddf5ec;color:#087553}.table-btn{border:0;background:transparent;color:#07889a;font-weight:700;cursor:pointer;padding:5px}.page-actions{margin-bottom:20px}.page-actions>div{display:flex;gap:9px}.date-controls{display:flex;gap:12px;align-items:end;flex-wrap:wrap}.date-controls label{min-width:160px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-error{color:var(--red);min-height:20px;margin:0;font-size:.87rem}dialog{border:0;border-radius:20px;padding:0;box-shadow:var(--shadow);width:min(470px,calc(100% - 32px))}dialog::backdrop{background:rgba(6,24,39,.65);backdrop-filter:blur(3px)}.modal-card{padding:31px;position:relative}.close{position:absolute;right:18px;top:16px;border:0;background:transparent;font-size:1.6rem;color:var(--muted);cursor:pointer}.toast{position:fixed;right:24px;bottom:24px;background:var(--navy);color:#fff;border-left:4px solid var(--cyan);padding:15px 20px;border-radius:10px;box-shadow:var(--shadow);opacity:0;transform:translateY(15px);pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:none}.money{font-variant-numeric:tabular-nums}.note{color:var(--muted);font-size:.86rem}.danger{color:var(--red)}@media(max-width:900px){.clock-view{grid-template-columns:1fr;align-items:start;gap:25px;padding:35px 20px}.on-shift-card{min-height:auto}.stats{grid-template-columns:1fr 1fr}.manager-view{grid-template-columns:1fr}.sidebar{padding:12px 18px;position:sticky;top:0;z-index:5}.sidebar-brand{display:none}.sidebar nav{flex-direction:row;overflow:auto}.return-clock{position:absolute;right:12px;bottom:-48px;background:var(--navy)}.dashboard{padding:65px 18px 25px}.manager-badge{display:none}}@media(max-width:560px){.topbar{padding:0 18px}.clock-panel h1{font-size:4.2rem}.keypad{width:290px}.stats{grid-template-columns:1fr}.dashboard-head{align-items:start}.table-wrap{overflow:auto}.form-row{grid-template-columns:1fr}}