@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#1b302b;--green:#185d49;--muted:#7c8882;--line:#e1e6df;--paper:#f6f7f2}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px 'DM Sans',sans-serif}aside{position:fixed;inset:0 auto 0 0;width:230px;background:#fff;border-right:1px solid var(--line);padding:34px 23px}.brand{display:flex;align-items:center;gap:12px;font-size:32px;color:var(--green);font-weight:800}.brand span{font:800 17px Manrope,sans-serif}.brand small{display:block;font:9px 'DM Sans';letter-spacing:2px;margin-top:6px;color:var(--muted)}nav{margin-top:58px;display:grid;gap:9px}button{cursor:pointer;font:600 13px 'DM Sans';border:0;border-radius:8px;padding:12px 17px;background:var(--green);color:#fff}nav button{background:none;color:#76817a;text-align:left;padding:14px}nav button.active{background:#eaf1e9;color:var(--green)}.aside-note{position:absolute;bottom:35px;color:var(--green);font-weight:600;line-height:1.9}.aside-note small{color:var(--muted);font-weight:400}main{margin-left:230px;padding:0 44px;max-width:1700px}header{height:78px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);font-size:10px;letter-spacing:1.5px;color:var(--muted)}header b{color:var(--ink);font-weight:500}.demo{border:1px solid #d9e5d7;border-radius:20px;padding:7px 12px;color:var(--green);font-size:9px}.heading{display:flex;align-items:center;justify-content:space-between;margin:37px 0 23px}.eyebrow{font-size:9px;letter-spacing:2px;color:var(--green);font-weight:700}h1{font:800 33px Manrope;margin:8px 0}p{color:var(--muted);margin:8px 0}.secondary{background:#fff;border:1px solid var(--line);color:var(--ink)}.notice{padding:11px 15px;background:#f0eee1;border:1px solid #e8e3cf;border-radius:7px;color:#807448;font-size:11px;margin-bottom:25px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:17px;margin-bottom:25px}.card,.panel{background:#fff;border:1px solid var(--line);border-radius:12px}.card{padding:22px}.card:first-child{background:var(--green);color:#fff}.label{font-size:11px;color:var(--muted)}.card:first-child .label,.card:first-child small{color:#bcd3bf}.value{font:700 29px Manrope;margin:13px 0 8px}.card small{color:var(--muted);font-size:10px}.grid{display:grid;grid-template-columns:1.5fr 1fr;gap:22px}.panel{padding:24px;margin-bottom:23px}h2{font:700 17px Manrope;margin:0 0 6px}.paneltop{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.sub{color:var(--muted);font-size:11px}.quick{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}.quick button{background:#f3f6f0;color:var(--green);padding:23px 12px;text-align:left}.quick small{display:block;font-weight:400;color:var(--muted);margin-top:7px}table{border-collapse:collapse;width:100%;text-align:left}th{font-size:10px;color:var(--muted);font-weight:500;background:#f7f8f4}th,td{padding:15px 10px;border-bottom:1px solid #edf0e9}td{font-size:12px}.avatar{display:inline-grid;place-items:center;width:30px;height:30px;background:#eef1e4;border-radius:50%;color:var(--green);margin-right:10px;font-size:10px}.pill{padding:5px 9px;background:#edf5ea;color:#568350;border-radius:20px;font-size:10px}.barrow{display:flex;justify-content:space-between;margin:24px 0 8px;font-size:12px}.track{height:7px;background:#edf0e8;border-radius:10px;overflow:hidden}.track i{display:block;background:#7ca479;height:100%}.money{font-weight:700}.negative{color:#a17448}footer{display:flex;justify-content:space-between;padding:24px 0;font-size:9px;color:#9ba49d;letter-spacing:1.5px;border-top:1px solid var(--line);margin-top:30px}input,select{padding:11px;border:1px solid #dce2d8;border-radius:7px;background:#fff;color:var(--ink);font:13px 'DM Sans';min-width:0}label{display:grid;gap:8px;font-size:11px;color:var(--muted)}.form{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:22px}.form button{align-self:end}.toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.statuses{display:flex;gap:5px}.statuses button{background:#f1f3ed;color:#7e8980;padding:8px 10px;font-size:11px}.statuses button.chosen{background:var(--green);color:#fff}.empty{text-align:center;color:var(--muted);padding:30px}.scroll{overflow:auto}#toast{position:fixed;bottom:25px;left:50%;background:var(--ink);color:#fff;padding:12px 22px;border-radius:8px;display:none;z-index:5}a{color:var(--green)}[hidden]{display:none!important}@media(max-width:1000px){aside{width:185px;padding:25px 15px}main{margin-left:185px;padding:0 25px}.cards{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:1fr}.form{grid-template-columns:1fr 1fr}}@media(max-width:650px){aside{position:static;width:100%;padding:17px;border:0}.brand{font-size:25px}.brand small,.aside-note{display:none}nav{display:flex;margin-top:18px;gap:3px;justify-content:space-between}nav button{font-size:11px;padding:10px 6px}main{margin:0;padding:0 17px}header{height:48px}.heading{margin-top:25px}h1{font-size:25px}.heading button{padding:10px;font-size:10px}.card{padding:17px}.value{font-size:25px}.cards{gap:10px}.panel{padding:17px}.form{grid-template-columns:1fr}.notice{line-height:1.7}.statuses button{padding:8px}.grid{gap:0}}

