:root{color:#243038;background:#9aafb8;font-family:Segoe UI,Leelawadee UI,sans-serif;font-size:15px;line-height:1.45}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:radial-gradient(900px 480px at 12% 0%,rgba(255,255,255,.28),transparent 55%),linear-gradient(165deg,#6e8b99,#9aafb8 32%,#d7d1c8 68%,#c6b6a4)}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}a{color:#355f72}.boot{min-height:100vh;display:grid;place-items:center;margin:0}.app-frame{height:calc(100vh - 28px);margin:14px;display:grid;grid-template-columns:232px minmax(0,1fr);border-radius:28px;overflow:hidden;background:#ffffff24;border:1px solid rgba(255,255,255,.42);box-shadow:0 24px 60px #2430382e}.sidebar{display:flex;flex-direction:column;padding:22px 16px 16px;color:#3c4c56}.brand{display:flex;align-items:center;gap:10px;font-size:22px;font-weight:700;letter-spacing:-.03em;color:#243038;padding:4px 10px 18px}.mark{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:#ffffff8c;color:#3d6270}.menu-label{margin:0 12px 8px;font-size:12px;color:#60727c}.side-nav{display:flex;flex-direction:column;gap:4px}.side-nav a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;color:#4a5c66;text-decoration:none;font-weight:600}.side-nav a svg{flex:0 0 auto;opacity:.8}.side-nav a.active,.side-nav a:hover{background:#ffffff8c;color:#243038}.user-chip{margin-top:auto;display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:0;background:#ffffff61;border-radius:18px;padding:8px 10px}.user-chip b,.user-chip small{display:block}.user-chip b{font-size:14px}.user-chip small{color:#60727c;font-size:12px}.avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#d7e4ea;color:#355f72;font-size:12px;font-weight:700;flex:0 0 auto}.avatar.sm{width:28px;height:28px;font-size:11px}.workspace{min-width:0;overflow:auto;padding:18px 22px 28px}.workspace-head{display:flex;align-items:center;gap:16px;margin-bottom:18px}.workspace-head h1{margin:0;font-size:32px;font-weight:750;letter-spacing:-.03em}.search{margin-left:auto;display:flex;align-items:center;gap:8px;min-width:min(360px,40vw);padding:0 14px;height:44px;border-radius:999px;background:#ffffff61;border:1px solid rgba(255,255,255,.5);color:#60727c}.search input{border:0;background:transparent;padding:0;width:100%;outline:none}.icon-btn{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#ffffff61;border:1px solid rgba(255,255,255,.5);color:#3c4c56;text-decoration:none}.page{max-width:none;padding:0}.page-head{display:flex;justify-content:flex-end;align-items:center;gap:16px;margin-bottom:14px}.page-head h1{margin-right:auto;font-size:26px;letter-spacing:-.03em}h1{margin:0;font-weight:700}h2{font-size:16px;margin:0;font-weight:700}.muted{color:#6b7c86}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.spread{display:flex;justify-content:space-between;gap:12px;align-items:center}.panel{background:#fff;border:0;border-radius:22px;padding:16px 18px 18px;margin-bottom:16px;box-shadow:0 10px 28px #2430380f}.stat-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.stat-card{display:flex;flex-direction:column;gap:8px;min-height:132px;padding:16px 16px 14px;border-radius:22px;text-decoration:none;color:inherit;background:#ffffff75;border:1px solid rgba(255,255,255,.62);box-shadow:inset 0 1px #ffffff73}.stat-top{display:flex;align-items:center;gap:8px}.stat-ico{width:28px;height:28px;border-radius:10px;display:grid;place-items:center;background:#ffffff9e;color:#3d6270}.stat-label{color:#5d6e78;font-size:13px}.stat-card b{font-size:32px;letter-spacing:-.04em;line-height:1}.trend{margin-top:auto;font-size:12px;color:#3d7a55}.trend.down{color:#b85b4c}.dash{display:flex;flex-direction:column;gap:14px}.dash-grid{display:grid;grid-template-columns:1.45fr 1fr;gap:14px;align-items:stretch}.card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.card-head a{text-decoration:none;font-size:13px;font-weight:650}.big-num{margin:6px 0 0;font-size:34px;font-weight:750;letter-spacing:-.04em}.bars{display:flex;flex-direction:column;gap:14px;margin-top:18px}.bar-row{display:grid;grid-template-columns:110px 1fr 28px;gap:10px;align-items:center;font-size:13px}.bar-track{height:16px;border-radius:999px;background:#eef2f4;overflow:hidden}.bar-track div{height:100%;border-radius:999px}.who-line{display:inline-flex;align-items:center;gap:8px}.metric-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:18px}.metric{background:#f4f7f8;border-radius:16px;padding:12px 14px}.metric b{display:block;font-size:22px;letter-spacing:-.03em}.metric span{color:#6b7c86;font-size:12px}.wait-list{display:flex;flex-direction:column;gap:10px}.wait-item{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px 14px;border-radius:16px;background:#f4f7f8;text-decoration:none;color:inherit}.wait-item b,.wait-item small{display:block}.wait-item small{color:#6b7c86;font-size:12px}.wait-meta{text-align:right}.pill{display:inline-block;border-radius:999px;padding:3px 8px;font-size:12px;font-weight:650}.pill.leave{background:#fde8dc;color:#9a4d32}.pill.resign{background:#f8e4e1;color:#8d3b32}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:10px 8px;border-bottom:1px solid #eef1f3;vertical-align:middle}th{font-size:12px;font-weight:650;letter-spacing:0;text-transform:none;color:#7b8b94}tr.click:hover{background:#f7fafb;cursor:pointer}.num{text-align:right;font-variant-numeric:tabular-nums}.btn{border:1px solid #d5dee3;background:#fff;border-radius:12px;padding:8px 14px;font-weight:650}.btn.primary{background:#2f3e46;border-color:#2f3e46;color:#fff}.btn.danger{background:#b85b4c;border-color:#b85b4c;color:#fff}.btn:disabled{opacity:.55;cursor:not-allowed}.field{display:flex;flex-direction:column;gap:4px;min-width:160px}.field.wide{grid-column:1 / -1}.field span{font-size:12px;color:#6b7c86}input,select,textarea{border:1px solid #d7e0e5;border-radius:12px;padding:8px 10px;background:#fbfcfd}textarea{min-height:80px;resize:vertical}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.filters input,.filters select{min-width:180px}.subnav{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}.subnav button.active{background:#2f3e46;color:#fff;border-color:#2f3e46}.badge{display:inline-block;border-radius:999px;padding:2px 8px;background:#eef2f4;font-size:12px}.badge.ok{background:#e3f5ea;color:#246b42}.badge.warn{background:#fde8dc;color:#9a4d32}.badge.stop{background:#f8e4e1;color:#8d3b32}.modal-back{position:fixed;top:0;right:0;bottom:0;left:0;background:#24303847;display:flex;align-items:flex-start;justify-content:center;padding:48px 16px;z-index:20}.modal{width:min(720px,100%);max-height:calc(100vh - 80px);overflow:auto}.error{color:#9c2f2f;margin:8px 0}.empty{padding:18px 4px;color:#6b7c86}.day-table input{width:80px}.login{min-height:100vh;display:grid;place-items:center}.login .panel{width:min(420px,calc(100% - 32px));padding:28px}.login h1{margin-bottom:8px;font-size:28px}.payslip{width:min(820px,100%)}.payslip h1{font-size:22px}.lines td:nth-child(n+3),.lines th:nth-child(n+3){text-align:right}.marks{display:flex;flex-wrap:wrap;gap:6px}.marks span{border:1px solid #e4ecef;border-radius:8px;padding:4px 6px;font-size:12px;background:#f7fafb}@media(max-width:1100px){.stat-row,.dash-grid{grid-template-columns:1fr 1fr}.search{min-width:180px}}@media(max-width:800px){.app-frame{grid-template-columns:1fr;height:auto;min-height:calc(100vh - 28px)}.sidebar{gap:8px}.side-nav{flex-direction:row;flex-wrap:wrap}.user-chip{margin-top:8px}.stat-row,.dash-grid{grid-template-columns:1fr}}@media print{.sidebar,.workspace-head,.no-print{display:none!important}.app-frame{display:block;height:auto;margin:0;border:0;box-shadow:none;background:#fff}.workspace{overflow:visible;padding:0}body{background:#fff}.panel{box-shadow:none}}