:root{--navy:#102536;--navy2:#17384d;--ink:#152739;--blue:#397896;--gold:#d7aa4d;--orange:#e7792d;--green:#347c60;--paper:#f1f4f5;--white:#fff;--muted:#647583;--line:#d8e1e5;--shadow:0 20px 55px rgba(16,37,54,.1);--serif:"Noto Serif SC","Songti SC",serif;--sans:"Microsoft YaHei","PingFang SC",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.65}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.skip-link{position:fixed;left:16px;top:-60px;background:#fff;padding:10px;z-index:10}.skip-link:focus{top:12px}.topbar{min-height:84px;padding:12px clamp(20px,5vw,72px);display:flex;align-items:center;justify-content:space-between;background:var(--navy);color:#fff}.brand{display:flex;align-items:center;gap:14px}.brand b{display:block;font-size:18px}.brand small{display:block;color:#91a8b6;font-size:9px;letter-spacing:.15em}.topbar nav{display:flex;align-items:center;gap:18px;font-size:13px}.topbar button{border:1px solid #526d7d;background:transparent;color:#fff;padding:8px 13px}.login-shell{min-height:calc(100vh - 84px);display:grid;place-items:center;padding:40px 20px;background:radial-gradient(circle at 75% 20%,#dbe9ed,transparent 34%)}.login-card{width:min(520px,100%);padding:44px;background:#fff;box-shadow:var(--shadow);border-top:4px solid var(--gold)}.eyebrow{margin:0 0 8px;color:var(--blue);font-size:10px;font-weight:800;letter-spacing:.16em}.login-card h1,.hero h1,.section-head h2{font-family:var(--serif);font-weight:500}.login-card h1{font-size:36px;margin:0}.login-card>p:not(.eyebrow){color:var(--muted)}.password-rules{margin:18px 0;padding:12px 14px;background:#f6f1e5;border-left:3px solid var(--gold);color:#6e5a32;font-size:12px}.activation-link{width:100%;margin-top:14px;padding:8px}.activation-preview{margin:16px 0;padding:12px 14px;background:#edf4f6;border-left:3px solid var(--blue);color:var(--muted);font-size:12px}.activation-preview.ready{color:var(--ink);border-left-color:var(--green)}label{display:block;font-size:12px;font-weight:700}.login-card label{margin-top:18px}input,select,textarea{width:100%;margin-top:6px;padding:11px 12px;border:1px solid #c7d3d9;background:#fff;color:var(--ink);outline:none}input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(57,120,150,.1)}.primary,.secondary{min-height:44px;padding:10px 18px;border:0;font-weight:700}.primary{background:var(--orange);color:#fff}.secondary{background:#fff;color:var(--ink);border:1px solid #bdcbd1}.login-card>.primary{width:100%;margin-top:24px}.message{min-height:22px;color:#b3463e;font-size:12px}.workspace{max-width:1500px;margin:auto;padding:34px clamp(18px,4vw,56px) 70px}.hero{min-height:245px;padding:42px clamp(28px,5vw,68px);display:flex;justify-content:space-between;align-items:center;gap:24px;background:linear-gradient(110deg,#e4eff2,#fff);border-left:5px solid var(--blue)}.hero h1{font-size:clamp(34px,4vw,54px);margin:0}.hero p:not(.eyebrow){color:var(--muted)}.metrics{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:20px 0}.metrics article,.card{background:#fff;border:1px solid var(--line);box-shadow:0 8px 24px rgba(16,37,54,.04)}.metrics article{padding:20px}.metrics span,.metrics small{display:block;color:var(--muted);font-size:11px}.metrics strong{display:block;font:500 31px var(--serif);margin:7px 0;color:var(--navy)}.toolbar{padding:20px 24px;display:flex;justify-content:space-between;align-items:center;gap:20px}.toolbar b{display:block;font:500 24px var(--serif)}.toolbar span{font-size:12px;color:var(--muted)}.leave-form{padding:28px;margin-top:16px;border-top:4px solid var(--gold)}.section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:18px}.section-head h2{font-size:25px;margin:0}.section-head>span{font-size:11px;color:var(--muted)}.text-button{border:0;background:transparent;color:var(--blue)}.form-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.form-grid .wide{grid-column:1/-1}.leave-form>.primary{margin-top:18px}.dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}.dashboard-grid>.card{padding:25px;min-width:0}.dashboard-grid>.wide{grid-column:1/-1}.split{display:grid;grid-template-columns:1fr 1fr;gap:28px}.split h3{font-size:14px;margin:0 0 12px}.record-list{display:grid;gap:9px}.record{padding:13px 14px;background:#f5f7f7;border-left:3px solid #aec4ce}.record.good{border-left-color:var(--green)}.record.warn{border-left-color:var(--orange)}.record b{display:flex;justify-content:space-between;gap:12px;font-size:13px}.record b span{font-size:10px;color:var(--blue)}.record p{margin:5px 0 0;color:var(--muted);font-size:11px}.empty{padding:18px;text-align:center;color:#82919a;background:#f7f8f8;font-size:12px}.separated{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}.toast{position:fixed;right:24px;bottom:24px;background:var(--navy);color:#fff;padding:12px 18px;box-shadow:var(--shadow);opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:none}[hidden]{display:none!important}@media(max-width:1100px){.metrics{grid-template-columns:repeat(3,1fr)}}@media(max-width:760px){.topbar{min-height:72px}.brand b{font-size:14px}.brand small,.topbar nav a{display:none}.workspace{padding:18px 14px 45px}.hero{align-items:flex-start;flex-direction:column}.hero h1{font-size:35px}.metrics{grid-template-columns:1fr 1fr}.toolbar,.section-head{align-items:flex-start;flex-direction:column}.form-grid,.dashboard-grid,.split{grid-template-columns:1fr}.dashboard-grid>.wide{grid-column:auto}.login-card{padding:30px 24px}}@media(max-width:420px){.metrics{grid-template-columns:1fr}.toolbar>.primary,.hero>.secondary{width:100%}}
.staff-payroll{margin-top:18px}.payslip{padding:18px;border:1px solid #d8e2e8;border-radius:12px;background:#fff;margin:12px 0}.payslip-title{display:flex;justify-content:space-between;align-items:center}.payslip-title span{padding:4px 9px;border-radius:999px;background:#e8f5ed;color:#227044}.payslip dl{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}.payslip dl div{padding:10px;background:#f5f8fa;border-radius:8px}.payslip dt{font-size:13px;color:#657786}.payslip dd{margin:5px 0 0;font-weight:700}.payslip dl .net{background:#fff2e7;color:#a34f0c}.payslip small{color:#657786}@media(max-width:720px){.payslip dl{grid-template-columns:1fr 1fr}}