.sitebar{margin:0 0 25px;padding:18px;background:#eaf0e7;border-radius:10px}.sitebar label{min-width:240px;color:#185d49}.sitebar button{align-self:end}.sitebar .sub{margin-left:auto}@media(max-width:650px){.sitebar label{min-width:100%}.sitebar .sub{margin-left:0}}

.approval-link{display:inline-block;text-decoration:none;margin-bottom:20px}.request-card{padding:18px 0;border-bottom:1px solid var(--line)}
/* Readable everyday controls, with mobile navigation always within reach. */
:root{--muted:#596b61}body{font-size:16px}button,input,select{font-size:15px;min-height:46px}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #e4a529;outline-offset:3px}button:disabled{opacity:.65;cursor:default}label,.label{font-size:14px}.sub,.card small{font-size:13px;line-height:1.6}th{font-size:12px}td{font-size:14px}.notice{font-size:13px;line-height:1.6}.search-label{max-width:420px;margin:18px 0}.site-options{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}.site-options button{text-align:left;min-width:180px}.site-options small{display:block;font-weight:400;margin-top:5px;color:var(--muted)}.statuses button{min-height:44px;font-size:14px;padding:10px 14px}.statuses button[data-status="Absent"].chosen{background:#9c4040}.statuses button[data-status="Half-day"].chosen{background:#8c6318}#attendance-summary{background:#edf4ee;color:var(--green);padding:14px;border-radius:8px;font-weight:600}#saveattendance{min-width:200px}.quick button{font-size:17px}.quick small{font-size:13px}.paneltop{gap:16px;flex-wrap:wrap}.form label:has(input[required])>input,.form label:has(select)>select{width:100%}nav button{font-size:15px}.card:first-child .label,.card:first-child small{color:#e0efdf}.empty{font-size:15px}#toast{max-width:calc(100vw - 32px);width:max-content;font-size:15px;box-shadow:0 6px 25px #0003}
@media(max-width:650px){body{padding-bottom:85px}aside{padding:18px 17px}.brand span{font-size:19px}nav{position:fixed;bottom:0;left:0;right:0;z-index:4;background:#fff;border-top:1px solid var(--line);margin:0;padding:8px 6px 12px;box-shadow:0 -4px 16px #1232}nav button{font-size:13px;flex:1;text-align:center;min-height:48px;padding:10px 4px}.heading{align-items:flex-start;gap:10px}.heading button{font-size:12px;max-width:115px}.eyebrow{font-size:10px}.panel{padding:16px}.cards{grid-template-columns:1fr 1fr}.value{font-size:23px}th,td{padding:13px 8px}.sitebar .sub{display:none}.sitebar label{width:100%}.site-options{display:grid;grid-template-columns:1fr;width:100%}.site-options button{width:100%}#attendance table,#attendance tbody{display:block}#attendance thead{display:none}#attendance tr{display:grid;grid-template-columns:1fr auto;padding:15px 0;border-bottom:1px solid var(--line)}#attendance td{border:0;padding:5px 0}#attendance td:last-child{grid-column:1/-1}.statuses{display:grid;grid-template-columns:repeat(3,1fr);margin-top:10px}.statuses button{padding:10px 5px;font-size:14px}#saveattendance{width:100%}#toast{bottom:88px}.quick button{padding:20px 12px}.paneltop input{width:100%}footer{letter-spacing:0;font-size:10px}}
