:root{--navy:#142a43;--blue:#2563eb;--ink:#172538;--muted:#68778b;--line:#e4e9f0;--bg:#f4f7fb;--green:#18a566;--amber:#e89416}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif}button,input,select{font:inherit}a{text-decoration:none}.top{height:76px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 3.5vw}.brand{display:flex;gap:11px;align-items:center}.brand>i,.logo{width:42px;height:42px;border-radius:12px;background:#fff url('favicon-computo.png') center/contain no-repeat;color:transparent;display:grid;place-items:center;font-style:normal;font-weight:bold}.brand span{display:flex;flex-direction:column}.brand small{font-size:9px;color:#74849a;letter-spacing:.1em}.top a{color:var(--blue);font-size:12px;font-weight:bold}.layout{display:flex;min-height:calc(100vh - 76px)}aside{width:220px;background:var(--navy);padding:28px 13px;color:#c6d1df}aside>label{font-size:9px;color:#8495a9;padding:0 12px 11px;display:block}aside>a{color:#bdc9d8;border-radius:8px;padding:12px;display:block;font-size:12px;margin:2px 0}aside>a:hover,aside>a.active{background:#ffffff14;color:#fff;font-weight:bold}.dashboard{flex:1;padding:36px 3.3vw;min-width:0}.dashHead{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.dashHead label,.dashboard>label{color:#3473d0;letter-spacing:.14em;font-size:10px;font-weight:bold}.dashHead h1{font-size:32px;margin:7px 0}.dashHead p{color:var(--muted);font-size:13px;margin:0}.primary{border:0;background:var(--blue);color:white;border-radius:9px;padding:11px 16px;font-weight:bold;font-size:11px}.link{display:inline-block}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:17px}.stats article,.panel{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 9px 30px #1c33540c}.stats article{padding:18px;display:flex;align-items:center;gap:11px}.stats article>i{width:37px;height:37px;border-radius:10px;display:grid;place-items:center;font-style:normal}.blue{color:var(--blue);background:#eaf2ff}.green{color:var(--green);background:#e7f7ef}.amber{color:var(--amber);background:#fff3de}.rose{color:#df5260;background:#ffebed}.stats span small,.stats span em{display:block;font-size:10px;color:var(--muted);font-style:normal}.stats span b{display:block;font-size:22px;margin:4px 0}.boards{display:grid;grid-template-columns:1.8fr .8fr;gap:16px}.panel{padding:21px}.panelHead{display:flex;justify-content:space-between;margin-bottom:15px}.panelHead h2{margin:0;font-size:18px}.panelHead p{margin:4px 0;color:var(--muted);font-size:11px}.table{font-size:11px}.tr{display:grid;grid-template-columns:1.5fr .6fr .7fr .8fr;align-items:center;padding:12px 7px;border-top:1px solid #edf0f4}.tr.labels{border:0;color:#8b97a7;font-size:9px;font-weight:bold}.tr small{display:block;color:#8995a5;margin-top:3px}.tr em{font-style:normal;border-radius:20px;padding:5px 7px;font-size:9px;width:max-content}.tr em.ok{color:#137f50;background:#e8f8f0}.tr em.late{color:#a56708;background:#fff2dc}.alerts>div{display:flex;align-items:center;background:#fff7e8;border-radius:9px;padding:12px;margin:8px 0}.alerts>div span b,.alerts>div span small{display:block;font-size:10px}.alerts>div span small{color:var(--muted);margin-top:3px}.alerts>div a{margin-left:auto;color:#9b620a;font-size:9px;font-weight:bold}.alerts aside{width:auto;background:none;padding:17px 0 0;border-top:1px solid var(--line);color:var(--ink);margin-top:16px}.alerts aside p{display:flex;justify-content:space-between;font-size:11px}.alerts aside p span{color:var(--muted)}.alerts aside>small{font-size:9px;color:#8c99aa}.loginBody{min-height:100vh;display:grid;place-items:center;padding:20px;background:linear-gradient(145deg,#edf3fb,#f8fafc)}.loginCard{width:min(430px,100%);background:#fff;border:1px solid var(--line);border-radius:18px;padding:32px;box-shadow:0 20px 55px #152c4a20}.loginCard .logo{margin-bottom:20px}.loginCard h1{font-size:27px;margin:7px 0}.loginCard p{color:var(--muted);font-size:12px}.loginCard label,.gridForm label,.filters label{display:block;font-size:11px;font-weight:bold;color:var(--ink);letter-spacing:0;margin:13px 0}.loginCard input,.gridForm input,.filters input,.permissionList input,.permissionList select{width:100%;border:1px solid #d8e0e9;border-radius:8px;padding:11px;margin-top:6px}.loginCard button{width:100%;margin:10px 0}.loginCard>a{font-size:11px;color:var(--blue)}.errorBox,.successBox{border-radius:8px;padding:11px;font-size:11px;margin:12px 0}.errorBox{background:#ffedef;color:#b62e3e}.successBox{background:#e8f8f0;color:#137f50}.formPanel{margin-bottom:16px}.formPanel summary{font-weight:bold;color:var(--blue);cursor:pointer}.gridForm{display:grid;grid-template-columns:repeat(3,1fr);gap:0 13px;margin-top:15px}.gridForm button{align-self:end;height:39px;margin-bottom:13px}.people .tr{grid-template-columns:1.6fr .7fr .8fr .7fr}.permissionList article{display:grid;grid-template-columns:1.5fr 1fr;gap:18px;padding:16px 5px;border-bottom:1px solid var(--line)}.permissionList article>div span{display:block;color:var(--muted);font-size:10px;margin-top:5px}.permissionList article>div p{font-size:11px}.permissionList form{display:grid;grid-template-columns:1fr .7fr auto;gap:7px;align-items:center}.permissionList input,.permissionList select{margin:0}.filters{display:flex;align-items:end;gap:10px;margin-bottom:15px}.filters label{margin:0}.filters .primary{height:39px}.report .tr{grid-template-columns:1.5fr .6fr .6fr .8fr}.scheduleRow{display:grid;grid-template-columns:1fr 1fr .8fr;padding:11px 0;border-bottom:1px solid var(--line);font-size:11px}.scheduleRow small{color:var(--muted)}.holidays{max-height:420px;overflow:auto}.holidays p{display:flex;gap:12px;font-size:11px;padding:7px 0;margin:0;border-bottom:1px solid var(--line)}.holidays p b{color:var(--blue)}.empty{color:var(--muted);font-size:11px}
@media(max-width:900px){.stats{grid-template-columns:repeat(2,1fr)}.boards{grid-template-columns:1fr}.gridForm{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){aside{width:60px;padding:20px 6px}aside label{display:none}aside a{font-size:0;text-align:center}aside a:first-letter{font-size:18px}.dashboard{padding:25px 12px}.stats{grid-template-columns:1fr}.dashHead h1{font-size:25px}.panel{overflow:auto}.table{min-width:600px}.gridForm{grid-template-columns:1fr}.permissionList article{grid-template-columns:1fr}.permissionList form{grid-template-columns:1fr}.filters{flex-wrap:wrap}}