:root{font-family:Arial,sans-serif;color:#172019;background:#eef2ec}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}header{height:70px;background:#214d34;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 22px}.brand{display:flex;align-items:center;gap:10px}.brand>b,.logo{width:42px;height:42px;display:grid;place-items:center;background:#ffffff1a;border-radius:12px}.brand span{display:flex;flex-direction:column}.brand small{color:#cadbcf}header>button{border:1px solid #ffffff33;background:transparent;color:#fff;border-radius:9px;padding:8px 12px}.login{min-height:100vh;display:grid;place-items:center;padding:20px;background:#214d34}.login-card{width:min(390px,100%);background:#fff;padding:30px;border-radius:20px;text-align:center}.login-card .logo{margin:auto;background:#214d34;color:#fff}.login-card h1{margin:14px 0 3px}.login-card p{color:#68746a;margin:0 0 20px}label{display:flex;flex-direction:column;gap:6px;text-align:left;color:#627064;font-size:14px;margin:12px 0}input,select,textarea{border:1px solid #cad4c7;border-radius:9px;padding:10px;min-height:44px;background:#fff}textarea{min-height:90px}.primary,.login form>button{border:0;background:#25543a;color:#fff;border-radius:9px;padding:11px 15px;min-height:44px}.login form>button{width:100%;margin-top:8px}.error{color:#a23131;margin-top:10px}.employee{max-width:760px;margin:auto;padding:30px 18px}.heading,.page-head,.panel-head{display:flex;justify-content:space-between;align-items:center;gap:15px}.heading h1,.page-head h1{margin:3px 0;font-size:29px}.eyebrow{color:#647166;text-transform:uppercase;letter-spacing:.1em;font-size:12px}.status{background:#fff;border-radius:999px;padding:9px 12px}.clock-card,.panel,.stats article{background:#fff;border:1px solid #d5ded3;border-radius:16px}.clock-card{text-align:center;padding:25px;margin-top:16px}.clock-card h2{margin:4px 0}.clock{font-size:56px;font-weight:bold;margin:22px 0 5px}.primary-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;max-width:460px;margin:auto}.primary-actions button{border:1px solid #cad4c7;border-radius:9px;padding:11px}.subactions{display:flex;justify-content:center;gap:8px;margin-top:10px}.subactions button,.panel-head button{border:0;background:transparent;color:#25543a;padding:9px}.notice{color:#27703e}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:14px 0}.stats article{padding:15px}.stats span{display:block;color:#68746a;font-size:13px}.stats b{display:block;font-size:22px;margin-top:4px}.panel{padding:19px}.panel h2{margin:0}.panel p{color:#68746a}.day,.row,.staff{display:flex;justify-content:space-between;align-items:center;padding:13px 2px;border-top:1px solid #e1e7df}.day div,.staff div{display:flex;flex-direction:column;gap:3px}.day span,.staff span{color:#68746a;font-size:14px}.positive{color:#25713e}.empty{padding:15px 0}.admin{display:grid;grid-template-columns:220px 1fr;min-height:calc(100vh - 70px)}aside{background:#1c3c29;color:#fff;padding:18px 12px}.admin-name{display:flex;align-items:center;gap:10px;padding:8px}.admin-name>b{width:40px;height:40px;display:grid;place-items:center;background:#ffffff1b;border-radius:10px}.admin-name span{display:flex;flex-direction:column}.admin-name small{color:#bdd0c1}nav{display:flex;flex-direction:column;margin-top:18px}nav button{border:0;background:transparent;color:#dce8df;text-align:left;padding:12px;border-radius:9px}nav button.active{background:#ffffff18}.admin>main{padding:26px}.page-head{margin-bottom:18px}.table{max-width:850px}.staff em{font-style:normal;background:#e4f1e6;color:#276b3d;padding:5px 8px;border-radius:999px}.request{padding:12px}.project{width:100%;display:flex;flex-direction:column;text-align:left;border:1px solid #d5ded3;background:#fff;border-radius:10px;padding:11px;margin:8px 0}.project span,.project small{color:#68746a}.toast{position:fixed;right:20px;bottom:20px;background:#214d34;color:#fff;padding:12px 16px;border-radius:10px}.backdrop{position:fixed;inset:0;background:#102016aa;display:grid;place-items:center;padding:15px}.modal{width:min(520px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:17px;padding:20px}.modal-head{display:flex;justify-content:space-between}.modal-head h2{margin:0}.modal-head button{border:0;background:#edf1eb;border-radius:8px;width:38px;height:38px;font-size:22px}.choice{width:100%;display:flex;justify-content:space-between;text-align:left;border:1px solid #d5ded3;background:#fff;border-radius:10px;padding:11px;margin:8px 0}.choice div{display:flex;flex-direction:column}.choice span,.choice small{color:#68746a}.choice.selected{border:2px solid #2f6843}.upload{border:1px dashed #98aa9a;border-radius:10px;padding:20px;text-align:center}.upload input{display:block}.two,.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.footnote{text-align:center;font-size:12px}.loading{padding:40px}.toast{z-index:5}.backdrop{z-index:10}
@media(max-width:720px){.admin{grid-template-columns:1fr}aside{padding:8px}.admin-name{display:none}nav{margin:0;flex-direction:row;overflow:auto}nav button{white-space:nowrap}.admin>main{padding:18px 12px}.heading,.page-head{align-items:flex-start;flex-direction:column}.stats{grid-template-columns:1fr 1fr}.primary-actions{grid-template-columns:1fr}}
@media(max-width:420px){header{padding:0 12px}.employee{padding:20px 12px}.clock{font-size:46px}.stats,.two{grid-template-columns:1fr}.status{font-size:13px}}
.project-admin{width:100%;border:0;background:transparent;text-align:left;color:inherit}.project-admin:hover{background:#f4f7f3}.project-admin em{margin-left:auto}
.modal form>button{border:1px solid #cad4c7;background:#fff;border-radius:9px;padding:11px 15px;min-height:44px;margin:6px 8px 0 0}.modal form>button.primary{border-color:#25543a;background:#25543a;color:#fff}.check{flex-direction:row;align-items:center}.check input{min-height:auto;width:18px;height:18px}
