:root{--color-bg: #f2f2f3;--color-surface: #e9e9ea;--color-text: #1d1f20;--color-accent: #5980a6;--color-accent-2: #728fab;--color-divider: color-mix(in srgb, #1d1f20 16%, transparent);--color-neutral-100: #f5f5f8;--color-neutral-200: #e7e7ea;--color-neutral-300: #d4d4d7;--color-neutral-400: #b7b7ba;--color-neutral-500: #98989b;--color-neutral-600: #7a7a7d;--color-neutral-700: #5d5d60;--color-neutral-800: #424244;--color-neutral-900: #2b2b2d;--color-accent-100: #eef6ff;--color-accent-200: #d6ebff;--color-accent-300: #b5d9fd;--color-accent-400: #94bce3;--color-accent-500: #749dc4;--color-accent-600: #597ea3;--color-accent-700: #416180;--color-accent-800: #2c455d;--color-accent-900: #1d2d3d;--color-accent-2-100: #eef6ff;--color-accent-2-200: #d6ebff;--color-accent-2-300: #bdd8f2;--color-accent-2-400: #9ebbd8;--color-accent-2-500: #7e9cb8;--color-accent-2-600: #627d98;--color-accent-2-700: #486077;--color-accent-2-800: #314457;--color-accent-2-900: #1f2d3a;--font-heading: "Barlow Condensed", system-ui, sans-serif;--font-heading-weight: 600;--font-body: "Barlow", system-ui, sans-serif;--space-1: 3.4px;--space-2: 6.8px;--space-3: 10.2px;--space-4: 13.6px;--space-6: 20.4px;--space-8: 27.2px;--radius-sm: 2px;--radius-md: 4px;--radius-lg: 7px;--shadow-sm: 0 1px 2px color-mix(in srgb, #2b2b2d 14%, transparent);--shadow-md: 0 3px 10px color-mix(in srgb, #2b2b2d 16%, transparent);--shadow-lg: 0 12px 32px color-mix(in srgb, #2b2b2d 22%, transparent)}body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-body)}h1,h2,h3,h4{font-family:var(--font-heading);font-weight:var(--font-heading-weight)}.blueprint{position:relative;border:1px solid var(--color-divider);border-radius:0}.blueprint.halftone,.blueprint.plate,.blueprint.duotone{overflow:visible}.blueprint>.corner{position:absolute;width:11px;height:11px;color:color-mix(in srgb,var(--color-text) 55%,transparent)}.blueprint>.corner:before,.blueprint>.corner:after{content:"";position:absolute;background:currentColor}.blueprint>.corner:before{left:5px;top:0;width:1px;height:100%}.blueprint>.corner:after{top:5px;left:0;width:100%;height:1px}.blueprint>.corner.tl{top:-6px;left:-6px}.blueprint>.corner.tr{top:-6px;right:-6px}.blueprint>.corner.bl{bottom:-6px;left:-6px}.blueprint>.corner.br{bottom:-6px;right:-6px}*,*:before,*:after{box-sizing:border-box}body{margin:0;font-size:15px;line-height:1.55;font-weight:400}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:var(--font-heading-weight);line-height:1.12;letter-spacing:-.015em;margin:0 0 var(--space-2)}h1{font-size:42px}h2{font-size:32px}h3{font-size:25px}h4{font-size:20px}h5{font-size:16px}h6{font-size:13px}h6{letter-spacing:.08em;text-transform:uppercase}p{margin:0 0 var(--space-3)}a{color:var(--color-accent);text-underline-offset:3px}img{display:block;max-width:100%}figure{margin:0}figcaption{font-size:11px;margin-top:var(--space-1);color:color-mix(in srgb,var(--color-text) 55%,transparent)}:focus{outline:none}::selection{background:color-mix(in srgb,var(--color-accent) 30%,transparent)}.btn-ghost{color:var(--color-accent);padding-inline:var(--space-1)}.btn-ghost:hover{background:color-mix(in srgb,var(--color-accent) 10%,transparent)}.btn-ghost:active{background:color-mix(in srgb,var(--color-accent) 18%,transparent)}.field>label{display:block;font-size:12px;margin-bottom:5px;color:color-mix(in srgb,var(--color-text) 70%,transparent)}.input{width:100%;min-height:36px;padding:6px 10px;font:inherit;font-size:14px;color:var(--color-text);caret-color:var(--color-accent);background:var(--color-surface);border:1px solid var(--color-divider);border-radius:var(--radius-md)}.input:hover{border-color:color-mix(in srgb,var(--color-text) 45%,transparent)}.input:focus-visible{border-color:var(--color-accent);outline-offset:0}textarea.input{min-height:90px;resize:vertical}.seg{display:inline-flex;overflow:hidden;border:1px solid var(--color-divider);border-radius:var(--radius-md)}.input,.seg{border-radius:0}.btn-ghost{border-color:transparent}:root{--color-bg: #f3f5f7;--color-surface: #eef2f5;--color-divider: #e3e8ec;--admin-border: #e2e8ed;--admin-border-strong: #cfd8df;--admin-ink: #192631;--admin-muted: #64727e;--admin-sidebar: #172634;--admin-sidebar-deep: #111c26;--admin-radius: 16px;--admin-radius-sm: 10px;--admin-shadow: 0 10px 30px rgba(24, 40, 55, .055);--admin-shadow-md: 0 18px 45px rgba(24, 40, 55, .12)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{-webkit-tap-highlight-color:transparent;background:var(--color-bg)}button,input,select,textarea{font-family:inherit}a{color:var(--color-accent-700)}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}::selection{background:color-mix(in srgb,var(--color-accent) 28%,transparent)}.muted{color:var(--color-neutral-700)}.shell{height:100%;display:grid;grid-template-columns:264px minmax(0,1fr);background:radial-gradient(1000px 480px at 100% -10%,#e8eff5 0,transparent 62%),var(--color-bg);color:var(--admin-ink);font-family:var(--font-body)}.sidebar{position:relative;z-index:2;display:flex;flex-direction:column;gap:4px;padding:22px 16px 16px;overflow:auto;color:#dce7ef;background:radial-gradient(420px 240px at 20% -10%,rgba(148,188,227,.2),transparent 70%),linear-gradient(180deg,var(--admin-sidebar),var(--admin-sidebar-deep));border-right:1px solid rgba(255,255,255,.06)}.sidebar-close{display:none;position:absolute;top:16px;right:12px;width:36px;height:36px;place-items:center;border:1px solid rgba(255,255,255,.14);border-radius:9px;background:#ffffff0f;color:#dce7ef;font-size:21px;line-height:1;cursor:pointer}.sidebar-close:hover{background:#ffffff1f}.brand{display:flex;align-items:center;gap:12px;padding:2px 8px 20px;color:#fff;font:600 26px var(--font-heading);letter-spacing:.005em;line-height:1.05}.brand img{width:42px;height:42px;flex:none;object-fit:cover;border-radius:11px}.brand small{display:block;margin-top:3px;color:#9ec3e3;font:500 10.5px var(--font-body);letter-spacing:.08em;text-transform:none}.nav{display:flex;flex-direction:column;gap:3px;flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;padding-right:2px}.nav-item{display:flex;align-items:center;gap:11px;flex:none;min-height:42px;padding:0 12px;border:0;border-radius:10px;background:transparent;color:#c5d4df;font:500 14.5px var(--font-body);text-align:left;cursor:pointer;transition:background .15s,color .15s}.nav-item svg{flex:none;color:#8fa8bc;transition:color .15s}.nav-item:hover{background:#fff1;color:#fff}.nav-item:hover svg{color:#c7e0f5}.nav-item.on{background:linear-gradient(90deg,#94bce333,#94bce312);color:#fff;font-weight:600;box-shadow:inset 3px 0 #94bce3}.nav-item.on svg{color:#b5d9fd}.nav-item .count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;margin-left:auto;padding:0 6px;border-radius:999px;background:#b5d9fd;color:#142534;font:600 11px var(--font-body)}.who{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:center;flex:none;margin-top:auto;padding:16px 8px 2px;border-top:1px solid rgba(255,255,255,.12)}.who-avatar{display:grid;place-items:center;width:38px;height:38px;flex:none;border:1px solid rgba(255,255,255,.14);border-radius:10px;background:#94bce324;color:#d8ebfb;font:600 16px var(--font-heading)}.who-name{overflow-wrap:anywhere;color:#fff;font-size:13.5px;font-weight:600}.who-role{margin-top:1px;color:#8fa8bc;font-size:11.5px}.logout-btn{grid-column:1 / -1;justify-self:start;display:flex;align-items:center;gap:7px;min-height:32px;margin:2px 0 0 -6px;padding:0 7px;border:0;border-radius:8px;background:transparent;color:#9ec3e3;font:500 13px var(--font-body);cursor:pointer}.logout-btn:hover{background:#ffffff14;color:#fff}.main{min-width:0;display:flex;flex-direction:column;overflow:auto}.topbar{display:none;align-items:center;gap:11px;flex:none;height:60px;padding:0 16px;border-bottom:1px solid var(--admin-border);background:#ffffffeb;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:sticky;top:0;z-index:20}.topbar .burger{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--admin-border);border-radius:11px;background:#fff;color:var(--admin-ink);cursor:pointer}.topbar .burger:hover{background:var(--color-accent-100);border-color:var(--color-accent-200)}.topbar b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 23px var(--font-heading);letter-spacing:-.01em}.page{width:100%;max-width:1320px;margin:0 auto;padding:32px 36px 56px}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;margin-bottom:22px}.page-head>div:first-child{min-width:0}.page-head h1{margin:0;font-size:clamp(36px,4vw,44px);line-height:1;letter-spacing:-.02em}.page-head p{max-width:72ch;margin:7px 0 0;color:var(--color-neutral-700);font-size:14px;line-height:1.5}.page-head>.toolbar{flex:1 1 520px;justify-content:flex-end;margin:0}.scrim{display:none}.btn-solid{min-height:42px;padding:0 18px;border:0;border-radius:10px;background:var(--color-accent-700);color:#fff;font:600 14.5px var(--font-body);letter-spacing:0;cursor:pointer;box-shadow:0 7px 16px color-mix(in srgb,var(--color-accent-900) 18%,transparent);transition:background .15s,box-shadow .15s,transform .1s}.btn-solid:hover{background:var(--color-accent-800);box-shadow:0 9px 20px color-mix(in srgb,var(--color-accent-900) 22%,transparent)}.btn-solid:active{transform:translateY(1px)}.btn-outline{min-height:40px;padding:0 14px;border:1px solid var(--admin-border-strong);border-radius:10px;background:#fff;color:var(--color-accent-800);font:600 14px var(--font-body);letter-spacing:0;cursor:pointer;transition:background .15s,border-color .15s,color .15s}.btn-outline:hover{background:var(--color-accent-100);border-color:var(--color-accent-300);color:var(--color-accent-900)}.btn-ghost{min-height:34px;padding:0 8px;border:0;border-radius:8px;background:transparent;color:var(--color-accent-700);font:500 13.5px var(--font-body);cursor:pointer}.btn-ghost:hover{background:var(--color-accent-100);color:var(--color-accent-800)}button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;transform:none}.btn-sm{min-height:32px;padding:0 9px;font-size:13px}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:15px;min-width:0}.field label{color:var(--color-neutral-800);font-size:13px;font-weight:600}.input,.select{width:100%;height:44px;padding:0 12px;border:1px solid var(--admin-border-strong);border-radius:10px;background:#fbfcfd;color:var(--color-text);font:400 15px var(--font-body);outline:none;transition:border-color .15s,box-shadow .15s,background .15s}.input:hover,.select:hover{border-color:var(--color-neutral-400)}.input:focus,.select:focus{border-color:var(--color-accent);background:#fff;box-shadow:0 0 0 3px color-mix(in srgb,var(--color-accent) 18%,transparent)}.input:disabled,.select:disabled{background:var(--color-neutral-100);color:var(--color-neutral-700)}textarea.input{height:auto;min-height:96px;padding:10px 12px;resize:vertical;line-height:1.5}input[type=checkbox]{width:17px;height:17px;margin:0;accent-color:var(--color-accent-700)}.check{display:flex;align-items:flex-start;gap:10px;margin-bottom:14px;color:var(--color-neutral-800);font-size:14px;line-height:1.45}.check input{flex:none;margin-top:2px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.err{min-height:18px;margin:2px 0 10px;color:#a32323;font-size:13px;line-height:1.45}.err:empty{display:none}.panel{position:relative;border:1px solid var(--admin-border);border-radius:var(--admin-radius);background:#fff;box-shadow:var(--admin-shadow);overflow:hidden}.table-wrap{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}table.t{width:100%;border-collapse:collapse;color:var(--admin-ink);font-size:14px}table.t th{padding:12px 16px;border-bottom:1px solid var(--color-neutral-200);background:#f8fafb;color:var(--color-neutral-700);font:600 12.5px var(--font-body);letter-spacing:.01em;text-align:left;text-transform:none;white-space:nowrap}table.t td{padding:13px 16px;border-bottom:1px solid #edf1f3;vertical-align:middle}table.t tbody tr{transition:background .12s}table.t tbody tr:hover td{background:#f7fafc}table.t tr:last-child td{border-bottom:0}table.t th:first-child{border-top-left-radius:15px}table.t th:last-child{border-top-right-radius:15px}.click-row{cursor:pointer}.actions{display:flex;align-items:center;gap:3px;flex-wrap:wrap;justify-content:flex-end}.empty{padding:34px 20px;color:var(--color-neutral-700);font-size:14px;text-align:center}details>summary{color:var(--color-accent-800);font-weight:600;cursor:pointer}details[open]>summary{margin-bottom:8px}.note{color:var(--color-neutral-700);font-size:13px;line-height:1.5}.badge{display:inline-flex;align-items:center;padding:4px 9px;border:1px solid transparent;border-radius:999px;font:600 11.5px var(--font-body);letter-spacing:.01em;line-height:1.3;white-space:nowrap}.badge.hadir,.badge.disetujui{background:#e5f3ec;border-color:#c9e8da;color:#276451}.badge.terlambat,.badge.menunggu{background:#fdf2de;border-color:#f2dfb8;color:#8b5a12}.badge.izin{background:#e8f1fa;border-color:#cfe1f2;color:#2f5b7f}.badge.sakit{background:#f1edf8;border-color:#e0d6ef;color:#5a477b}.badge.alpa,.badge.ditolak{background:#fbe9e9;border-color:#f1cccc;color:#933b3b}.badge.belum,.badge.terjadwal{background:#eef2f5;border-color:#dfe6ec;color:#586772}.badge.batal,.badge.dibatalkan{background:#e9edf0;border-color:#d7dfe5;color:#4a5863}.status-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:999px;font:600 11.5px var(--font-body);white-space:nowrap}.status-pill:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.status-pill.on{background:#e5f3ec;color:#276451}.status-pill.off{background:#eef2f5;color:#586772}.status-pill.warn{background:#fdf2de;color:#8b5a12}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:24px}.stats>div{position:relative;padding:16px 18px;border:1px solid var(--admin-border);border-radius:14px;background:#fff;box-shadow:0 6px 18px #1828370b;overflow:hidden}.stats>div:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(180deg,var(--color-accent-300),var(--color-accent-600))}.stats b{display:block;font:600 38px var(--font-heading);line-height:1;letter-spacing:-.01em}.stats span{display:block;margin-top:5px;color:var(--color-neutral-700);font-size:12.5px;line-height:1.35}.toolbar{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;margin-bottom:16px}.toolbar .input,.toolbar .select{width:auto;min-width:150px}.toolbar label{display:grid;gap:6px;color:var(--color-neutral-700);font-size:12px;font-weight:600}.toolbar label:has(input[type=checkbox]){display:flex;align-items:center;gap:8px;min-height:42px;color:var(--color-neutral-800);font-size:13.5px;font-weight:500;white-space:nowrap}.toolbar label.input{display:block}.seg{display:inline-flex;gap:3px;padding:3px;border:1px solid var(--admin-border);border-radius:11px;background:#eef2f5;vertical-align:middle}.seg button{min-height:34px;padding:0 14px;border:0;border-radius:8px;background:transparent;color:var(--color-neutral-700);font:600 13px var(--font-body);letter-spacing:0;cursor:pointer;transition:background .15s,color .15s,box-shadow .15s}.seg button:hover{background:#ffffffb3;color:var(--color-accent-800)}.seg button.on{background:var(--color-accent-900);color:#fff;box-shadow:0 3px 10px #1d2d3d2e}.seg.period-nav{background:#fff;border-color:var(--admin-border-strong)}.seg.period-nav button{font-size:13px}.seg.period-nav button.on{background:var(--color-accent-100);color:var(--color-accent-900);box-shadow:none}.period-current{min-width:210px!important;cursor:default!important}.inline-note{margin:0 0 16px;padding:12px 14px;border:1px solid var(--color-accent-200);border-radius:10px;background:var(--color-accent-100);color:var(--color-accent-900);font-size:13.5px;line-height:1.5}.notice-card{display:flex;align-items:center;gap:13px;padding:16px 18px;margin-bottom:20px;border-left:3px solid var(--color-accent-500);background:linear-gradient(90deg,var(--color-accent-100),#fff)}.notice-card b{font:600 27px var(--font-heading);line-height:1}.notice-card .btn-outline{margin-left:auto;flex:none}.notice-card.error{border-left-color:#b04141;background:linear-gradient(90deg,#fdf1f1,#fff)}.dlg-back{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;align-items:flex-start;justify-content:center;overflow:auto;padding:40px 16px;background:#121e2975;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.dlg{position:relative;width:100%;max-width:560px;max-height:calc(100dvh - 80px);padding:26px;overflow:auto;border:1px solid var(--admin-border);border-radius:18px;background:#fff;box-shadow:0 26px 70px #0f1d294d}.dlg h2{margin:0 38px 18px 0;font-size:30px;line-height:1.08;letter-spacing:-.01em;overflow-wrap:anywhere}.dlg h3{margin:0 0 8px;font-size:21px}.dlg p{margin:0 0 12px;font-size:14px;line-height:1.55}.dlg ul{margin:0 0 12px;padding-left:20px;font-size:14px;line-height:1.6}.dlg-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;margin-top:18px}.dlg img{display:block;max-width:100%;max-height:66vh;margin:0 auto 8px;border:1px solid var(--admin-border);border-radius:12px;object-fit:contain}.dlg-close{position:absolute;top:16px;right:16px;display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--admin-border);border-radius:10px;background:#fff;color:var(--color-neutral-700);font-size:20px;line-height:1;cursor:pointer;z-index:1}.dlg-close:hover{background:var(--color-accent-100);color:var(--color-accent-900)}.dlg:has(table.t){width:min(1000px,calc(100vw - 32px));max-width:1000px}.dlg>.employee-identity,.dlg form>.employee-identity{margin:2px 0 12px}.toast{position:fixed;left:50%;bottom:24px;z-index:60;max-width:calc(100% - 32px);padding:12px 18px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:var(--admin-sidebar);color:#fff;font-size:14px;line-height:1.4;box-shadow:var(--admin-shadow-md);transform:translate(-50%)}.center{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;height:100%;padding:24px;color:var(--color-neutral-700);text-align:center}.demo-badge{position:fixed;right:12px;bottom:8px;z-index:5;padding:3px 8px;border:1px solid var(--admin-border);border-radius:999px;background:#ffffffeb;color:var(--color-neutral-700);font:600 10px var(--font-body);letter-spacing:.04em;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.login-wrap{min-height:100%;display:grid;place-items:center;padding:28px;background:radial-gradient(900px 500px at 10% 0,#e7eff6 0,transparent 58%),radial-gradient(700px 500px at 100% 100%,#e9eef2 0,transparent 55%),var(--color-bg);color:var(--admin-ink);font-family:var(--font-body)}.login-card{position:relative;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1fr);width:100%;max-width:920px;overflow:hidden;border:1px solid var(--admin-border);border-radius:24px;background:#fff;box-shadow:0 30px 85px #14243233}.login-aside{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:34px;overflow:hidden;background:radial-gradient(420px 280px at 10% 0,rgba(148,188,227,.22),transparent 65%),linear-gradient(150deg,#1d2d3d,#14212c 76%);color:#fff}.login-aside:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:repeating-linear-gradient(0deg,transparent 0 47px,rgba(255,255,255,.045) 47px 48px),repeating-linear-gradient(90deg,transparent 0 47px,rgba(255,255,255,.045) 47px 48px);pointer-events:none}.login-aside>*{position:relative;z-index:1}.login-aside .brand{padding:0;color:#fff}.login-aside .brand img{width:48px;height:48px;border-radius:12px}.login-aside .brand small{color:#9ec3e3;letter-spacing:.06em}.login-aside-copy{margin-top:auto;padding-top:56px}.login-aside-copy .eyebrow{color:#9ec3e3}.login-aside-copy h2{margin:10px 0 12px;color:#fff;font-size:43px;line-height:1.02;letter-spacing:-.02em}.login-aside-copy p{max-width:30ch;margin:0;color:#c5d4e0;font-size:14.5px;line-height:1.6}.login-aside-note{margin-top:28px;padding-top:18px;border-top:1px solid rgba(255,255,255,.13);color:#9db1c2;font-size:12px;line-height:1.5}.login-main{display:flex;flex-direction:column;justify-content:center;padding:42px 38px}.login-mobile-brand{display:none;align-items:center;gap:10px;margin-bottom:26px}.login-mobile-brand img{width:38px;height:38px;border-radius:10px;object-fit:cover}.login-mobile-brand b{color:var(--admin-ink);font:600 22px var(--font-heading);line-height:1.05}.login-main h1{margin:0 0 6px;font-size:41px;line-height:1;letter-spacing:-.02em}.login-sub{margin:0 0 26px;color:var(--color-neutral-700);font-size:14.5px;line-height:1.5}.login-main .field{margin-bottom:16px}.login-main .input{height:48px;background:#f8fafb}.login-main .err{margin:-2px 0 10px}.login-submit{width:100%;min-height:50px;margin-top:4px;border-radius:11px;font-size:15px}.eyebrow{color:var(--color-accent-700);font:600 11px var(--font-body);letter-spacing:.12em;text-transform:uppercase}.pw-wrap{position:relative;display:flex}.pw-wrap .input{width:100%;padding-right:54px}.pw-eye{position:absolute;top:0;right:0;display:grid;place-items:center;width:48px;height:100%;border:0;border-radius:10px;background:none;color:var(--color-neutral-700);cursor:pointer}.pw-eye:hover,.pw-eye:focus-visible{color:var(--color-accent-800);background:var(--color-accent-100)}.install{margin-top:14px}.install-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:44px;border-radius:10px;font:600 14px var(--font-body)}.install-help{margin:10px 0 0;color:var(--color-neutral-700);font-size:12.5px;line-height:1.5}.chart-filters{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:24px;padding:18px}.chart-filters label{display:grid;gap:6px;flex:1;min-width:150px;color:var(--color-neutral-700);font-size:12px;font-weight:600}.chart-heading{margin:30px 0 12px;padding-left:12px;border-left:3px solid var(--color-accent-300);font-size:clamp(25px,2.6vw,31px);line-height:1.08}.chart-panel{min-width:0;margin-bottom:20px;padding:22px}.chart-panel h3{margin:0 0 16px;font-size:23px}.chart-panel>p{max-width:80ch;font-size:13.5px;line-height:1.55}.chart-panel svg{display:block;width:100%}.charts-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:18px;margin:18px 0}.trend-chart{color:var(--color-neutral-500)}.composition{display:flex;align-items:center;flex-wrap:wrap;gap:16px}.composition svg{width:140px;flex:0 0 140px}.chart-legend{flex:1;min-width:140px;margin:0;padding:0;list-style:none}.chart-legend li{display:flex;justify-content:space-between;gap:14px;padding:4px 0;font-size:13px}.chart-legend i,.trend-legend i{display:inline-block;width:9px;height:9px;margin-right:7px;border-radius:2px}.trend-legend{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:10px;font-size:12px}.store-rate{margin:20px 0}.store-rate>div:first-child{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13.5px}.rate-track{height:10px;margin-top:7px;overflow:hidden;border-radius:999px;background:#e9eef2}.rate-track>div{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--color-accent-500),var(--color-accent-700))}.cell-note{display:block;margin-top:3px;color:var(--color-neutral-700);font-size:11.5px;line-height:1.35}.sched-wrap{max-height:calc(100vh - 300px);max-height:calc(100dvh - 300px);overflow:auto;-webkit-overflow-scrolling:touch}table.sched{min-width:max-content;border-collapse:separate;border-spacing:0;font-size:12.5px}table.sched th,table.sched td{padding:0;border-right:1px solid #edf1f3;border-bottom:1px solid #edf1f3;background:#fff;text-align:center}table.sched thead th{position:sticky;top:0;z-index:2;min-width:42px;padding:7px 0;background:#f8fafb;color:var(--color-neutral-700);font-weight:600}table.sched thead th small{display:block;color:var(--color-neutral-700);font-size:10.5px;font-weight:400}table.sched thead th.today{background:var(--color-accent-200);color:var(--color-accent-900)}table.sched th.name,table.sched td.name{position:sticky;left:0;z-index:3;min-width:170px;max-width:170px;padding:0 12px;overflow:hidden;background:#fff;font-weight:500;text-align:left;white-space:nowrap;text-overflow:ellipsis}table.sched thead th.name{z-index:4;background:#f8fafb}table.sched td.wk{background:#f7f9fb}table.sched .employee-avatar{width:28px;height:28px;flex-basis:28px;border-radius:8px;font-size:12px}table.sched .employee-identity{display:flex;max-width:100%;gap:8px}table.sched .employee-name{display:block;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.cell{width:34px;height:34px;margin:3px;border:0;border-radius:7px;background:transparent;color:var(--color-neutral-700);font:600 16px var(--font-heading);cursor:pointer;transition:box-shadow .12s,transform .1s}.cell:hover{box-shadow:inset 0 0 0 2px var(--color-accent)}.cell:active{transform:scale(.96)}.cell.c-P{background:var(--color-accent-200);color:var(--color-accent-900)}.cell.c-S{background:var(--color-accent-900);color:#fff}.cell.c-L{background:var(--color-neutral-100);color:var(--color-neutral-500)}.cell.c-X{background:var(--color-accent-500);color:#fff}.legend{display:flex;gap:12px 18px;flex-wrap:wrap;margin:14px 0 0;color:var(--color-neutral-700);font-size:12.5px;line-height:1.5}.legend i{display:inline-block;width:14px;height:14px;margin-right:6px;vertical-align:-2px;border-radius:4px}.legend .cell{margin:0;vertical-align:-3px}.org-grid{display:grid;grid-template-columns:minmax(240px,320px) minmax(0,1fr);gap:20px;align-items:start}.org-stores,.org-detail,.org-notice{min-width:0;padding:22px}.org-stores h2,.org-detail h2{margin:0 0 14px;font-size:26px;overflow-wrap:anywhere}.org-stores small{color:var(--color-neutral-700);font-size:14px}.org-store-list{display:grid;gap:6px;margin-top:14px}.org-store{padding:12px 14px;overflow-wrap:anywhere;border:1px solid var(--admin-border);border-radius:11px;background:#fbfcfd;color:inherit;font:inherit;text-align:left;cursor:pointer;transition:background .15s,border-color .15s,box-shadow .15s}.org-store:hover{border-color:var(--color-accent-200);background:var(--color-accent-100)}.org-store.selected{border-color:var(--color-accent-400);background:var(--color-accent-100);box-shadow:inset 3px 0 0 var(--color-accent-600)}.org-store b{font-size:14px;font-weight:600}.org-store span{display:block;margin-top:5px;color:var(--color-neutral-700);font-size:12px}.org-detail-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.org-detail-head h3{margin:2px 0 12px;font-size:21px}.org-notice{margin-bottom:20px}.org-notice p{font-size:13.5px}.agenda-targets{max-height:220px;padding:10px;overflow-y:auto;border:1px solid var(--admin-border);border-radius:10px;background:#fbfcfd}.agenda-targets .check{margin:0;padding:4px 2px}.access-card{max-width:920px;padding:24px}.access-intro h2{margin:2px 0 4px;font-size:27px}.access-intro p{margin:0 0 14px;color:var(--color-neutral-700);font-size:13.5px;line-height:1.55}.permission-box{margin:18px 0;padding:8px 18px 16px;border:1px solid var(--admin-border);border-radius:12px}.permission-box legend{padding:0 8px;color:var(--color-neutral-800);font:600 13px var(--font-body)}.permission-group h3{margin:14px 0 2px;color:var(--color-accent-900);font:600 15px var(--font-body)}.permission-row{display:flex;align-items:flex-start;gap:10px;padding:9px 0;border-bottom:1px solid #f0f3f5;color:var(--color-neutral-800);font-size:14px;line-height:1.45;cursor:pointer}.permission-row:last-child{border-bottom:0}.permission-row input{flex:none;margin-top:2px}.legacy-box{margin:14px 0;padding:14px;border:1px solid var(--color-accent-200);border-radius:12px;background:var(--color-accent-100)}.legacy-box b{font-size:14px}.legacy-box p{margin:4px 0;font-size:13px;line-height:1.5}.access-actions{justify-content:flex-start;margin-top:18px}.access-meta{color:var(--color-neutral-700);font-size:12.5px;line-height:1.55}.settings-panel{margin-bottom:20px;padding:22px}.settings-panel h2{margin:0 0 10px;font-size:26px}.settings-panel>p{max-width:85ch;font-size:13.5px;line-height:1.55}.settings-heading{margin:28px 0 12px;font-size:28px}.settings-table{margin-bottom:28px}.support-input{max-width:430px;width:100%;margin:8px 0}.check-row{display:flex;align-items:flex-start;gap:9px;margin:8px 0 14px;color:var(--color-neutral-800);font-size:13px;line-height:1.5}.check-row input{flex:none;margin-top:3px}.support-settings label{display:block;color:var(--color-neutral-800);font-size:13px;font-weight:600}.guide{margin:0;padding:8px 22px;list-style:none}.guide-step{display:flex;align-items:flex-start;gap:14px;padding:16px 0;border-top:1px solid var(--color-neutral-100)}.guide-step:first-child{border-top:0}.guide-num{display:grid;place-items:center;width:30px;height:30px;flex:none;border-radius:9px;background:var(--color-accent-100);color:var(--color-accent-800);font:600 15px var(--font-heading)}.guide-num.done{background:#317866;color:#fff}.guide-body{flex:1;min-width:0}.guide-body b{font-size:15px}.guide-body p{margin:4px 0 9px;font-size:13.5px;line-height:1.5}.guide-body .btn-outline{margin-top:2px}.employee-identity{display:inline-flex;align-items:center;gap:10px;max-width:100%;vertical-align:middle;text-align:left}.employee-avatar{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;flex:0 0 34px;overflow:hidden;border-radius:9px;background:var(--color-accent-100);color:var(--color-accent-900);font:600 15px var(--font-heading)}.employee-avatar:before{content:attr(data-initials)}.employee-avatar img{display:block;width:100%;height:100%;object-fit:cover}.employee-name{min-width:0;overflow-wrap:anywhere}.employee-pair{display:inline-flex;flex-wrap:wrap;align-items:center;gap:10px}.employee-target-list{display:flex;flex-direction:column;gap:6px}.employee-photo-error{padding:10px 14px;margin-bottom:12px;border:1px solid var(--color-accent-200);border-radius:10px;background:var(--color-accent-100)}.t .employee-identity{min-width:150px}.t .employee-name{max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.audit-filter{margin-bottom:14px}.audit-filter .input{min-width:140px}.audit-table{table-layout:fixed}.audit-table th,.audit-table td{padding-left:10px;padding-right:10px}.audit-table th:nth-child(1){width:14%}.audit-table th:nth-child(2){width:10%}.audit-table th:nth-child(3){width:13%}.audit-table th:nth-child(4){width:17%}.audit-table th:nth-child(5){width:13%}.audit-table th:nth-child(6){width:20%}.audit-table th:nth-child(7){width:13%}.audit-table td{overflow:hidden}.audit-summary{max-width:360px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--color-neutral-700)}.audit-table .audit-summary{max-width:none}.audit-detail-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;margin:0 0 16px}.audit-detail-meta>div{min-width:0}.audit-detail-meta dt{color:var(--color-neutral-700);font-size:12px;font-weight:600}.audit-detail-meta dd{margin:2px 0 0;overflow-wrap:anywhere}.audit-detail{max-height:46vh;overflow:auto;margin:0;padding:14px;border:1px solid var(--admin-border);border-radius:10px;background:#f8fafb;color:var(--admin-ink);font:12.5px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}.system-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:24px}.system-card{padding:20px}.system-card h2{margin:0;font-size:22px}.system-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px}.system-value{display:block;margin:4px 0;font:600 27px var(--font-heading);line-height:1.15;overflow-wrap:anywhere}.system-card .btn-outline{margin-top:8px}.system-file{margin:0;color:var(--color-neutral-700);font-size:12.5px;overflow-wrap:anywhere}@media(pointer:coarse){.btn-sm,.btn-ghost{min-height:40px}.btn-outline{min-height:42px}}@media(max-width:1100px){.charts-grid{grid-template-columns:minmax(0,1fr)}.page-head>.toolbar{flex-basis:100%;justify-content:flex-start}}@media(max-width:899px){.shell{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}.topbar{display:flex}.sidebar{position:fixed;inset:0 auto 0 0;z-index:40;width:284px;transform:translate(-102%);transition:transform .22s ease;box-shadow:22px 0 60px #0a141e4d}.sidebar-close{display:grid}.shell.open .sidebar{transform:none}.shell.open .scrim{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;background:#101c2775;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.page{padding:22px 20px 48px}.page-head h1{font-size:36px}.org-grid{grid-template-columns:minmax(0,1fr)}.sched-wrap{max-height:calc(100vh - 260px);max-height:calc(100dvh - 260px)}}@media(max-width:820px){.login-wrap{padding:16px}.login-card{grid-template-columns:minmax(0,1fr);max-width:480px;border-radius:20px}.login-aside{display:none}.login-main{padding:30px 26px}.login-mobile-brand{display:flex}.login-main h1{font-size:35px}.login-sub{margin-bottom:22px}}@media(max-width:700px){.page{padding:18px 16px 42px}.page-head{margin-bottom:18px}.page-head h1{font-size:33px}.page-head p{font-size:13.5px}.page-head>.toolbar{align-items:flex-end;gap:8px}.page-head>.toolbar label{flex:1 1 140px}.page-head>.toolbar .input,.page-head>.toolbar .select{width:100%;min-width:0}.page-head>.toolbar button{flex:0 0 auto}.chart-filters{gap:10px;padding:14px}.chart-heading{margin-top:24px}.stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.stats>div{padding:14px}.stats b{font-size:32px}.seg{max-width:100%;flex-wrap:wrap}.period-current{min-width:160px!important}.notice-card{align-items:flex-start;flex-wrap:wrap}.notice-card .btn-outline{margin-left:0}.dlg-back{padding:12px}.dlg{max-height:calc(100dvh - 24px);padding:20px;border-radius:16px}.dlg h2{margin-right:38px;font-size:26px}.dlg-actions{gap:8px}.dlg-actions button{flex:1 1 auto}.org-stores,.org-detail,.org-notice,.chart-panel,.settings-panel,.access-card{padding:17px}.guide{padding:4px 17px}table.t.stack{display:block}table.t.stack thead{display:none}table.t.stack tbody,table.t.stack tr{display:block;width:100%}table.t.stack tr{padding:10px 14px;border-bottom:1px solid var(--color-neutral-200)}table.t.stack tr:last-child{border-bottom:0}table.t.stack td{display:grid;grid-template-columns:minmax(88px,34%) minmax(0,1fr);align-items:start;gap:4px 14px;min-width:0;padding:5px 0;border:0}table.t.stack td:before{content:attr(data-l);grid-column:1;padding-top:2px;color:var(--color-neutral-700);font-size:12px;font-weight:600}table.t.stack td>*{grid-column:2;min-width:0}table.t.stack td>p{margin:0}table.t.stack td>.employee-identity{max-width:100%}table.t.stack td>.badge,table.t.stack td>.status-pill,table.t.stack td>.seg{justify-self:start}table.t.stack td>.btn-ghost{justify-self:start}table.t.stack td.actions-cell{display:flex;justify-content:flex-end;padding-top:8px}table.t.stack td.actions-cell:before{content:none}table.t.stack td.actions-cell .actions{justify-content:flex-end;width:100%}table.t.stack tr:hover td{background:transparent}table.t.stack .employee-name,.t .employee-name{max-width:none;white-space:normal;overflow:visible;text-overflow:clip}.employee-identity{max-width:100%}}@media(max-width:560px){.form-grid{grid-template-columns:minmax(0,1fr)}table.sched th.name,table.sched td.name{min-width:132px;max-width:132px;padding:0 8px;font-size:12px}table.sched thead th{min-width:36px}.cell{width:32px;height:36px;margin:2px}.topbar{height:56px}.topbar b{font-size:21px}.login-main{padding:26px 22px}.login-main h1{font-size:32px}.dlg-actions button{width:100%;flex-basis:100%}.actions .btn-ghost,.actions .btn-outline,.actions .btn-solid{flex:0 1 auto}}@media(max-width:380px){.page{padding:16px 12px 38px}.login-main{padding:22px 18px}.brand{font-size:23px}}@media(max-width:1100px){.system-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.audit-filter{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:end}.audit-filter label{min-width:0}.audit-filter label:nth-of-type(5){grid-column:1 / -1}.audit-filter .input,.audit-filter .select{width:100%;min-width:0}.audit-filter button{width:100%}.audit-table td{overflow:visible}.audit-summary{max-width:none;white-space:normal}.audit-detail-meta{grid-template-columns:1fr;gap:8px}.system-grid{grid-template-columns:1fr}.system-card{padding:17px}}.payroll-toolbar{align-items:center}.payroll-period{display:flex;align-items:center;gap:8px;padding:6px 8px;border:1px solid var(--admin-border);border-radius:var(--admin-radius);background:var(--color-surface)}.payroll-period>div{min-width:190px;text-align:center}.payroll-period b{display:block;font:600 14px var(--font-heading)}.payroll-period span{display:block;margin-top:2px;color:var(--color-neutral-700);font-size:11.5px}.payroll-period .btn-ghost{min-width:32px;padding:2px 8px;font-size:22px;line-height:1}.payroll-locked{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 16px;padding:11px 14px;border:1px solid var(--admin-border);border-radius:var(--admin-radius);background:var(--color-surface);color:var(--color-neutral-700);font-size:13px}.payroll-rules{margin-bottom:16px;padding:22px}.payroll-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}.payroll-section-head h2{margin:0 0 6px;font-size:25px}.payroll-section-head p{max-width:80ch;margin:0;color:var(--color-neutral-700);font-size:13px;line-height:1.5}.payroll-rule-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;align-items:end;gap:12px}.payroll-rule-grid .input{width:100%}.payroll-stats{margin-bottom:16px}.payroll-stats b{font-size:clamp(22px,2.3vw,32px)}.payroll-alert{margin:0 0 16px;padding:14px 18px;border:1px solid var(--admin-border);border-left:4px solid var(--color-accent-700);border-radius:var(--admin-radius);background:var(--color-surface);font-size:13px}.payroll-alert.warn{border-left-color:#b7791f;background:#fdf8ee}.payroll-alert b{display:block;margin-bottom:5px;font-size:13px}.payroll-alert ul{margin:0;padding-left:20px;color:var(--color-neutral-700);line-height:1.55}.payroll-alert li+li{margin-top:3px}.payroll-table small{display:block;margin-top:3px;font-size:11.5px}.payroll-table td b{white-space:nowrap}.payroll-detail{max-height:58vh;overflow:auto;margin-top:12px}.payroll-detail table{min-width:560px}.payroll-adjust-note{display:grid;gap:4px;margin:0 0 12px;padding:11px 14px;border-left:3px solid #b7791f;background:#fdf8ee;color:#6b4d12;font-size:12.5px;line-height:1.5}.payroll-edit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.payroll-edit-grid .input{width:100%}@media(max-width:900px){.payroll-rule-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.payroll-rule-grid button{grid-column:1 / -1;width:100%}}@media(max-width:700px){.payroll-section-head{display:block}.payroll-section-head>.muted{display:block;margin-top:8px}.payroll-rule-grid,.payroll-edit-grid{grid-template-columns:1fr}.payroll-toolbar{display:flex;width:100%}.payroll-period{flex:1 1 100%;justify-content:space-between}.payroll-period>div{min-width:0;flex:1}.payroll-toolbar>.btn-outline,.payroll-toolbar>.btn-solid{flex:1 1 auto}}