@import"https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;500;600;700&family=Nunito+Sans:wght@600;700;800&display=swap";:root{font-family:Kanit,Noto Sans Thai,sans-serif;color:#42385a;background:#fff8f2;font-synthesis:none;--ink:#42385a;--muted:#847b93;--paper:#fffdfa;--lavender:#e8ddff;--lilac:#7867aa;--peach:#ffb798;--peach-dark:#e97f62;--mint:#99d8c2;--line:#eee3dc;--shadow:0 16px 40px rgba(119,88,88,.09)}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(circle at 5% 2%,#f9e4d9 0,transparent 26%),radial-gradient(circle at 93% 13%,#eae3ff 0,transparent 28%),#fff8f2}button,input,select{font:inherit}.shell{display:flex;min-height:100vh}.sidebar{width:274px;background:#fffdfad1;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-right:1px solid rgba(229,215,206,.9);padding:26px 16px 20px;display:flex;flex-direction:column;gap:18px;position:relative;z-index:2}.brand{display:flex;gap:11px;align-items:center;font-family:Nunito Sans,sans-serif;font-size:19px;font-weight:800;letter-spacing:-.5px;color:#55426f;padding:4px 8px}.brand-mark{background:linear-gradient(135deg,#a7dfc6,#66c8b0);border-radius:15px;padding:9px;color:#493b65;display:grid;box-shadow:0 8px 18px #80cbb45c}.brand small{display:block;font-family:Kanit;font-size:11px;opacity:.72;font-weight:400;letter-spacing:0}.side-caption{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:#a096a4;padding:12px 13px 2px}.side-nav{display:grid;gap:7px}.nav{border:0;background:transparent;color:#756d83;text-align:left;padding:12px 13px;border-radius:14px;cursor:pointer;display:flex;gap:11px;align-items:center;transition:.2s ease;font-weight:500}.nav:hover{background:#f8eee8;color:#5c477d;transform:translate(2px)}.nav.active{background:linear-gradient(100deg,#e9ddff,#f3e6ef);color:#594176;box-shadow:0 7px 17px #b9a3cb28}.nav.active svg{color:#de8065}.user-card{margin-top:auto;border-top:1px solid #eee4df;padding:17px 8px 0;color:#968c9b;font-size:13px}.user-card b{display:block;color:#544366;margin-bottom:2px}.user-card .nav{margin-top:9px;padding-left:4px}.content{width:100%;max-width:1700px;margin:auto;padding:34px 42px 42px;position:relative;overflow:auto;isolation:isolate}.content-orb{position:absolute;border-radius:50%;filter:blur(2px);z-index:-1;opacity:.5;pointer-events:none}.orb-one{width:270px;height:270px;background:#f9dacd;right:-100px;top:160px}.orb-two{width:180px;height:180px;background:#ddd2ff;left:18%;bottom:20px}.view-stage{position:relative;min-height:460px;animation:page-in .22s ease both}@keyframes page-in{0%{opacity:.25;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}.topbar{display:flex;justify-content:space-between;align-items:center;margin:20px 0 25px}.topbar h1{font-size:29px;line-height:1.2;margin:0;color:#4c3c64;letter-spacing:-.7px}.topbar p{margin:5px 0 0;color:#908697;font-size:13px}.date-chip,.status-pill{border:1px solid var(--line);border-radius:15px;padding:8px 12px;color:#766f81;background:#fffdfb;font-size:13px}.grid-kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:14px}.kpi,.panel,.check-card{background:#fffdfae6;border:1px solid rgba(235,224,217,.9);border-radius:23px;box-shadow:var(--shadow)}.kpi{padding:18px 19px;min-height:128px;position:relative;overflow:hidden}.kpi:before{content:"";width:42px;height:42px;border-radius:15px;position:absolute;right:-5px;top:-6px;background:var(--accent,#eadfff);opacity:.65}.kpi:nth-child(2):before{background:#c9eadf}.kpi:nth-child(3):before{background:#ffe0b8}.kpi:nth-child(4):before{background:#ffd6d2}.kpi:nth-child(5):before{background:#cadcf8}.kpi label{font-size:13px;color:#847a8d;display:block}.kpi strong{display:block;font:800 30px Nunito Sans;letter-spacing:-1px;color:#544167;margin-top:8px}.kpi small{font-size:12px;color:#918699}.layout{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(270px,.8fr);gap:18px;margin-top:19px}.panel-header{padding:16px 19px;border-bottom:1px solid #f1e8e3;display:flex;align-items:center;justify-content:space-between}.panel-header h2{font-size:16px;margin:0;color:#58446d}.panel-body{padding:8px 18px 17px}.table{width:100%;border-collapse:collapse;font-size:13px}.table th{color:#9a8f9e;text-align:left;padding:12px 8px;font-weight:400}.table td{padding:12px 8px;border-top:1px solid #f3ece8;color:#5d5368}.employee{display:flex;align-items:center;gap:8px}.avatar{background:linear-gradient(135deg,#e9ddff,#f5d9ce);color:#6a5185;width:32px;height:32px;border-radius:13px;display:grid;place-items:center;font-weight:600}.tag{display:inline-block;padding:3px 8px;border-radius:20px;font-size:11px}.tag.green{background:#e1f5ea;color:#398765}.tag.yellow{background:#fff3d9;color:#aa7a24}.tag.red{background:#ffeaeb;color:#c46470}.tag.blue{background:#e8edff;color:#5e6eb1}.map{height:181px;background:linear-gradient(135deg,#f8eee8,#dfeadf);display:grid;place-items:center;color:#e1846d;position:relative;font-size:42px}.map:after{content:"";width:150px;height:150px;border-radius:50%;border:2px solid #ab93d488;position:absolute}.map-info{padding:15px;font-size:13px;color:#847b8a}.map-info b{color:#5a4b68}.check-wrap{max-width:850px;margin:5vh auto}.check-card{padding:31px;text-align:center;background:linear-gradient(145deg,#fffdfb,#fff4ec)}.check-card h2{margin:8px 0;color:#59446e}.clock{font:800 44px Nunito Sans;letter-spacing:-2px;color:#6c5791;margin:8px}.gps{display:flex;align-items:center;justify-content:center;gap:8px;color:#7d7288;background:#f7eee8;padding:11px;border-radius:14px;margin:18px 0;font-size:13px}.action{border:0;border-radius:15px;padding:13px 22px;background:linear-gradient(100deg,#7764a9,#997dbb);color:#fff;font-weight:600;cursor:pointer;min-width:170px;box-shadow:0 8px 16px #7864a630;transition:.2s}.action:hover{transform:translateY(-1px);filter:saturate(1.08)}.action.out{background:linear-gradient(100deg,#e57d67,#f0a080)}.action:disabled{opacity:.55;cursor:not-allowed;transform:none}.login{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 10% 10%,#f9dcd0,transparent 34%),radial-gradient(circle at 88% 78%,#ded3ff,transparent 33%),#fff8f2}.login-box{width:min(420px,92vw);background:#fffdfb;border:1px solid #eee1da;border-radius:29px;padding:36px;box-shadow:0 24px 60px #916a6024}.login-box h1{font-size:27px;color:#57446e;margin:15px 0 3px}.login-box p{color:#918596}.field{display:grid;gap:6px;text-align:left;margin-top:16px;font-size:13px;color:#786d7f}.field input,.field select,.toolbar input,.toolbar select,.password-reset input{border:1px solid #e9ddd8;border-radius:12px;padding:11px 12px;outline-color:#a187c5;background:#fffdfa;color:#53485f}.error{font-size:13px;color:#c46370;margin-top:12px}.toolbar{display:flex;gap:10px;flex-wrap:wrap;padding:15px 18px}.toolbar input,.toolbar select{font-size:13px}.empty{padding:40px;text-align:center;color:#94889a}.modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#59426855;display:grid;place-items:center;padding:15px;z-index:5}.modal-box{width:min(510px,100%);padding:25px;background:#fffdfa;border-radius:22px}.modal-box h2{margin:0;color:#57446e;font-size:19px}.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:20px}.secondary{border:1px solid #e5d9d2;background:#fffdfa;color:#705b82;border-radius:12px;padding:9px 13px;cursor:pointer}.secondary:hover{background:#faf0eb}.notice{font-size:13px;padding:11px 12px;border-radius:12px;background:#fff1ce;color:#a16d18;margin:14px 0}.install-app{position:fixed;right:137px;top:66px;z-index:4;border:0;border-radius:14px;padding:10px 14px;background:#6c5a98;color:#fff;font-weight:600;cursor:pointer;box-shadow:0 7px 15px #69558e2b}.lang-toggle{position:fixed;right:70px;top:66px;z-index:4;display:flex;border:1px solid #e6dbd7;background:#fffdfa;border-radius:14px;padding:3px}.lang-toggle button{border:0;border-radius:10px;background:transparent;color:#82778b;padding:7px 9px;cursor:pointer}.lang-toggle .active{background:#f5dfd7;color:#8c5264}.notification-wrap{position:fixed;right:42px;top:66px;z-index:4}.notification-bell{width:42px;height:42px;border-radius:14px;border:1px solid #e6dbd7;background:#fffdfa;color:#6a5682;cursor:pointer}.notification-menu{position:absolute;right:0;top:49px;width:300px;background:#fffdfa;border:1px solid #e8ded7;border-radius:18px;padding:13px;box-shadow:var(--shadow)}.notification-item{padding:10px 0;border-bottom:1px solid #f1e8e3}.notification-item strong,.notification-item small{display:block;font-size:12px}.notification-item small{color:#8c8291;margin-top:3px}.unread strong{color:#745a92}@media(max-width:980px){.sidebar{width:76px;padding:18px 10px}.brand span,.nav span,.user-card,.side-caption{display:none}.brand,.nav{justify-content:center}.content{padding:28px 25px}.grid-kpi{grid-template-columns:repeat(3,1fr)}}@media(max-width:620px){.shell{display:block}.sidebar{position:fixed;z-index:6;bottom:0;left:0;width:100%;height:67px;padding:8px;background:#fffdfaf5;border-top:1px solid #e8ded8;flex-direction:row;border-right:0}.brand{display:none}.side-nav{display:flex;width:100%;justify-content:space-around}.nav{padding:10px;font-size:0}.nav svg{width:21px}.nav.active{background:#eee1ff}.content{padding:62px 14px 88px;overflow:visible}.topbar{align-items:flex-start;margin:8px 0 20px}.topbar h1{font-size:23px}.date-chip{font-size:11px}.grid-kpi{grid-template-columns:repeat(2,1fr);gap:10px}.kpi{min-height:108px;padding:13px}.kpi strong{font-size:25px}.layout{grid-template-columns:1fr}.hide-mobile{display:none}.panel-body{overflow:auto}.clock{font-size:35px}.install-app{position:absolute;top:13px;right:99px;font-size:12px;padding:8px 10px}.lang-toggle{position:absolute;top:13px;right:45px}.notification-wrap{position:absolute;right:14px;top:13px}.notification-bell{width:36px;height:36px}.notification-menu{right:-1px}.view-stage{min-height:400px}}.summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:8px 0 18px}.summary-grid div{background:#fff7f1;border:1px solid #f0e4dd;border-radius:16px;padding:14px}.summary-grid label{display:block;font-size:12px;color:#8d8291}.summary-grid b{font:800 22px Nunito Sans;color:#6a5685}.summary-grid .orange{color:#dd8268}.chart-title{font-size:14px;color:#65556e;margin:4px 0 12px}.bar-chart{height:165px;display:flex;align-items:flex-end;gap:9px;border-bottom:1px solid #eadfda;padding:0 7px}.bar-unit{height:100%;flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:5px;color:#908493}.bar{width:min(28px,100%);border-radius:9px 9px 0 0;background:linear-gradient(#c8b1f5,#8069af)}.bar-unit small{font-size:11px}.calendar-row{display:flex;gap:12px;padding:12px 4px;border-bottom:1px solid #f1e9e4;color:#716779}.calendar-row b{min-width:62px;color:#78609b}.employee-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;padding:14px 0}.employee-card{background:#fffdfaeb;border:1px solid #eee2dc;border-radius:20px;padding:17px;display:grid;gap:7px;box-shadow:0 9px 23px #8a615910}.employee-card .avatar{margin-bottom:4px}.employee-card small{font-size:11px;color:#928796;overflow-wrap:anywhere}.employee-card span:not(.tag){font-size:12px;color:#72617e}.employee-card select{border:1px solid #e9ddd8;border-radius:10px;padding:8px;background:#fffdfa;color:#5f526c}.password-reset{display:grid;grid-template-columns:1fr auto;gap:6px;margin-top:7px}.password-reset .secondary{padding:8px;font-size:11px}@media(max-width:620px){.summary-grid{grid-template-columns:repeat(2,1fr)}}.notification-wrap{position:absolute;right:32px;top:24px;z-index:5}.notification-bell{position:relative;border:1px solid #dce8f4;background:#fff;border-radius:12px;color:#17548f;padding:9px;cursor:pointer}.notification-bell span{position:absolute;right:-6px;top:-7px;background:#e8414d;color:#fff;border-radius:10px;min-width:17px;height:17px;font-size:10px;display:grid;place-items:center}.notification-menu{position:absolute;right:0;top:46px;width:min(350px,86vw);background:#fff;border:1px solid #dce8f4;border-radius:14px;box-shadow:0 16px 35px #12365b2b;padding:13px}.notification-item{padding:10px 4px;border-bottom:1px solid #edf2f6;font-size:13px}.notification-item.unread{background:#f1f8ff}.notification-item strong,.notification-item small{display:block}.notification-item small{color:#637b95;margin-top:3px}.notification-menu .secondary{margin-top:11px;width:100%}@media(max-width:620px){.notification-wrap{right:14px;top:14px}}.lang-toggle{position:absolute;right:82px;top:25px;z-index:5;border:1px solid #dce8f4;border-radius:10px;background:#fff;padding:2px}.lang-toggle button{border:0;background:transparent;color:#67809a;border-radius:7px;padding:6px 8px;font-size:12px;cursor:pointer}.lang-toggle button.active{background:#0a63c5;color:#fff}@media(max-width:620px){.lang-toggle{right:63px;top:15px}}.install-app{position:absolute;right:140px;top:25px;z-index:5;border:0;border-radius:9px;background:#0a63c5;color:#fff;padding:7px 10px;font-size:12px;cursor:pointer}@media(max-width:620px){.install-app{right:120px;top:15px}}