@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}@layer theme{:root,:host{--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--default-font-family:"Inter","Noto Sans Thai","Leelawadee UI","Segoe UI",sans-serif;--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.visible{visibility:visible}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.block{display:block}.contents{display:contents}.hidden{display:none}.table{display:table}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}}:root{--bg:#f5f7fb;--surface:#fff;--ink:#172b4d;--muted:#66768e;--line:#e7ecf3;--blue:#2563eb;--blue-dark:#1d4ed8;--blue-light:#edf4ff;--green:#178264;--radius:18px;--shadow:0 2px 8px #18325803,0 8px 28px #18325803}*{box-sizing:border-box}html{scroll-padding-top:100px}body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;margin:0;font-family:Inter,Noto Sans Thai,Leelawadee UI,Segoe UI,sans-serif;font-size:14px;line-height:1.65}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer;transition:background .18s,border-color .18s,color .18s,box-shadow .18s,transform .18s}button:disabled,input:disabled,select:disabled{cursor:not-allowed;opacity:.48}button:focus-visible,a:focus-visible{outline-offset:4px;outline:3px solid #93b8ff}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:650}svg{flex-shrink:0}label{color:#425574;flex-direction:column;gap:8px;min-width:0;font-size:13px;font-weight:550;display:flex}label small{color:var(--muted);font-size:12px;font-weight:400}label em{color:#d65365;font-style:normal}input:not([type=checkbox]),select,textarea{width:100%;min-width:0;min-height:46px;color:var(--ink);background:#fff;border:1px solid #dce4ef;border-radius:10px;padding:11px 14px;transition:border-color .18s,box-shadow .18s}input::placeholder,textarea::placeholder{color:#97a3b6;font-weight:400}input:focus,select:focus,textarea:focus{outline-offset:0;border-color:#80a9f5;outline:3px solid #2563eb12}input[type=checkbox]{accent-color:var(--blue);cursor:pointer;flex-shrink:0;width:18px;height:18px}input[type=file]{padding:10px;font-size:13px}input[type=file]::file-selector-button{background:var(--blue-light);color:var(--blue);cursor:pointer;border:0;border-radius:6px;margin-right:12px;padding:5px 10px}textarea{resize:vertical;min-height:110px}.muted{color:var(--muted)}.spin{animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.brand{color:#17365d;letter-spacing:-1px;white-space:nowrap;align-items:center;gap:9px;font-size:26px;font-weight:720;line-height:1.1;display:flex}.brand-hr{color:var(--blue);font-weight:450}.brand small{color:#8697af;letter-spacing:2px;margin-top:7px;font-size:7px;font-weight:550;display:block}.brand-symbol{flex-shrink:0;align-items:center;gap:3px;width:30px;height:33px;display:flex}.brand-symbol span{background:var(--blue);border-radius:4px;width:7px;height:25px;transform:rotate(23deg)}.brand-symbol span:first-child{background:#8cb5fb;align-self:flex-start;height:16px;margin-top:2px}.brand-symbol span:last-child{background:#5188e6;align-self:flex-end;height:16px;margin-bottom:2px}.brand-light{color:#fff}.brand-light .brand-hr{color:#a1c8ff}.brand-light small{color:#bfd5f5}.button{white-space:nowrap;border:1px solid #0000;border-radius:10px;justify-content:center;align-items:center;gap:8px;min-height:43px;padding:10px 17px;font-size:13px;font-weight:600;line-height:1.6;display:inline-flex}.button.primary{color:#fff;background:var(--blue);border-color:var(--blue);box-shadow:0 3px 6px #2563eb12}.button.primary:hover:not(:disabled){background:var(--blue-dark);border-color:var(--blue-dark);box-shadow:0 4px 12px #2563eb20}.button.secondary{color:#4a5d79;background:#fff;border-color:#dfe6f0}.button.secondary:hover:not(:disabled){background:#f8fbff;border-color:#b8cdf0}.button.danger{color:#fff;background:#cb4355;border-color:#cb4355}.button.danger:hover:not(:disabled){background:#b72e43}.icon-button{color:#71829b;background:0 0;border:1px solid #0000;border-radius:9px;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;padding:7px;display:inline-flex}.icon-button:hover:not(:disabled){color:var(--blue);background:var(--blue-light)}.text-button{color:#2862c8;text-align:left;background:0 0;border:0;padding:3px 0}.text-button:hover,.text-link:hover{text-underline-offset:4px;text-decoration:underline}.text-link{color:#3770cc;align-items:center;gap:6px;font-size:12px;font-weight:550;display:inline-flex}.danger-text{color:#c25a6b}.success-text{color:var(--green)}.avatar{color:#416db0;background:#eaf2ff;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;font-size:12px;font-weight:650;display:inline-flex}.avatar[data-tone="1"]{color:#357a9d;background:#e4f2f8}.avatar[data-tone="2"]{color:#3b8769;background:#e5f4ed}.avatar[data-tone="3"]{color:#aa783c;background:#fff1df}.avatar[data-tone="4"]{color:#687791;background:#edf0f5}.avatar-small{border-radius:11px;width:35px;height:35px}.avatar-large{border-radius:25px;width:84px;height:84px;font-size:26px}.person{align-items:center;gap:11px;min-width:170px;display:flex}.person strong{color:#334b6c;font-size:13px;font-weight:600;display:block}.person small{color:#8796ad;margin-top:2px;font-size:11px;display:block}.badge{color:#7f889b;white-space:nowrap;background:#f0f2f6;border-radius:6px;align-items:center;gap:5px;width:fit-content;padding:4px 9px;font-size:11px;font-weight:500;line-height:1.6;display:inline-flex}.badge i{background:currentColor;border-radius:50%;width:5px;height:5px}.badge-active,.badge-approved,.badge-present,.badge-normal,.badge-on_time,.badge-completed{color:#278365;background:#eaf7ef}.badge-pending,.badge-late,.badge-early,.badge-late_and_early{color:#b1802e;background:#fff5e3}.badge-rejected,.badge-absent,.badge-resigned{color:#bd5a6b;background:#fff0f2}.badge-working,.badge-on_leave{color:#4c79c2;background:#edf4ff}.eyebrow{color:#7b98c0;letter-spacing:1.6px;font-size:10px;font-weight:600;display:block}.page-heading{justify-content:space-between;align-items:center;gap:20px;margin-bottom:28px;display:flex}.page-heading h1{color:#1b3456;letter-spacing:-.6px;margin:5px 0 6px;font-size:clamp(25px,2vw,31px);line-height:1.55}.page-heading p{color:#7a8a9f;font-size:13px;line-height:1.8}.heading-actions{flex-shrink:0;align-items:center;gap:10px;display:flex}.page-heading-icon{color:#7b9ac5;background:#edf4ff;border:1px solid #dfe9fa;border-radius:16px;place-items:center;width:54px;height:54px;display:grid}.panel{border:1px solid var(--line);border-radius:var(--radius);min-width:0;box-shadow:var(--shadow);background:#fff;overflow:hidden}.section-title{justify-content:space-between;align-items:center;gap:14px;padding:23px 24px;display:flex}.section-title h2{color:#2b4362;font-size:15px}.section-title p{color:#8492a7;margin-top:4px;font-size:12px}.table-toolbar{justify-content:space-between;align-items:center;gap:18px;padding:24px;display:flex}.table-toolbar h2{color:#2c4566;align-items:center;gap:9px;font-size:15px;display:flex}.table-toolbar p{color:#8492a7;max-width:510px;margin-top:5px;font-size:12px}.count-pill{color:#5582c4;background:#eff5ff;border-radius:6px;padding:2px 9px;font-size:11px;font-weight:600}.toolbar-actions{align-items:center;gap:9px;display:flex}.search-field{color:#91a2ba;align-items:center;min-width:0;display:flex;position:relative}.search-field>svg{pointer-events:none;position:absolute;left:13px}.search-field input{background:#fcfdff;width:230px;min-height:43px;padding:10px 14px 10px 39px;font-size:13px}.search-field .search-clear{color:#a1b2ca;width:34px;height:34px;position:absolute;right:4px}.search-field:has(.search-clear) input{padding-right:42px}.table-scroll{overscroll-behavior-inline:contain;scrollbar-width:thin;max-width:100%;overflow-x:auto}table{border-collapse:collapse;text-align:left;width:100%;font-size:13px}th{color:#7d8da4;white-space:nowrap;background:#f8fafd;border-block:1px solid #edf1f7;padding:13px 21px;font-size:12px;font-weight:500}.table-sort{color:inherit;font-size:inherit;font-weight:inherit;background:0 0;border:0;align-items:center;gap:7px;padding:0;display:inline-flex}.table-sort>svg{color:#b2c1d7}.table-sort:hover,.table-sort.sorted{color:#5480bd}.table-sort.sorted>svg{color:#75a0df}td{color:#61748e;vertical-align:middle;overflow-wrap:anywhere;border-bottom:1px solid #eff2f7;max-width:290px;padding:17px 21px}tbody tr:last-child td{border-bottom:0}tbody tr:hover{background:#fbfcff}.actions-cell{text-align:right}.row-actions{justify-content:flex-end;align-items:center;gap:4px;display:flex}.row-actions .icon-button{width:33px;height:33px}.row-action-label{display:none}.tabular{font-variant-numeric:tabular-nums;color:#425f86}.cell-sub{color:#91a0b7;margin-top:4px;font-size:11px;display:block}.table-pagination{color:#8190a6;border-top:1px solid #edf1f7;justify-content:space-between;align-items:center;gap:15px;padding:15px 22px;font-size:12px;display:flex}.table-pagination>div{align-items:center;gap:8px;display:flex}.table-filters{flex-wrap:wrap;align-items:center;gap:15px;padding:0 24px 22px;display:flex}.table-filters label{white-space:nowrap;flex-direction:row;align-items:center;gap:9px;font-size:12px}.table-filters input,.table-filters select{width:auto;min-height:40px;font-size:12px}.permission-tags{flex-wrap:wrap;gap:5px;display:flex}.permission-tags span{color:#6b8bb8;background:#f0f5fd;border-radius:5px;padding:3px 8px;font-size:11px}.tabs{scrollbar-width:none;border-bottom:1px solid #dde5f0;gap:26px;margin-bottom:24px;display:flex;overflow-x:auto}.tabs button{color:#8292aa;background:0 0;border:0;flex-shrink:0;padding:0 3px 15px;font-size:13px;position:relative}.tabs button.active{color:var(--blue);font-weight:650}.tabs button.active:after{content:"";background:var(--blue);border-radius:4px 4px 0 0;height:3px;position:absolute;bottom:0;left:0;right:0}.loading,.empty{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:220px;padding:36px 24px;display:flex}.loading{color:#7c99c2;flex-direction:row;gap:12px;font-size:13px}.empty{color:#9eb2ce;gap:8px}.empty-icon{color:#a0b5d2;background:#f2f6fc;border:1px solid #e8eef8;border-radius:16px;place-items:center;width:55px;height:55px;margin-bottom:7px;display:grid}.empty h2,.empty h3{color:#657e9f;font-size:14px;font-weight:550}.empty p{color:#8c9cb2;max-width:340px;font-size:12px}.empty .button{margin-top:10px}.compact-empty{color:#8c9cb2;padding:6px 24px 27px;font-size:12px}.error-notice{color:#ad5364;overflow-wrap:anywhere;background:#fff4f5;border:1px solid #f6dfe3;border-radius:11px;align-items:flex-start;gap:9px;margin:14px;padding:14px 16px;font-size:12px;display:flex}.error-notice>span{flex:1}.error-notice>svg{margin-top:1px}.error-notice .text-button{flex-shrink:0}.info-notice,.success-notice{color:#5b81b7;background:#f0f6ff;border:1px solid #dce8fc;border-radius:11px;align-items:center;gap:9px;margin-bottom:20px;padding:15px 18px;font-size:13px;display:flex}.success-notice{color:#3d8668;background:#eef8f1;border-color:#dbefe3;margin-top:20px}.full-loading,.connection-page{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:23px;min-height:100dvh;padding:28px;display:flex}.full-loading .loading{min-height:0;padding:15px}.connection-page h1{font-size:24px}.connection-page .error-notice{max-width:580px}body:has(dialog[open]){overflow:hidden}.modal{overscroll-behavior:contain;width:min(520px,100% - 40px);max-height:min(90dvh,1000px);color:var(--ink);background:#fff;border:1px solid #dce5f2;border-radius:22px;margin:auto;padding:0;position:fixed;inset:0;overflow:auto;box-shadow:0 30px 100px #11274738}.modal::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#10233f6b}.modal-wide{width:min(760px,100% - 40px)}.modal-header{z-index:3;border-bottom:1px solid var(--line);background:#fff;justify-content:space-between;align-items:flex-start;gap:20px;padding:25px 26px 22px;display:flex;position:sticky;top:0}.modal-header h2{color:#2a476d;margin:5px 0;font-size:22px}.modal-header p{color:#8092ad;font-size:12px}.modal-header .icon-button{background:#f3f6fb}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;display:grid}.modal>form>.form-grid{padding:26px}.modal>form>label{margin:24px 26px}.span-two,.permission-field{grid-column:1/-1}.field-label{display:block}.checkbox-field{flex-direction:row;align-items:center;gap:10px;min-height:32px}.permission-field{border:1px solid #e1e9f5;border-radius:11px;grid-template-columns:repeat(2,1fr);gap:12px;padding:16px;display:grid}.permission-field legend{color:#6e88ae;padding:0 6px;font-size:13px}.permission-field small{color:#9baec9;margin-left:3px}.modal-actions{z-index:2;border-top:1px solid var(--line);background:#fff;justify-content:flex-end;align-items:center;gap:10px;margin:0;padding:19px 26px;display:flex;position:sticky;bottom:0;box-shadow:0 -5px 12px #17345b03}.modal-actions>.button{min-width:100px}.modal>.detail-grid{padding:26px}.detail-grid{grid-template-columns:120px 1fr;gap:20px 17px;margin:0;font-size:13px;display:grid}.detail-grid dt{color:#8497b2;align-items:center;gap:8px;display:flex}.detail-grid dd{color:#49698e;white-space:pre-wrap;overflow-wrap:anywhere;margin:0}.progress-track{background:#edf3fc;border-radius:20px;height:5px;overflow:hidden}.progress-track>span{border-radius:inherit;background:#83a9e5;height:100%;display:block}@media (max-width:1250px){.table-toolbar{flex-direction:column;align-items:flex-start}.toolbar-actions{align-self:stretch}.search-field{flex:1}.search-field input{width:100%}}@media (max-width:767px){body{font-size:14px}.page-heading{flex-direction:column;align-items:flex-start;gap:17px;margin-bottom:22px}.page-heading h1{margin-top:4px;font-size:27px}.page-heading p{font-size:12px}.eyebrow{font-size:9px}.heading-actions{width:100%}.heading-actions .button{flex:1;min-width:0}.page-heading-icon{display:none}.button{min-height:45px;padding:11px 15px;font-size:13px}.icon-button{width:42px;height:42px}.section-title{padding:21px 18px}.section-title h2{font-size:15px}.section-title p{font-size:11px}.text-link{font-size:12px}.table-toolbar{gap:16px;padding:22px 18px 18px}.table-toolbar p{font-size:12px}.toolbar-actions{flex-wrap:wrap;width:100%}.toolbar-actions .search-field{flex-basis:55%}.search-field input{min-height:45px}.table-filters{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:0 18px 20px;display:grid}.table-filters label{white-space:normal;flex-direction:column;align-items:stretch;gap:6px}.table-filters label:last-child:nth-child(odd){grid-column:1/-1}.table-filters input,.table-filters select{width:100%}input:not([type=checkbox]),select,textarea{min-height:48px;font-size:16px}.search-field input{font-size:16px}.table-pagination{flex-wrap:wrap;gap:10px;padding:14px 17px;font-size:11px}.table-pagination>div{margin-left:auto}.tabs{gap:25px;margin-bottom:20px}.tabs button{min-height:43px;padding-bottom:13px;font-size:13px}.mobile-card-table{padding:0 14px 14px;display:block}.mobile-card-table thead{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.mobile-card-table tbody{gap:12px;display:grid}.mobile-card-table tr{background:#fff;border:1px solid #e7edf6;border-radius:13px;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px 16px;padding:17px;display:grid}.mobile-card-table td{color:#486385;border:0;flex-direction:column;align-items:flex-start;gap:5px;min-width:0;max-width:none;padding:0;font-size:13px;display:flex}.mobile-card-table td:before{content:attr(data-label);color:#8c9db4;font-size:11px;font-weight:400;display:block}.mobile-card-table td:first-child{border-bottom:1px solid #eff2f8;grid-column:1/-1;padding-bottom:13px}.mobile-card-table td:first-child:before{display:none}.mobile-card-table .person{min-width:0}.mobile-card-table .person strong{font-size:14px}.mobile-card-table .person small{font-size:11px}.mobile-card-table .actions-cell{border-top:1px solid #eff2f8;grid-column:1/-1;align-items:stretch;padding-top:12px}.mobile-card-table .actions-cell:before{display:none}.mobile-card-table .row-actions{justify-content:flex-end;gap:8px}.mobile-card-table .row-actions .icon-button{border-color:#e4ebf5;width:auto;min-width:42px;height:40px;padding:7px 11px}.row-action-label{margin-left:5px;font-size:12px;display:inline}.checkbox-field{min-height:44px}.form-grid{grid-template-columns:1fr;gap:21px}.span-two,.permission-field{grid-column:auto}.permission-field{grid-template-columns:1fr}.modal{border-bottom:0;border-radius:23px 23px 0 0;width:100%;max-width:100vw;max-height:94dvh;margin:0;inset:auto 0 0}.modal-header{padding:23px 21px 19px}.modal-header h2{font-size:22px}.modal-header p{font-size:12px}.modal>form>.form-grid{padding:23px 21px}.modal>form>label{margin-inline:21px}.modal-actions{padding:17px 21px max(17px,env(safe-area-inset-bottom))}.modal-actions>.button{flex:1}.modal>.detail-grid{padding:23px 21px}.detail-grid{grid-template-columns:96px 1fr;gap:18px 12px;font-size:13px}.empty{min-height:240px;padding-inline:20px}.error-notice{flex-wrap:wrap;font-size:12px}.error-notice .text-button{margin-left:28px}.info-notice{align-items:flex-start;font-size:12px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}
.app-shell{--sidebar-width:254px;min-height:100dvh}.skip-link{z-index:100;color:var(--blue);background:#fff;border:1px solid #bfd3f5;border-radius:10px;padding:12px 20px;position:fixed;top:-80px;left:20px}.skip-link:focus{top:16px}.sidebar{z-index:40;width:var(--sidebar-width);border-right:1px solid var(--line);scrollbar-width:thin;background:#fff;flex-direction:column;padding:29px 18px 16px;transition:width .2s,transform .2s;display:flex;position:fixed;inset:0 auto 0 0;overflow:hidden auto}.sidebar-brand-row{justify-content:space-between;align-items:center;padding:0 9px 28px;display:flex}.brand-link{display:block}.mobile-close{display:none}.company-switch{background:#f8faff;border:1px solid #e8eef8;border-radius:12px;align-items:center;gap:10px;margin:0 3px 25px;padding:13px 10px;display:flex}.company-icon{color:#7296ca;background:#edf3fd;border:1px solid #e1eafb;border-radius:10px;flex-shrink:0;place-items:center;width:35px;height:38px;display:grid}.company-switch>div{min-width:0}.company-switch strong{color:#426082;white-space:nowrap;text-overflow:ellipsis;font-size:11px;font-weight:600;display:block;overflow:hidden}.company-switch small{color:#97a6bb;margin-top:2px;font-size:10px;display:block}.nav-group+.nav-group{margin-top:26px}.nav-label{color:#9aa8bc;letter-spacing:.5px;margin-bottom:9px;padding:0 14px;font-size:10px;font-weight:500}.nav-link{color:#74859d;white-space:nowrap;border-radius:10px;align-items:center;gap:11px;min-height:45px;margin-bottom:4px;padding:11px 14px;font-size:13px;display:flex;position:relative}.nav-link>svg{color:#95a5bd}.nav-link:hover{color:#3a6bb2;background:#f6f9fe}.nav-link.active{color:#2865cf;background:#edf4ff;font-weight:650}.nav-link.active>svg{color:#3976da}.nav-active-dot{background:#5084d9;border-radius:50%;width:5px;height:5px;margin-left:auto}.sidebar-bottom{margin-top:auto;padding-top:28px}.sidebar-user{border-top:1px solid var(--line);align-items:center;gap:10px;padding:15px 7px;display:flex}.sidebar-user>span:nth-child(2){flex:1;min-width:0}.sidebar-user strong{text-overflow:ellipsis;white-space:nowrap;color:#536a89;font-size:12px;font-weight:600;display:block;overflow:hidden}.sidebar-user small{color:#9aabc2;margin-top:2px;font-size:10px;display:block}.sidebar-user>svg{color:#b2c0d4}.logout-button{color:#94a4ba;text-align:left;background:0 0;border:0;border-radius:9px;align-items:center;gap:9px;width:100%;padding:8px 15px;font-size:11px;display:flex}.logout-button:hover{color:#b66b78;background:#fff4f5}.logout-error{color:#b76c7c;padding:5px;font-size:11px}.app-main{min-width:0;margin-left:var(--sidebar-width);transition:margin-left .2s}.topbar{z-index:20;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffffed;justify-content:space-between;align-items:center;gap:20px;min-height:77px;padding:0 34px;display:flex;position:sticky;top:0}.breadcrumb{color:#9ba8ba;align-items:center;gap:13px;min-width:0;font-size:12px;display:flex}.breadcrumb>svg{color:#bdc9da}.breadcrumb strong{color:#5b708d;white-space:nowrap;text-overflow:ellipsis;font-weight:550;overflow:hidden}.desktop-sidebar-toggle{color:#9bacc3;margin-left:-9px}.mobile-menu-button{display:none}.topbar-right{align-items:center;gap:17px;display:flex}.today-label{color:#8b9cb5;white-space:nowrap;font-size:11px}.topbar-divider{background:#e8edf5;width:1px;height:24px}.topbar-profile{align-items:center;gap:9px;display:flex}.topbar-profile>span:last-child:not(.avatar){text-overflow:ellipsis;white-space:nowrap;color:#69809f;max-width:130px;font-size:12px;overflow:hidden}.notification-button{position:relative}.notification-button i{background:#ee9b6d;border:2px solid #fff;border-radius:50%;width:6px;height:6px;position:absolute;top:6px;right:7px}.page-content{outline:none;width:100%;max-width:1560px;min-height:calc(100dvh - 77px);margin:auto;padding:33px 34px 0}.global-filter{color:#8da2bf;justify-content:flex-end;align-items:center;gap:9px;margin:-10px 0 23px;display:flex}.global-filter label{color:#8da2bf;font-size:11px}.global-filter select{background:#fff;border-color:#e1e9f5;width:auto;min-height:36px;padding:6px 12px;font-size:12px}.page-footer{color:#a2b1c7;justify-content:space-between;align-items:center;gap:15px;margin-top:10px;padding:31px 0 22px;font-size:10px;display:flex}.mobile-bottom-nav{display:none}.sidebar-is-collapsed{--sidebar-width:82px}.sidebar-is-collapsed .sidebar,.sidebar-is-collapsed .sidebar-brand-row{padding-inline:12px}.sidebar-is-collapsed .brand>span:last-child,.sidebar-is-collapsed .company-switch,.sidebar-is-collapsed .nav-label,.sidebar-is-collapsed .nav-link>span,.sidebar-is-collapsed .nav-active-dot,.sidebar-is-collapsed .sidebar-user>span:nth-child(2),.sidebar-is-collapsed .sidebar-user>svg,.sidebar-is-collapsed .logout-button>span{display:none}.sidebar-is-collapsed .nav-link{justify-content:center;min-height:46px;padding-inline:0}.sidebar-is-collapsed .nav-group+.nav-group{border-top:1px solid var(--line);margin-top:25px;padding-top:20px}.sidebar-is-collapsed .sidebar-user,.sidebar-is-collapsed .logout-button{justify-content:center;padding-inline:0}.sidebar-is-collapsed .sidebar-brand-row{margin-bottom:30px}.welcome-banner{color:#fff;background:#143f80;border:1px solid #214b87;border-radius:20px;justify-content:space-between;align-items:center;min-height:205px;margin-bottom:25px;padding:28px 32px;display:flex;position:relative;overflow:hidden}.welcome-copy{z-index:2;position:relative}.pill-light{color:#c2d8f5;letter-spacing:.5px;background:#ffffff0c;border:1px solid #90b9ec29;border-radius:30px;align-items:center;gap:7px;padding:5px 10px;font-size:9px;display:inline-flex}.welcome-copy h2{color:#fff;letter-spacing:-.5px;margin:12px 0 7px;font-size:27px;font-weight:550}.welcome-copy p{color:#acc8ec;font-size:12px;line-height:1.9}.welcome-copy>a{color:#e2efff;border-bottom:1px solid #8eb3e380;align-items:center;gap:9px;margin-top:19px;padding-bottom:3px;font-size:11px;display:inline-flex}.welcome-art{width:225px;height:100%;position:absolute;top:0;right:38px}.welcome-orbit{border:1px solid #b5d2fa20;border-radius:50%;width:245px;height:245px;position:absolute;top:-20px;right:0}.welcome-orbit:after{content:"";border:1px solid #b5d2fa14;border-radius:50%;position:absolute;inset:28px}.welcome-flower{color:#507ebf;text-shadow:0 9px #38639f;font-family:Georgia,serif;font-size:200px;position:absolute;top:-60px;left:27px;transform:rotate(13deg)}.welcome-flower:after{content:"";background:#8ab4ec;border:1px solid #b9d4f7;border-radius:50%;width:20px;height:20px;position:absolute;top:142px;left:78px}.art-label{color:#4c719c;background:#fff;border:1px solid #e3eeff;border-radius:9px;align-items:center;gap:7px;padding:10px 13px;font-size:10px;display:flex;position:absolute;bottom:38px;left:-12px;transform:rotate(-5deg);box-shadow:0 8px 20px #041d4020}.green-dot{background:#71ab93;border-radius:50%;width:5px;height:5px}.art-small-flower{color:#83a8dd;font-size:26px;position:absolute;top:14px;right:0}.banner-number{color:#7a9dcb;letter-spacing:1.5px;font-size:8px;position:absolute;bottom:16px;right:20px}.wave{color:#8cb6ed;margin-left:5px;font-size:24px}.mobile-break{display:none}.dashboard-sync{color:#8fa3bf;align-items:center;gap:8px;font-size:11px;display:inline-flex}.dashboard-sync .icon-button{width:32px;height:32px}.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-bottom:25px;display:grid}.stat-card{border:1px solid var(--line);box-shadow:var(--shadow);background:#fff;border-radius:16px;padding:21px 22px 17px;position:relative}.stat-top{color:#7b8ca5;justify-content:space-between;align-items:center;gap:9px;font-size:12px;display:flex}.stat-icon{border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;display:inline-flex}.stat-icon.blue{color:#6d94cf;background:#edf4ff}.stat-icon.green{color:#69a78a;background:#ebf7f0}.stat-icon.orange{color:#cca166;background:#fff5e8}.stat-icon.pink{color:#bc8ba7;background:#fbf0f5}.stat-value{color:#243f65;letter-spacing:-1.2px;font-variant-numeric:tabular-nums;margin:8px 0;font-size:36px;font-weight:650;line-height:1.5}.stat-value small{color:#8e9fb7;letter-spacing:0;margin-left:9px;font-size:11px;font-weight:400}.stat-note{color:#98a7bc;align-items:center;gap:6px;font-size:10px;display:flex}.stat-note i{border-radius:50%;width:4px;height:4px}.dot-blue{background:#99b5e1}.dot-green{background:#9ac8ad}.dot-orange{background:#dbbd92}.dot-pink{background:#d3b1c6}.dashboard-columns{grid-template-columns:minmax(0,1fr) 306px;align-items:start;gap:23px;display:grid}.dashboard-left,.dashboard-right{flex-direction:column;gap:23px;min-width:0;display:flex}.leave-preview-list{padding:0 24px 8px}.leave-preview{border-top:1px solid #eff2f7;align-items:center;gap:11px;padding:18px 0;display:flex}.leave-preview>div{flex:1;min-width:0}.leave-preview strong{color:#526d90;font-size:13px;font-weight:550;display:block}.leave-preview small{color:#8fa3be;margin-top:4px;font-size:11px;display:block}.leave-preview>svg{color:#a7bad5}.attendance-summary .section-title{padding-bottom:10px}.attendance-donut{background:conic-gradient(#6c9fe7 0 var(--progress), #edf3fc var(--progress) 100%);border-radius:50%;place-items:center;width:165px;height:165px;margin:20px auto 24px;display:grid;transform:rotate(-60deg)}.attendance-donut>div{background:#fff;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:135px;height:135px;display:flex;transform:rotate(60deg)}.attendance-donut strong{color:#456d9f;letter-spacing:-.7px;font-size:34px;font-weight:550;line-height:1.3}.attendance-donut span{color:#93a6c2;margin-top:5px;font-size:11px}.summary-legend{justify-content:space-between;align-items:center;gap:14px;margin:0 24px 17px;display:flex}.summary-legend>span{color:#8da2bd;align-items:center;gap:5px;font-size:10px;display:flex}.summary-legend i{border-radius:50%;width:5px;height:5px}.summary-legend strong{color:#6583aa;margin-left:2px;font-weight:550}.legend-blue{background:#6c9fe7}.legend-gray{background:#d9e5f7}.chart-caption{color:#a2b2ca;text-align:center;padding:0 21px 21px;font-size:9px}.balance-mini-list{flex-direction:column;gap:19px;padding:0 24px 25px;display:flex}.balance-mini-list>div>div:first-child{color:#7892b2;justify-content:space-between;align-items:center;gap:8px;margin-bottom:9px;font-size:12px;display:flex}.balance-mini-list strong{color:#5b80b2;font-size:13px;font-weight:550}.balance-mini-list small{color:#a3b6d0;font-size:10px;font-weight:400}.holiday-list{padding:0 24px 13px}.holiday-item{align-items:center;gap:12px;margin-bottom:17px;display:flex}.date-tile{background:#f6f9ff;border:1px solid #e4ecfa;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;min-width:44px;height:51px;display:flex}.date-tile small{color:#94afd1;font-size:9px}.date-tile strong{color:#658cc1;font-size:17px;font-weight:550;line-height:1.4}.holiday-item>div strong{color:#6684aa;font-size:12px;font-weight:550;display:block}.holiday-item>div small{color:#a0b1c9;margin-top:3px;font-size:11px;display:block}.panel-bottom-link{color:#7293bf;border-top:1px solid #eef3fa;justify-content:center;align-items:center;gap:10px;padding:14px;font-size:11px;display:flex}.daily-note{color:#adbfda;align-items:center;gap:11px;padding:4px 17px;display:flex}.daily-note p{color:#97aac7;font-size:12px}.daily-note strong{color:#a8bad4;font-weight:400}.my-attendance{border:1px solid var(--line);box-shadow:var(--shadow);background:#fff;border-radius:18px;align-items:center;gap:30px;margin-bottom:28px;padding:25px;display:flex}.my-attendance-title{align-items:center;gap:13px;margin-right:auto;display:flex}.my-attendance h2{color:#405f86;font-size:15px}.my-attendance p{color:#8fa5c3;margin-top:4px;font-size:11px}.my-time{border-left:1px solid #eaf0f8;padding-left:25px}.my-time span{color:#8aa1c0;font-size:11px;display:block}.my-time strong{color:#4c73a5;letter-spacing:-.8px;font-size:28px;font-weight:550}.my-time-actions{align-items:center;gap:9px;display:flex}.checkin-explainer{color:#6e8db5;background:#f3f7fe;border:1px solid #e4edf9;border-radius:12px;align-items:flex-start;gap:12px;margin:24px 26px 18px;padding:16px;font-size:13px;display:flex}.checkin-explainer small{color:#92a8c7;font-size:11px}.upload-field{text-align:center;color:#82a0c9;background:#fafcff;border:1px dashed #c8d8f0;border-radius:13px;align-items:center;padding:27px 17px}.upload-field strong{color:#6f8fb9;font-size:13px;font-weight:550}.upload-field>span{color:#a0b4cf;font-size:11px}.upload-field input{background:#fff;margin-top:8px}.leave-balance-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:17px;margin-bottom:28px;display:grid}.balance-card{border:1px solid var(--line);box-shadow:var(--shadow);background:#fff;border-radius:16px;padding:23px;position:relative}.balance-card>.stat-icon{position:absolute;top:17px;right:18px}.balance-card>span:not(.stat-icon){color:#7d9bc0;padding-right:34px;font-size:12px;display:block}.balance-card>strong{color:#3e679f;letter-spacing:-.9px;margin:17px 0;font-size:37px;font-weight:550;line-height:1.4;display:block}.balance-card>strong small{color:#9db2d0;letter-spacing:0;margin-left:9px;font-size:11px;font-weight:400}.balance-card p{color:#9bb0cc;margin-top:11px;font-size:11px}.report-filter{margin-bottom:27px;padding-bottom:25px}.report-filter>.form-grid{max-width:700px;padding:0 24px}.report-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;display:grid}.report-card{flex-direction:column;align-items:flex-start;padding:30px;display:flex}.report-icon{color:#82a3d4;background:#edf4ff;border:1px solid #e4edfc;border-radius:15px;place-items:center;width:57px;height:57px;margin-bottom:25px;display:grid}.report-icon-1{color:#87a996;background:#eef8f2;border-color:#e2f0e8}.report-icon-2{color:#c2a173;background:#fff7ec;border-color:#f6ecdc}.report-card h2{color:#456a9a;margin-top:9px;font-size:18px}.report-card p{color:#8da5c5;flex:1;margin-top:13px;font-size:12px;line-height:1.9}.report-card>small{color:#9cb1ce;margin:23px 0;font-size:11px}.report-card>div{gap:10px;width:100%;display:flex}.report-card .button{flex:1}.settings-workspace-note{border:1px solid var(--line);background:#fff;border-radius:14px;align-items:center;gap:13px;margin-bottom:29px;padding:18px 22px;display:flex}.settings-workspace-note strong{color:#527096;font-size:13px;font-weight:600}.settings-workspace-note p{color:#91a6c1;margin-top:3px;font-size:12px}.settings-access-tag{color:#84a5d3;background:#f1f6ff;border:1px solid #e4ecfb;border-radius:7px;align-items:center;gap:6px;margin-left:auto;padding:5px 10px;font-size:10px;display:flex}.settings-search-row{justify-content:space-between;align-items:center;gap:15px;margin-bottom:28px;display:flex}.settings-search-row .search-field{flex:1;max-width:430px}.settings-search-row input{background:#fff;width:100%;min-height:46px}.settings-result-count{color:#92a7c3;font-size:12px}.settings-group{margin-bottom:30px}.settings-group-title{justify-content:space-between;align-items:center;gap:15px;margin-bottom:15px;padding:0 2px;display:flex}.settings-group-title h2{color:#577499;font-size:16px;font-weight:550}.settings-group-title>span{color:#a6b9d2;letter-spacing:1px;font-size:9px}.settings-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.settings-card{border:1px solid var(--line);background:#fff;border-radius:15px;align-items:flex-start;gap:14px;padding:24px 21px;transition:border-color .18s,box-shadow .18s,transform .18s;display:flex}.settings-card:hover{border-color:#bdd3f3;transform:translateY(-3px);box-shadow:0 8px 24px #1c519610}.settings-card-icon{color:#83a5d6;background:#f0f5fe;border:1px solid #e6eefb;border-radius:12px;flex-shrink:0;place-items:center;width:43px;height:43px;display:grid}.settings-card>div{flex:1;min-width:0}.settings-card h3{color:#4e729f;margin:1px 0 6px;font-size:14px;font-weight:600}.settings-card p{color:#90a7c6;font-size:12px;line-height:1.9}.settings-card>svg{color:#b4c7e1;width:15px;margin-top:3px}.settings-back{color:#87a3ca;align-items:center;gap:8px;margin-bottom:23px;font-size:12px;display:inline-flex}.permission-guide{color:#7da1d1;background:#f0f6ff;border:1px solid #dce9fc;border-radius:14px;align-items:flex-start;gap:14px;margin-bottom:24px;padding:22px;display:flex}.permission-guide strong{color:#5e85b9;font-size:14px;font-weight:550}.permission-guide p{color:#88a3ca;margin-top:6px;font-size:12px}.permission-guide small{color:#9eb3d2;margin-top:5px;font-size:11px;display:block}.settings-panel{max-width:900px}.settings-panel>form{padding:0 25px 25px}.settings-panel .modal-actions{box-shadow:none;margin-top:25px;padding:22px 0 0;position:static}.notification-row{border-top:1px solid #edf2f9;gap:15px;padding:25px;display:flex}.notification-row.unread{background:#f8fbff}.notification-row>div{flex:1;min-width:0}.notification-row strong{color:#5076a9;font-size:14px;font-weight:550}.notification-row p{color:#8ba4c4;white-space:pre-wrap;overflow-wrap:anywhere;margin:8px 0;font-size:13px}.notification-row small{color:#9fb3ce;margin-right:15px;font-size:11px}.profile-grid{grid-template-columns:280px minmax(0,1fr);align-items:start;gap:25px;display:grid}.profile-card{text-align:center;flex-direction:column;align-items:center;padding:37px 25px;display:flex}.profile-card h2{color:#466d9f;margin-top:25px;font-size:19px}.profile-card p{color:#92abcc;margin:7px 0 17px;font-size:13px}.profile-code{color:#88a7d1;letter-spacing:1px;background:#f3f7ff;border:1px solid #e6eefb;border-radius:9px;margin-top:27px;padding:7px 18px;font-size:12px}.profile-details .detail-grid{padding:5px 25px 30px}.zkteco-grid{grid-template-columns:330px minmax(0,1fr);gap:25px;display:grid}.sync-card{text-align:center;flex-direction:column;align-items:center;padding:35px 27px 27px;display:flex}.sync-device-icon{color:#7ba2d8;background:#f0f6ff;border:1px solid #dfebfc;border-radius:25px;place-items:center;width:87px;height:87px;margin-bottom:26px;display:grid}.sync-card h2{color:#3d669a;margin:11px 0;font-size:22px}.sync-card>p{color:#8ba5c8;font-size:13px;line-height:1.9}.sync-company{color:#7c9dca;background:#f4f8ff;border-radius:9px;align-items:center;gap:8px;margin:21px 0;padding:9px 14px;font-size:12px;display:flex}.sync-card>.button{width:100%;min-height:47px;margin-top:7px}.sync-card>small{color:#a0b5d1;margin-top:15px;font-size:11px}.sync-status{padding:31px}.sync-status-heading{align-items:flex-start;gap:14px;display:flex}.sync-status-heading h2{color:#4b72a4;font-size:18px}.sync-status-heading p{color:#8fa8cb;margin-top:6px;font-size:13px}.sync-progress-label{color:#8aa5ca;justify-content:space-between;align-items:center;margin:37px 0 13px;font-size:13px;display:flex}.sync-progress-label strong{color:#5a86c2;font-size:27px;font-weight:600}.sync-progress-track{background:#eef4fe;border-radius:15px;height:8px;overflow:hidden}.sync-progress-track>span{border-radius:inherit;background:#5390e6;height:100%;transition:width .4s;display:block}.sync-progress-meta{color:#95adcf;justify-content:space-between;align-items:center;gap:14px;margin:13px 0 27px;font-size:11px;display:flex}.sync-online,.sync-offline{white-space:nowrap;align-items:center;gap:6px;display:flex}.sync-online i,.sync-offline i{background:#87b497;border-radius:50%;width:5px;height:5px}.sync-offline i{background:#cba16a}.sync-counters{border-top:1px solid #edf2f9;grid-template-columns:repeat(4,1fr);gap:13px;padding-top:23px;display:grid}.sync-counters>div{flex-direction:column;gap:5px;display:flex}.sync-counters strong{color:#6f94c7;font-size:28px;font-weight:550}.sync-counters span{color:#a1b7d5;font-size:11px}.sync-job-meta{color:#a9bed9;flex-wrap:wrap;gap:8px 17px;margin-top:26px;font-size:10px;display:flex}.sync-status>.text-link{margin-top:23px}.sync-tip{color:#97b2d8;align-items:center;gap:16px;margin-top:25px;padding:24px;display:flex}.sync-tip>div{flex:1}.sync-tip h3{color:#7d9dc7;font-size:14px}.sync-tip p{color:#a0b6d4;margin-top:5px;font-size:12px}.page-heading p,.table-toolbar p,.section-title p,.settings-card p,.settings-workspace-note p,.empty p,.sync-card>p,.sync-status-heading p,.sync-tip p,.report-card p,.notification-row p{color:#74849a}@media (min-width:1600px){.page-content{padding-top:40px}.dashboard-columns{grid-template-columns:minmax(0,1fr) 340px}.stats-grid{gap:23px}.stat-card{padding:25px}.welcome-art{right:80px}.welcome-banner{min-height:220px}}@media (max-width:1350px){.dashboard-columns{grid-template-columns:minmax(0,1fr) 280px;gap:20px}.dashboard-left,.dashboard-right{gap:20px}.stat-card{padding:19px 18px}.stat-top{font-size:11px}.stat-note{font-size:9px}.settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.my-attendance{flex-wrap:wrap;gap:22px}.my-time-actions{margin-left:auto}.zkteco-grid{grid-template-columns:300px minmax(0,1fr)}}@media (max-width:1099px){.app-shell,.app-shell.sidebar-is-collapsed{--sidebar-width:254px}.app-main,.sidebar-is-collapsed .app-main{margin-left:0}.sidebar,.sidebar-is-collapsed .sidebar{visibility:hidden;width:min(300px,100vw - 50px);padding:25px 20px 18px;transition:transform .22s;transform:translate(-100%)}.sidebar.sidebar-open{visibility:visible;transform:translate(0)}.sidebar-backdrop{z-index:35;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#10243e66;border:0;position:fixed;inset:0}.sidebar-brand-row,.sidebar-is-collapsed .sidebar-brand-row{margin-bottom:0;padding:0 4px 27px}.mobile-close{display:flex}.sidebar-is-collapsed .brand>span:last-child,.sidebar-is-collapsed .company-switch,.sidebar-is-collapsed .nav-label,.sidebar-is-collapsed .nav-link>span,.sidebar-is-collapsed .sidebar-user>span:nth-child(2),.sidebar-is-collapsed .sidebar-user>svg,.sidebar-is-collapsed .logout-button>span{display:revert}.sidebar-is-collapsed .company-switch{display:flex}.sidebar-is-collapsed .nav-link{justify-content:flex-start;padding-inline:14px}.sidebar-is-collapsed .nav-active-dot{display:block}.sidebar-is-collapsed .nav-group+.nav-group{border:0;margin-top:26px;padding:0}.sidebar-is-collapsed .sidebar-user{justify-content:flex-start;padding-inline:7px}.sidebar-is-collapsed .logout-button{justify-content:flex-start;padding-inline:15px}.desktop-sidebar-toggle{display:none}.mobile-menu-button{margin-left:-8px;display:flex}.topbar{min-height:71px;padding:0 28px}.page-content{padding:29px 28px 0}.stats-grid{gap:17px}.stat-card{padding:21px}.zkteco-grid{grid-template-columns:300px minmax(0,1fr)}.sync-status{padding:27px}}@media (min-width:768px) and (max-width:950px){.dashboard-columns{grid-template-columns:minmax(0,1fr) 265px;gap:17px}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.stat-top{font-size:12px}.report-grid{grid-template-columns:1fr}.report-card{grid-template-columns:65px 1fr auto;gap:0 20px;padding:25px;display:grid}.report-icon{grid-row:1/5;margin-bottom:0}.report-card .eyebrow,.report-card h2,.report-card p,.report-card>small{grid-column:2}.report-card>small{margin:13px 0 0}.report-card>div{grid-area:1/3/5;align-items:center}.profile-grid{grid-template-columns:230px minmax(0,1fr)}.zkteco-grid{grid-template-columns:1fr}.sync-card .button{max-width:350px}}@media (max-width:767px){.topbar{gap:12px;min-height:66px;padding:0 18px}.breadcrumb{gap:9px;font-size:13px}.breadcrumb>span,.breadcrumb>svg{display:none}.topbar-right{gap:7px}.today-label,.topbar-profile>span:last-child:not(.avatar),.topbar-divider{display:none}.topbar-profile .avatar{width:34px;height:34px}.page-content{min-height:calc(100dvh - 66px);padding:26px 17px 90px}.page-footer{padding:27px 1px 12px;font-size:9px}.page-footer>span:last-child{display:none}.global-filter{justify-content:flex-start;gap:8px;margin:-3px 0 20px}.global-filter select{flex:1;min-width:0;min-height:42px;padding:8px 10px;font-size:13px}.global-filter label{font-size:12px}.sidebar{padding-bottom:max(20px, env(safe-area-inset-bottom))}.sidebar-bottom{padding-top:30px}.nav-link{min-height:47px;font-size:14px}.company-switch strong{font-size:12px}.nav-label{font-size:11px}.mobile-bottom-nav{z-index:25;padding:9px 8px max(9px, env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#fffffff5;border-top:1px solid #e4ebf5;grid-template-columns:repeat(5,minmax(0,1fr));display:grid;position:fixed;inset:auto 0 0;box-shadow:0 -4px 22px #18335b05}.mobile-bottom-nav>a,.mobile-bottom-nav>button{color:#9aadca;background:0 0;border:0;border-radius:9px;flex-direction:column;justify-content:center;align-items:center;gap:4px;min-height:47px;padding:3px 0;font-size:10px;display:flex}.mobile-bottom-nav>a.active{color:#3775d7}.mobile-bottom-nav>a.active>svg{background:#edf4ff;border-radius:8px;box-shadow:0 0 0 5px #edf4ff}.mobile-bottom-nav>a:hover,.mobile-bottom-nav>button:hover{color:#3775d7}.welcome-banner{border-radius:17px;min-height:203px;margin-bottom:19px;padding:25px 23px}.welcome-copy h2{max-width:260px;font-size:24px}.welcome-copy p{max-width:220px;font-size:11px}.welcome-copy .pill-light{letter-spacing:.2px;font-size:8px}.welcome-copy>a{margin-top:17px;font-size:12px}.welcome-art{transform-origin:100%;opacity:.65;top:18px;right:-38px;transform:scale(.63)}.welcome-art .art-label,.banner-number{display:none}.mobile-break{display:block}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-bottom:21px}.stat-card{border-radius:14px;padding:17px 15px}.stat-top{gap:3px;font-size:11px}.stat-icon{border-radius:9px;width:30px;height:30px}.stat-icon svg{width:17px;height:17px}.stat-value{margin:9px 0;font-size:32px}.stat-value small{margin-left:6px;font-size:10px}.stat-note{gap:4px;font-size:9px}.stat-note>i{flex-shrink:0}.dashboard-columns{grid-template-columns:1fr;gap:20px}.dashboard-left,.dashboard-right{gap:20px}.dashboard-right{grid-template-columns:1fr;display:grid}.daily-note{display:none}.leave-preview-list{padding:0 18px 7px}.leave-preview{gap:9px;padding:18px 0}.leave-preview strong{font-size:13px}.leave-preview small{font-size:10px}.leave-preview>svg{display:none}.leave-preview .avatar{border-radius:11px;width:35px;height:35px}.summary-legend{max-width:280px;margin:0 auto 19px}.summary-legend>span{font-size:11px}.attendance-donut{margin-block:13px 23px}.chart-caption,.dashboard-sync{font-size:10px}.my-attendance{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-bottom:25px;padding:24px 21px;display:grid}.my-attendance-title{grid-column:1/-1;margin:0}.my-time{border:0;padding:0}.my-time span{font-size:12px}.my-time strong{font-size:31px}.my-time-actions{grid-column:1/-1;grid-template-columns:1fr 1fr;gap:10px;margin:0;display:grid}.my-attendance h2{font-size:16px}.my-attendance p{font-size:12px}.checkin-explainer{margin:23px 21px 18px;font-size:12px}.checkin-explainer small{font-size:11px}.leave-balance-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:24px}.balance-card{padding:19px 17px}.balance-card>.stat-icon{display:none}.balance-card>span:not(.stat-icon){padding:0;font-size:12px}.balance-card>strong{margin-block:12px;font-size:32px}.balance-card>strong small{margin:0;font-size:10px;display:block}.balance-card p{font-size:10px}.report-grid{grid-template-columns:1fr;gap:18px}.report-card{padding:25px}.report-card>p{font-size:13px}.report-card>.eyebrow{font-size:9px}.report-card>div{margin-top:0}.report-filter>.form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding-inline:18px}.report-filter input{padding:10px 8px;font-size:14px}.report-icon{margin-bottom:19px}.settings-workspace-note{gap:11px;margin-bottom:23px;padding:17px}.settings-workspace-note strong{font-size:12px}.settings-workspace-note p{font-size:11px}.settings-access-tag{display:none}.settings-search-row{flex-direction:column;align-items:stretch;gap:9px;margin-bottom:25px}.settings-search-row .search-field{width:100%;max-width:none}.settings-search-row input{font-size:16px}.settings-result-count{font-size:11px}.settings-grid{grid-template-columns:1fr;gap:12px}.settings-card{gap:14px;padding:21px}.settings-card h3{font-size:14px}.settings-card p{font-size:12px}.settings-card>svg{width:16px}.settings-group{margin-bottom:26px}.settings-group-title h2{font-size:15px}.settings-group-title>span{display:none}.settings-group-title{margin-bottom:13px}.permission-guide{padding:19px}.permission-guide p{font-size:11px}.permission-guide strong{font-size:13px}.settings-panel>form{padding-inline:20px}.settings-panel .modal-actions>.button{flex:1}.profile-grid{grid-template-columns:1fr;gap:20px}.profile-card{padding:31px 24px}.profile-details .detail-grid{padding:0 21px 28px}.notification-row{gap:11px;padding:22px 18px}.notification-row strong{font-size:13px}.notification-row p{font-size:12px}.notification-row small{font-size:10px}.zkteco-grid{grid-template-columns:1fr;gap:20px}.sync-card{padding:30px 24px 25px}.sync-card>p{font-size:13px}.sync-status{padding:25px 21px}.sync-status-heading h2{font-size:17px}.sync-status-heading p{font-size:12px}.sync-progress-meta{flex-wrap:wrap;gap:7px;font-size:10px}.sync-counters{grid-template-columns:repeat(2,1fr);gap:20px}.sync-counters span{font-size:12px}.sync-job-meta{overflow-wrap:anywhere;font-size:9px}.sync-tip{flex-wrap:wrap;align-items:flex-start;gap:13px;padding:22px}.sync-tip>div{flex:80%}.sync-tip h3{font-size:13px}.sync-tip p{font-size:12px}.sync-tip>.text-link{margin-left:33px}}@media (max-width:374px){.page-content{padding-inline:13px}.stat-card{padding:15px 13px}.stat-top{font-size:10px}.stat-top .stat-icon{width:27px;height:27px}.stat-note{font-size:8px}.stat-value{font-size:29px}.heading-actions{flex-wrap:wrap}.heading-actions>.button{flex-basis:100%}.welcome-banner{padding-inline:20px}.welcome-copy h2{font-size:22px}.welcome-art{opacity:.35}.mobile-bottom-nav{padding-inline:4px}}
.login-page{background:#fff;grid-template-columns:48% 52%;min-height:100dvh;display:grid}.login-story{color:#fff;background:#0c2b5e;flex-direction:column;min-height:100dvh;padding:36px 48px 24px;display:flex;position:relative;overflow:hidden}.login-story:before{content:"";pointer-events:none;background:radial-gradient(at 90% 65%,#285ab855,#0000 65%);position:absolute;inset:0}.login-story>.brand{color:#fff;font-size:27px;position:relative}.login-story .brand-hr{color:#9ac0ff}.login-story .brand small{color:#adc8ee;font-size:7px}.login-story .brand-symbol span{background:#fff}.login-story .brand-symbol span:first-child{background:#7eaaff}.login-story .brand-symbol span:last-child{background:#bbd3ff}.login-story-copy{width:100%;max-width:450px;margin:auto;padding:32px 0 15px;position:relative}.login-story-kicker{color:#acc7ef;letter-spacing:1.5px;align-items:center;gap:8px;font-size:9px;display:inline-flex}.login-story-kicker>span{background:#73aaff;border-radius:50%;width:5px;height:5px;box-shadow:0 0 0 4px #69a5ff15}.login-story h1{letter-spacing:-.7px;color:#fff;margin:19px 0 15px;font-size:clamp(29px,2.8vw,42px);font-weight:500;line-height:1.65}.login-story h1>span{color:#9ec5ff;display:inline}.login-story-copy>p{color:#b2c8e9;margin:0;font-size:13px;line-height:1.9}.workspace-illustration{width:100%;max-width:380px;height:252px;margin:27px auto 0;position:relative}.illustration-orbit{border:1px solid #8bb5fb23;border-radius:50%;width:290px;height:290px;position:absolute;top:-15px;right:-15px}.illustration-orbit:before{content:"";border:1px solid #8bb5fb18;border-radius:50%;position:absolute;inset:28px}.illustration-card{color:#24466e;background:#f8fbff;border:1px solid #fff;border-radius:15px;padding:18px;position:absolute;top:8px;left:4px;right:23px;transform:rotate(-4deg);box-shadow:0 22px 48px #03152e45}.illustration-card-head{border-bottom:1px solid #e3ecf8;align-items:center;gap:10px;padding-bottom:14px;display:flex}.illustration-logo{color:#fff;background:#2366e8;border-radius:9px;place-items:center;width:34px;height:34px;display:grid}.illustration-card strong{font-size:11px;font-weight:600;display:block}.illustration-card small{color:#8ca0bb;margin-top:2px;font-size:9px;display:block}.illustration-dots{color:#9bb0cd;letter-spacing:2px;margin-left:auto}.illustration-row{align-items:center;gap:10px;padding-top:13px;display:flex}.illustration-row>div{flex:1}.illustration-row>svg{color:#4685c5}.illustration-icon{color:#6190d0;background:#edf4ff;border:1px solid #dfebfc;border-radius:8px;place-items:center;width:31px;height:31px;display:grid}.illustration-tag{color:#3e6295;background:#fff;border:1px solid #e1edff;border-radius:9px;align-items:center;gap:8px;padding:10px 16px;font-size:11px;font-weight:500;display:flex;position:absolute;bottom:3px;right:0;transform:rotate(3deg);box-shadow:0 10px 25px #03152e24}.illustration-tag>span{color:#3981e8;background:#eaf3ff;border-radius:50%;place-items:center;padding:4px;display:grid}.illustration-spark{color:#79aaf8;font-weight:300;position:absolute}.spark-one{font-size:26px;top:8px;right:-2px}.spark-two{color:#c1d8fc;font-size:19px;bottom:35px;left:-16px}.login-story-footer{color:#87a5d0;letter-spacing:1px;justify-content:space-between;margin-top:18px;font-size:8px;display:flex;position:relative}.login-form-side{background:#fff;flex-direction:column;padding:30px 42px 23px;display:flex}.login-topline{justify-content:flex-end;min-height:28px;display:flex}.secure-label{color:#8a9bb3;letter-spacing:1px;align-items:center;gap:7px;font-size:8px;display:inline-flex}.login-mobile-brand{display:none}.login-form-wrap{width:min(390px,100%);margin:auto;padding:36px 0}.login-emblem{color:#4a7ed0;background:#f0f6ff;border:1px solid #dce8fc;border-radius:14px;place-items:center;width:50px;height:50px;margin-bottom:24px;display:grid}.login-form-wrap .eyebrow{color:#4e7bbf;letter-spacing:1.8px;font-size:9px}.login-form-wrap h2{color:#172f53;letter-spacing:-.8px;margin:7px 0 8px;font-size:30px;font-weight:600}.login-form-wrap>p{color:#8694a9;font-size:13px}.login-form .input-icon>input{min-height:50px;font-size:14px}.login-form .input-icon>svg{top:16px}.login-form label,.login-form .input-icon input::placeholder{font-size:13px}.login-form{flex-direction:column;gap:20px;margin-top:31px;display:flex}.login-form label{color:#465b78;gap:8px;font-size:12px;font-weight:500}.input-icon{position:relative}.input-icon>svg{color:#9aacc4;position:absolute;top:16px;left:14px}.input-icon>input{color:#264566;background:#fcfdff;border:1px solid #dfe6f0;border-radius:9px;width:100%;min-height:49px;padding:13px 43px;font-size:13px}.input-icon input::placeholder{color:#a3afc1;font-size:12px}.input-icon input:focus{background:#fff;border-color:#75a1ed;outline:3px solid #e9f1ff}.input-icon .icon-button{color:#8ba0bf;position:absolute;top:8px;right:8px}.login-submit{color:#fff;border:1px solid #2461db;border-radius:9px;justify-content:space-between;width:100%;min-height:49px;margin-top:4px;padding:13px 17px;font-size:13px;box-shadow:0 5px 10px #2563eb19;background:#2563eb!important}.login-submit:hover:not(:disabled){transform:translateY(-1px);background:#1d4ed8!important}.login-form .error-notice{margin:0}.login-help{text-align:center;color:#778ba6;margin-top:27px;font-size:11px;line-height:1.8;display:block}.login-help-line{background:#e0e7f1;width:42px;height:1px;margin:0 auto 17px;display:block}.login-help p{color:#a0adbf;margin-top:3px;font-size:10px}.login-bottom{color:#99a8bc;justify-content:space-between;align-items:center;gap:12px;font-size:9px;display:flex}.login-bottom>span:last-child{align-items:center;gap:5px;display:flex}@media (max-width:1100px){.login-story{padding:32px 32px 23px}.login-story h1{font-size:31px}.login-story-copy>p{font-size:12px}.login-form-side{padding:28px 35px 22px}.login-form-wrap{max-width:355px}.workspace-illustration{max-width:335px;height:240px}.illustration-card{left:0;right:5px}.illustration-tag{bottom:-2px;right:-8px}.login-story-footer{font-size:7px}.login-story-footer>span:last-child{display:none}}@media (max-width:800px){.login-page{grid-template-columns:42% 58%}.login-story{padding:30px 23px 23px}.login-story>.brand{font-size:23px}.login-story h1{font-size:26px}.login-story-kicker{letter-spacing:1px;font-size:7px}.login-story-copy>p{font-size:11px}.workspace-illustration{max-width:270px;height:232px}.illustration-card{padding:13px}.illustration-card-head{gap:6px}.illustration-logo{width:27px;height:29px}.illustration-card strong{font-size:9px}.illustration-card small{font-size:8px}.illustration-row{gap:7px}.illustration-icon{width:28px;height:28px}.illustration-tag{font-size:9px;bottom:8px}.spark-one,.spark-two{display:none}.login-form-side{padding:25px 28px 21px}.login-form-wrap h2{font-size:27px}.secure-label{font-size:7px}.login-bottom>span:last-child{display:none}}@media (max-width:580px){.login-page{display:block}.login-story{display:none}.login-form-side{min-height:100dvh;padding:26px 27px 21px}.login-topline{justify-content:space-between;align-items:center}.login-mobile-brand{display:block}.login-mobile-brand .brand{font-size:22px}.login-mobile-brand .brand small{letter-spacing:1.5px;font-size:6px}.secure-label{font-size:0}.secure-label svg{color:#8da7cc;width:19px;height:19px}.login-form-wrap{max-width:390px;padding:42px 0}.login-form-wrap h2{font-size:29px}.login-emblem{margin-bottom:23px}.login-form-wrap>p{font-size:12px}.login-form{gap:21px;margin-top:29px}.login-bottom{font-size:8px}.login-bottom>span:last-child{font-size:8px;display:flex}}@media (max-height:750px) and (min-width:581px){.login-story-copy{padding-top:25px}.login-story h1{margin:14px 0 12px;font-size:33px}.workspace-illustration{height:238px;margin-top:20px}.login-form-wrap{padding:20px 0}.login-emblem{margin-bottom:19px}.login-form{gap:17px;margin-top:25px}.login-help{margin-top:22px}}@media (max-width:580px){.login-form .input-icon>input{min-height:51px;font-size:16px}.login-form label{font-size:13px}.login-form .input-icon input::placeholder{font-size:14px}.login-submit{min-height:50px;font-size:14px}.login-help{font-size:12px}.login-help p{font-size:11px}.login-bottom,.login-bottom>span:last-child{font-size:9px}}