:root{--forest:#103d2d;--forest-2:#185b43;--forest-3:#e9f4ef;--lime:#b8d865;--amber:#f4b640;--ink:#17211c;--muted:#6d7972;--line:#e3e9e5;--surface:#fff;--canvas:#f4f7f5;--danger:#c0443c;--blue:#315f92;--shadow:0 18px 55px rgba(16,61,45,.10)}*{box-sizing:border-box}html{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--canvas)}body{margin:0;min-height:100vh;font-size:16px}button,input,select,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}.login-screen{min-height:100vh;background:linear-gradient(120deg,#0d3326 0 48%,#f4f7f5 48%);padding:28px 5vw}.login-brand{display:flex;align-items:center;gap:12px;color:#fff}.login-brand img{width:54px;height:54px;object-fit:contain;background:#fff;border-radius:16px}.login-brand div{display:grid}.login-brand strong{font-size:1.2rem}.login-brand span{font-size:.78rem;color:#c9ddd3}.login-grid{max-width:1160px;margin:9vh auto 0;display:grid;grid-template-columns:1.05fr .85fr;gap:9vw;align-items:center}.login-story{color:#fff}.soft-label{display:inline-flex;padding:7px 11px;border-radius:99px;background:#ffffff15;border:1px solid #ffffff22;font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.login-story h1{font-size:clamp(2.6rem,5vw,4.9rem);letter-spacing:-.055em;line-height:.98;margin:25px 0 22px;max-width:650px}.login-story p{color:#c8dbd1;line-height:1.7;max-width:590px}.story-stats{display:flex;gap:28px;margin-top:40px}.story-stats span{display:grid;color:#b9cfc4;font-size:.78rem}.story-stats b{font-size:1.4rem;color:#fff;margin-bottom:3px}.login-card{background:#fff;border-radius:28px;padding:32px;box-shadow:0 30px 80px #071c1540}.login-heading{display:flex;align-items:center;gap:14px;margin-bottom:25px}.hotel-mark,.property-badge{width:46px;height:46px;border-radius:14px;background:var(--forest);color:#fff;display:grid;place-items:center;font-weight:900}.login-heading h2{font-size:1.6rem;margin:0}.login-heading p{margin:4px 0 0;color:var(--muted);font-size:.86rem}.login-card form{display:grid;gap:17px}.login-card label,.form-grid label{display:grid;gap:7px;font-size:.82rem;font-weight:800;color:#3d4a43}.login-card input,.field,.form-grid input,.form-grid select,.form-grid textarea{width:100%;border:1px solid var(--line);border-radius:13px;background:#fbfcfb;padding:13px 14px;outline:none;color:var(--ink)}input:focus,select:focus,textarea:focus{border-color:var(--forest-2);box-shadow:0 0 0 3px #185b4315}.button{border:0;border-radius:12px;padding:11px 16px;font-weight:800;display:inline-flex;justify-content:center;align-items:center;gap:7px;text-decoration:none}.button.primary{background:var(--forest);color:#fff}.button.primary:hover{background:#092c20}.button.secondary{background:var(--forest-3);color:var(--forest)}.button.ghost{background:#fff;border:1px solid var(--line);color:var(--ink)}.button.danger{background:#fdeceb;color:var(--danger)}.button.wide{width:100%;padding:14px}.button.small{font-size:.8rem;padding:8px 11px}.demo-box{background:#f3f7f5;border:1px solid var(--line);border-radius:15px;padding:12px;margin-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:8px}.demo-box>span{grid-column:1/-1;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:var(--muted)}.demo-box button{border:1px solid var(--line);background:#fff;border-radius:10px;padding:9px;color:var(--forest);font-size:.78rem;font-weight:800}.secure-note{text-align:center;color:var(--muted);font-size:.74rem;margin:17px 0 0}.app-shell{min-height:100vh;display:grid;grid-template-columns:255px 1fr}.sidebar{background:var(--forest);color:#fff;padding:22px 16px;position:fixed;width:255px;top:0;bottom:0;display:flex;flex-direction:column;z-index:30}.side-brand{display:flex;align-items:center;gap:11px;padding:0 8px 20px}.side-brand img{width:43px;height:43px;object-fit:contain;background:#fff;border-radius:13px}.side-brand div{display:grid}.side-brand span{font-size:.72rem;color:#bcd0c6}.property-chip{display:flex;align-items:center;gap:10px;background:#ffffff0d;border:1px solid #ffffff16;border-radius:16px;padding:11px;margin-bottom:20px}.property-badge{width:38px;height:38px;background:var(--amber);color:#293024}.property-chip div{display:grid}.property-chip small{color:#bcd0c6;margin-top:2px}.side-nav{display:grid;gap:5px}.nav-item{border:0;background:transparent;color:#c7d8cf;border-radius:12px;padding:11px 12px;text-align:left;font-weight:700;display:flex;align-items:center;gap:12px}.nav-item span{width:25px;height:25px;display:grid;place-items:center;border-radius:8px;background:#ffffff0a;font-size:.8rem}.nav-item.active,.nav-item:hover{background:#ffffff12;color:#fff}.nav-item.active span{background:var(--amber);color:#243228}.side-footer{margin-top:auto;border-top:1px solid #ffffff16;padding:16px 7px 0}.mini-user{display:flex;align-items:center;gap:10px}.mini-user>span{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--forest);font-weight:900}.mini-user div{display:grid}.mini-user small{color:#bcd0c6}.text-button{border:0;background:none;color:#c6d8cf;padding:10px 0;font-weight:700}.main-shell{grid-column:2;min-width:0}.top-header{height:96px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 32px;position:sticky;top:0;z-index:20}.top-header p{margin:0 0 3px;text-transform:uppercase;font-size:.68rem;letter-spacing:.11em;font-weight:900;color:var(--forest-2)}.top-header h1{font-size:1.5rem;margin:0;letter-spacing:-.02em}.header-actions{display:flex;align-items:center;gap:10px}.today-chip{background:#f4f7f5;border:1px solid var(--line);padding:9px 12px;border-radius:11px;color:var(--muted);font-size:.8rem;font-weight:700}.icon-button{width:40px;height:40px;border:1px solid var(--line);background:#fff;border-radius:11px;color:var(--forest);font-weight:900}.notification{font-size:.45rem;color:var(--amber)}#mobileMenu{display:none}.page-content{padding:26px 32px 70px;max-width:1480px;margin:auto}.hero-strip{background:linear-gradient(120deg,#103d2d,#1b6248);color:#fff;border-radius:22px;padding:24px 26px;display:flex;justify-content:space-between;align-items:center;overflow:hidden;position:relative}.hero-strip:after{content:"";position:absolute;width:230px;height:230px;border:45px solid #ffffff0a;border-radius:50%;right:-50px;top:-70px}.hero-strip h2{margin:0 0 6px;font-size:1.45rem}.hero-strip p{margin:0;color:#c5d9cf}.hero-meta{display:flex;gap:26px;position:relative;z-index:1}.hero-meta span{display:grid;color:#bed3c8;font-size:.75rem}.hero-meta b{font-size:1.25rem;color:#fff}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0}.metric-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;display:flex;justify-content:space-between;gap:10px}.metric-copy{display:grid;gap:5px}.metric-copy span{font-size:.78rem;color:var(--muted);font-weight:700}.metric-copy strong{font-size:1.75rem;letter-spacing:-.04em}.metric-copy small{font-size:.73rem;color:var(--forest-2)}.metric-icon{width:42px;height:42px;border-radius:13px;background:var(--forest-3);color:var(--forest);display:grid;place-items:center;font-weight:900}.metric-card.warning .metric-icon{background:#fff5dc;color:#9b6710}.metric-card.blue .metric-icon{background:#eaf1f8;color:var(--blue)}.content-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,.7fr);gap:18px}.panel{background:#fff;border:1px solid var(--line);border-radius:19px;padding:18px;min-width:0}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:15px}.panel-head h3{margin:0;font-size:1rem}.panel-head p{margin:4px 0 0;color:var(--muted);font-size:.77rem}.link-button{border:0;background:none;color:var(--forest-2);font-size:.78rem;font-weight:900}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:690px}th,td{text-align:left;border-bottom:1px solid var(--line);padding:12px 9px;font-size:.8rem;white-space:nowrap}th{font-size:.68rem;color:var(--muted);text-transform:uppercase;letter-spacing:.055em}td b{display:block}td small{display:block;color:var(--muted);margin-top:2px}.person-cell{display:flex;align-items:center;gap:10px}.avatar{width:34px;height:34px;border-radius:11px;background:var(--forest-3);color:var(--forest);display:grid;place-items:center;font-weight:900}.avatar.amber{background:#fff3d2;color:#94620a}.avatar.blue{background:#e8f0f8;color:#315f92}.status{padding:5px 8px;border-radius:99px;font-size:.68rem;font-weight:900;display:inline-block}.status.present,.status.approved,.status.active{background:#e5f5ed;color:#1b704c}.status.late,.status.pending{background:#fff3d7;color:#96640f}.status.absent,.status.rejected,.status.inactive{background:#fdebea;color:#ae3832}.status.off{background:#eef1f0;color:#66736c}.quick-list{display:grid;gap:8px}.quick-item{border:1px solid var(--line);border-radius:14px;padding:12px;display:flex;justify-content:space-between;align-items:center}.quick-item div{display:grid}.quick-item small{color:var(--muted);margin-top:3px}.progress{height:7px;background:#edf1ee;border-radius:99px;overflow:hidden;margin-top:16px}.progress span{display:block;height:100%;background:var(--forest-2);width:67%}.activity{display:grid;gap:14px}.activity-item{display:grid;grid-template-columns:8px 1fr;gap:10px}.activity-dot{width:8px;height:8px;background:var(--forest-2);border-radius:50%;margin-top:5px}.activity-item p{margin:0;font-size:.79rem}.activity-item small{color:var(--muted)}.toolbar{display:flex;align-items:center;gap:10px;justify-content:space-between;margin-bottom:15px}.search{position:relative;max-width:360px;flex:1}.search input{width:100%;padding:11px 13px 11px 38px;border:1px solid var(--line);border-radius:12px;background:#fff}.search:before{content:"⌕";position:absolute;left:13px;top:8px;color:var(--muted);font-size:1.25rem}.toolbar-actions{display:flex;gap:8px}.employee-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.employee-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:17px}.employee-top{display:flex;justify-content:space-between}.employee-top .avatar{width:45px;height:45px;border-radius:14px}.more-button{border:0;background:#f4f7f5;width:34px;height:34px;border-radius:10px}.employee-card h3{font-size:.96rem;margin:13px 0 3px}.employee-card>p{font-size:.76rem;color:var(--muted);margin:0}.employee-details{display:grid;grid-template-columns:1fr 1fr;gap:9px;border-top:1px solid var(--line);margin-top:14px;padding-top:13px}.employee-details span{display:grid;font-size:.68rem;color:var(--muted)}.employee-details b{font-size:.78rem;color:var(--ink);margin-top:2px}.card-actions{display:flex;gap:7px;margin-top:14px}.calendar-strip{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin:14px 0}.calendar-day{border:1px solid var(--line);border-radius:13px;padding:10px;text-align:center;background:#fff}.calendar-day span{display:block;font-size:.68rem;color:var(--muted)}.calendar-day b{font-size:1rem}.calendar-day.active{background:var(--forest);color:#fff;border-color:var(--forest)}.calendar-day.active span{color:#c8dacf}.leave-list{display:grid;gap:10px}.leave-card{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--line);border-radius:15px;padding:14px}.leave-card .person-cell{min-width:220px}.leave-meta{display:flex;gap:25px}.leave-meta span{display:grid;font-size:.7rem;color:var(--muted)}.leave-meta b{font-size:.8rem;color:var(--ink);margin-top:3px}.shift-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.shift-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;border-top:4px solid var(--forest)}.shift-card:nth-child(2){border-top-color:var(--amber)}.shift-card:nth-child(3){border-top-color:var(--blue)}.shift-card h3{margin:0}.shift-time{font-size:1.35rem;font-weight:900;margin:13px 0 5px}.shift-card p{color:var(--muted);font-size:.78rem}.shift-people{display:flex;margin-top:15px}.shift-people .avatar{border:2px solid #fff;margin-right:-7px}.report-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.report-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px}.report-card .metric-icon{margin-bottom:20px}.report-card h3{margin:0 0 5px}.report-card p{color:var(--muted);font-size:.77rem;min-height:38px}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.settings-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:19px}.settings-card h3{margin:0 0 4px}.settings-card>p{font-size:.78rem;color:var(--muted);margin:0 0 16px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.form-grid .full{grid-column:1/-1}.switch-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-top:1px solid var(--line)}.switch-row:first-of-type{border-top:0}.switch{width:43px;height:24px;border:0;border-radius:99px;background:#cbd4cf;padding:3px}.switch:after{content:"";display:block;width:18px;height:18px;border-radius:50%;background:#fff;transition:.2s}.switch.on{background:var(--forest-2)}.switch.on:after{transform:translateX(19px)}.staff-home{max-width:880px;margin:auto}.staff-banner{background:linear-gradient(140deg,#103d2d,#1d654b);color:#fff;border-radius:25px;padding:25px;display:flex;justify-content:space-between;align-items:center}.staff-banner h2{font-size:1.55rem;margin:0 0 5px}.staff-banner p{color:#c9dbd2;margin:0}.time-live{font-size:2rem;font-weight:900;letter-spacing:-.04em}.attendance-focus{display:grid;grid-template-columns:.85fr 1.15fr;gap:18px;margin-top:18px}.camera-panel{min-height:330px;border-radius:20px;background:radial-gradient(circle at 50% 15%,#326f58,#0c2e22 70%);display:grid;place-items:center;color:#d1e1d9;text-align:center;overflow:hidden;position:relative}.camera-panel img{width:110px;height:110px;object-fit:contain;background:#fff;border-radius:30px;padding:4px}.camera-panel:after{content:"LIVE SELFIE";position:absolute;top:15px;left:15px;background:#ffffff1b;border:1px solid #ffffff25;border-radius:99px;padding:6px 9px;font-size:.65rem;font-weight:900;letter-spacing:.08em}.check-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px}.duty-status{display:flex;align-items:center;gap:10px;padding-bottom:17px;border-bottom:1px solid var(--line)}.status-light{width:10px;height:10px;border-radius:50%;background:#aab5af}.status-light.on{background:#2aa36b;box-shadow:0 0 0 5px #e1f5eb}.time-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin:17px 0}.time-box{background:#f4f7f5;border-radius:13px;padding:12px}.time-box span{display:block;color:var(--muted);font-size:.7rem}.time-box b{display:block;margin-top:4px}.geo-ready{background:#eaf5ef;color:#236a4c;border-radius:13px;padding:11px 12px;font-size:.77rem;font-weight:800}.check-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:14px}.check-actions button{padding:13px}.summary-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}.summary-box{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px}.summary-box span{display:block;color:var(--muted);font-size:.72rem}.summary-box b{font-size:1.3rem;display:block;margin-top:4px}.mobile-nav{display:none}.modal{width:min(620px,calc(100% - 28px));border:0;border-radius:22px;padding:0;box-shadow:0 30px 90px #0004}.modal::backdrop{background:#071b14a8}.modal-head{padding:20px 22px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:start}.modal-head h2{margin:0;font-size:1.2rem}.modal-head p{margin:4px 0 0;color:var(--muted);font-size:.78rem}.close-modal{border:0;background:#eff3f1;width:35px;height:35px;border-radius:10px}.modal-body{padding:20px 22px;max-height:70vh;overflow:auto}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}.kiosk-list{display:grid;gap:8px;margin-top:14px}.kiosk-person{border:1px solid var(--line);border-radius:13px;padding:11px;display:flex;align-items:center;justify-content:space-between}.toast{position:fixed;z-index:100;left:50%;bottom:28px;transform:translate(-50%,20px);background:#102f25;color:#fff;padding:12px 17px;border-radius:12px;box-shadow:0 16px 45px #0003;opacity:0;pointer-events:none;transition:.25s;font-size:.82rem;font-weight:700}.toast.show{opacity:1;transform:translate(-50%,0)}.empty-state{text-align:center;padding:42px 20px;color:var(--muted)}@media(max-width:1100px){.employee-grid{grid-template-columns:1fr 1fr}.content-grid{grid-template-columns:1fr}.metric-grid{grid-template-columns:1fr 1fr}.report-grid{grid-template-columns:1fr 1fr}}@media(max-width:760px){body{padding-bottom:72px}.login-screen{padding:20px;background:var(--canvas)}.login-brand{color:var(--forest)}.login-brand span{color:var(--muted)}.login-grid{display:block;margin:6vh auto 0}.login-story{display:none}.login-card{padding:24px 20px;border-radius:22px}.app-shell{display:block}.sidebar{display:none}.main-shell{display:block}.top-header{height:78px;padding:0 16px}.top-header h1{font-size:1.2rem}.top-header p{font-size:.62rem}.today-chip,.notification{display:none}#mobileMenu{display:none}.header-actions .button{padding:9px 11px;font-size:.76rem}.page-content{padding:16px 14px 24px}.hero-strip{padding:19px;display:block}.hero-meta{margin-top:18px;gap:20px}.metric-grid{gap:9px}.metric-card{padding:14px}.metric-copy strong{font-size:1.4rem}.metric-icon{width:36px;height:36px}.employee-grid,.shift-grid,.report-grid,.settings-grid{grid-template-columns:1fr}.toolbar{align-items:stretch;flex-direction:column}.toolbar-actions{width:100%}.toolbar-actions .button{flex:1}.leave-card{align-items:flex-start;gap:12px;flex-wrap:wrap}.leave-meta{gap:16px}.attendance-focus{grid-template-columns:1fr}.camera-panel{min-height:240px}.staff-banner{padding:19px}.time-live{font-size:1.25rem}.summary-row{gap:8px}.summary-box{padding:13px}.mobile-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;height:68px;background:#fff;border-top:1px solid var(--line);z-index:40;padding-bottom:env(safe-area-inset-bottom)}.mobile-nav button{border:0;background:#fff;color:var(--muted);font-size:.6rem;font-weight:800;display:grid;place-items:center;gap:2px;padding:6px 2px}.mobile-nav button span{font-size:1rem}.mobile-nav button.active{color:var(--forest)}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.calendar-strip{overflow:auto;grid-template-columns:repeat(7,72px)}.modal-body{padding:16px}.login-grid .login-card{box-shadow:var(--shadow)}}@media(max-width:420px){.demo-box{grid-template-columns:1fr}.metric-grid{grid-template-columns:1fr 1fr}.metric-card{display:block}.metric-icon{margin-bottom:8px}.header-actions .button{max-width:125px}.check-actions{grid-template-columns:1fr}.summary-box b{font-size:1.05rem}}