@font-face{font-family:'Noto Sans Thai';src:url('/assets/fonts/NotoSansThai-Regular.ttf') format('truetype');font-weight:400 500;font-display:swap}@font-face{font-family:'Noto Sans Thai';src:url('/assets/fonts/NotoSansThai-Bold.ttf') format('truetype');font-weight:600 700;font-display:swap}
:root{--bg:#f7f7f6;--surface:#fff;--ink:#252a2e;--muted:var(--brand-text,#0865c9);--line:#e4e4e0;--blue:var(--brand-text,#0865c9);--soft:#f7f7f6;--green:#14764c;--red:#b42332;--radius:18px;font-family:'Noto Sans Thai',system-ui,sans-serif;color:var(--ink);background:var(--bg);font-size:16px;line-height:1.6}*{box-sizing:border-box}body{margin:0}a{color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}button,input,select,textarea{font:inherit}button,.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:10px;background:var(--blue);color:white;padding:10px 16px;min-height:44px;font-weight:600;cursor:pointer;text-decoration:none}button:hover,.button:hover{filter:brightness(.94);text-decoration:none}button:disabled{opacity:.55;cursor:wait}.secondary{color:var(--ink);background:#fff;border-color:var(--line)}.danger{background:var(--red)}.small{padding:6px 12px;min-height:36px;font-size:16px}:focus-visible{outline:3px solid var(--brand-text,#0865c9);outline-offset:3px}input,select,textarea{width:100%;border:1px solid #adafaa;border-radius:9px;background:white;padding:10px 12px;color:var(--ink);min-height:44px}input[type=checkbox],input[type=radio]{width:18px;min-height:18px;accent-color:var(--blue)}textarea{min-height:108px;resize:vertical}label{display:grid;gap:6px;color:#252a2e;font-weight:500}label small,small,.muted{color:var(--muted);font-weight:400}h1,h2,h3,p{margin:0}h1{font-size:30px;letter-spacing:-.8px;font-weight:700}h2{font-size:22px;letter-spacing:-.3px}h3{font-size:20px}.app{display:grid;grid-template-columns:244px minmax(0,1fr);min-height:100vh}.sidebar{background:#fff;border-right:1px solid var(--line);padding:28px 18px;position:fixed;inset:0 auto 0 0;width:244px;overflow:auto}.brand{display:flex;gap:12px;align-items:center;color:var(--ink);font-size:21px;font-weight:700;letter-spacing:-.7px;padding:0 10px 24px}.brand-mark{width:38px;height:38px;background:#252a2e;color:white;border-radius:12px;display:grid;place-items:center;font-size:20px}.version{font-size:16px;letter-spacing:1px;color:var(--muted);font-weight:600}.nav-label{font-size:16px;color:var(--brand-text,#0865c9);padding:20px 12px 7px;letter-spacing:.7px}.nav-link{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:9px;color:var(--brand-text,#0865c9);font-weight:500;margin:2px 0}.nav-link:hover{background:var(--bg);text-decoration:none}.nav-link.active{background:var(--soft);color:var(--blue);font-weight:700}.nav-icon{font-size:17px;width:22px;text-align:center}.workspace{grid-column:2;min-width:0}.topbar{display:flex;justify-content:space-between;gap:20px;align-items:center;height:76px;padding:0 40px;background:#ffffffcf;border-bottom:1px solid var(--line);backdrop-filter:blur(20px)}.topbar .who{display:flex;align-items:center;gap:12px}.avatar{background:#f7f7f6;color:#252a2e;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:600}.env{font-size:16px;color:#734d0b;background:#fff4d6;border:1px solid #eedbab;border-radius:6px;padding:3px 8px}main{max-width:1480px;padding:32px 40px 72px;margin:auto}.pagehead{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:26px}.eyebrow{font-size:16px;color:var(--blue);letter-spacing:1.4px;font-weight:700;margin-bottom:8px}.subtitle{margin-top:6px;color:var(--muted)}.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.between{justify-content:space-between}.card{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:24px;margin-bottom:20px;box-shadow:0 3px 12px #44444404}.grid{display:grid;gap:20px;grid-template-columns:repeat(2,minmax(0,1fr))}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:24px}.stat{background:white;border:1px solid var(--line);border-radius:16px;padding:22px}.stat .value{font-size:32px;font-weight:600;letter-spacing:-1px;line-height:1.5;margin:8px 0}.stat .label{color:var(--muted);font-size:16px}.stat small{font-size:16px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.full{grid-column:1/-1}.form-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:24px}.table-wrap{overflow:auto;margin-top:18px}table{width:100%;border-collapse:collapse;font-size:16px;white-space:nowrap}th{text-align:left;font-size:16px;font-weight:500;color:var(--brand-text,#0865c9);padding:13px 12px;background:#f7f7f6;border-bottom:1px solid var(--line)}td{padding:15px 12px;border-bottom:1px solid #f7f7f6;vertical-align:middle}tr:last-child td{border-bottom:0}tbody tr:hover{background:#f7f7f6}.num{text-align:right;font-variant-numeric:tabular-nums}.badge{display:inline-block;font-size:16px;font-weight:600;border-radius:6px;background:#f7f7f6;color:var(--brand-text,#0865c9);padding:3px 8px}.badge.green{color:#136440;background:#e8f5ee}.badge.amber{color:#805409;background:#fff4d9}.badge.red{color:#a32231;background:#fdecee}.notice{padding:15px 18px;background:#f7f7f6;border:1px solid #e4e4e0;border-radius:12px;margin:18px 0;color:var(--brand-text,#0865c9)}.notice.error{background:#fff0f1;border-color:#efc2c8;color:#982131}.notice.success{background:#ecf8f1;border-color:#bce2cc;color:#18613a}.empty{padding:50px 20px;text-align:center;color:var(--muted)}.filters{display:flex;align-items:end;gap:12px;flex-wrap:wrap}.filters label{flex:1;min-width:130px}.filters button{flex-shrink:0}.section-title{margin-bottom:18px}.timeline{display:grid;gap:14px;margin-top:20px}.timeline-item{padding:14px 16px;border-left:3px solid var(--brand-text,#0865c9);background:#f7f7f6;border-radius:0 10px 10px 0}.split{display:grid;grid-template-columns:1.7fr 1fr;gap:22px}.hero{background:linear-gradient(120deg,#252a2e,var(--brand-text,#0865c9));color:#fff;border:0;padding:28px}.hero .muted{color:#e4e4e0}.hero h2{font-size:25px;margin:5px 0 10px}.hero .button{background:white;color:#252a2e;margin-top:16px}.progress{height:7px;background:#f7f7f6;border-radius:10px;overflow:hidden;margin-top:10px}.progress span{display:block;height:100%;background:var(--brand-text,#0865c9)}.month-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}.day{min-height:105px;border-bottom:1px solid var(--line);border-right:1px solid var(--line);padding:8px}.day.today{background:#f7f7f6}.event{display:block;white-space:normal;font-size:16px;background:#f7f7f6;border-radius:4px;padding:3px 5px;margin:4px 0}.event.holiday{background:#fff0e1;color:#855016}.event.leave{background:#efeafd;color:#68449c}.login{min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr}.login-story{padding:70px;display:flex;flex-direction:column;justify-content:space-between;background:#252a2e;color:#fff;position:relative;overflow:hidden}.login-story:after{content:'';position:absolute;width:550px;height:550px;border:1px solid #ffffff18;border-radius:50%;right:-220px;bottom:-110px;box-shadow:0 0 0 75px #ffffff05,0 0 0 150px #ffffff03}.login-story .brand{color:#fff;padding:0}.login-story h1{font-size:45px;line-height:1.5;max-width:520px;letter-spacing:-1.5px}.login-story p{color:#e4e4e0;max-width:440px;margin:22px 0}.login-form{display:grid;place-items:center;padding:40px}.login-form section{width:100%;max-width:390px}.login-form form{display:grid;gap:20px;margin-top:30px}.login-form h1{font-size:28px}.login-form .env{display:inline-block;margin-bottom:20px}.menu-toggle{display:none}.loading{opacity:.55;pointer-events:none}.toast{position:fixed;bottom:26px;right:26px;max-width:420px;background:#252a2e;color:white;border-radius:12px;padding:16px 22px;box-shadow:0 10px 30px #0003;z-index:50}.print-page{background:white;max-width:1100px;margin:25px auto;padding:35px;border:1px solid #ddd}.print-page h1{text-align:center;font-size:24px}.print-page td,.print-page th{border:1px solid #adafaa;padding:8px}.print-page .signatures{display:flex;justify-content:space-around;margin-top:60px;text-align:center}.prewrap{white-space:pre-wrap}.checkline{display:flex;align-items:center;gap:10px}.policy-note{border-left:4px solid var(--note-color,var(--brand-text,#0865c9));padding:14px;background:#f7f7f6}.mobile-only{display:none}details>summary{cursor:pointer;color:var(--blue);padding:10px 0}code{overflow-wrap:anywhere}.overflow{overflow-wrap:anywhere}
@media(max-width:1100px){main{padding:26px}.topbar{padding:0 26px}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.split{grid-template-columns:1fr}.login-story{padding:40px}}
@media(max-width:760px){.app{display:block}.sidebar{transform:translateX(-100%);z-index:30;transition:transform .18s}.sidebar.open{transform:translateX(0);box-shadow:10px 0 50px #0003}.menu-toggle{display:inline-flex}.topbar{height:auto;min-height:70px;padding:12px 18px;gap:8px}.topbar .who small{display:none}main{padding:24px 16px}.pagehead{align-items:start;flex-direction:column}h1{font-size:26px}.card{padding:18px;border-radius:14px}.grid,.form-grid{grid-template-columns:1fr}.full{grid-column:auto}.stats{gap:10px}.stat{padding:16px}.stat .value{font-size:26px}.login{grid-template-columns:1fr}.login-story{display:none}.login-form{min-height:100vh;padding:28px}.day{min-height:90px;padding:4px;font-size:16px}.event{font-size:16px;overflow-wrap:anywhere}.filters label{min-width:120px}.topbar .env{max-width:140px;text-align:center}.desktop-only{display:none}.mobile-only{display:block}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media print{.no-print,.sidebar,.topbar,button,.toast{display:none!important}.workspace{display:block}.app{display:block}main{padding:0}.print-page{max-width:none;margin:0;padding:0;border:0}body{background:white;font-size:16px}.card{box-shadow:none;border:0;padding:0}a{color:inherit}tr{break-inside:avoid}@page{size:A4 landscape;margin:12mm}}
dialog{border:1px solid var(--line);border-radius:18px;max-width:500px;padding:28px;color:var(--ink);box-shadow:0 18px 80px #44444440}dialog::backdrop{background:#44444466}dialog p{margin:20px 0}.editor-tools{display:flex;gap:8px;flex-wrap:wrap}
.split>* ,.grid>* ,.form-grid>*{min-width:0}.split{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}.card,.table-wrap{min-width:0;max-width:100%}.policy-note{white-space:pre-wrap}@media(max-width:1100px){.split{grid-template-columns:minmax(0,1fr)}}@media(max-width:760px){.grid,.form-grid{grid-template-columns:minmax(0,1fr)}.topbar .who{gap:8px}.toast{left:16px;right:16px;max-width:none}}

@media(max-width:760px){.sidebar{visibility:hidden}.sidebar.open{visibility:visible}}@media print{.salary-summary{font-size:16px}.salary-summary th,.salary-summary td{padding:4px}}

/* Shared workplace interaction system */
:root{--bg:#f7f7f6;--line:#e4e4e0;--radius:22px;line-height:1.7}
.card{box-shadow:0 8px 30px #44444408;padding:28px}.section-title{font-size:22px}
input,select,textarea{border:1px solid #adafaa;border-radius:12px;min-height:50px;padding:12px 14px;background:#f7f7f6;box-shadow:0 2px 3px #44444405}
input:focus,select:focus,textarea:focus{border-color:var(--brand-text,#0865c9);box-shadow:0 0 0 4px #4444441a;background:#fff}
input[type=file]{padding:12px;border-style:dashed}input::file-selector-button{font:inherit;border:0;background:#f7f7f6;color:var(--brand-text,#0865c9);padding:8px 12px;border-radius:8px;margin-right:14px}
button,.button{border-radius:12px;min-height:46px}.nav-group{margin:8px 0}.nav-group>summary{display:flex;align-items:center;gap:10px;color:#252a2e;font-weight:700;padding:12px;border-radius:12px;list-style:none}.nav-group>summary:after{content:'⌄';margin-left:auto}.nav-group[open]>summary{background:#f7f7f6}.nav-children{padding-left:12px;border-left:2px solid #f7f7f6;margin:8px 0 14px 20px}.nav-children .nav-link{padding:9px 10px}.module-nav{display:flex;gap:10px;flex-wrap:wrap;margin:-6px 0 26px}.module-nav a{padding:8px 14px;border:1px solid var(--line);border-radius:30px;background:#fff}.module-nav a.active{background:#252a2e;color:#fff}.brand{font-size:20px;padding-left:0;letter-spacing:0}.app{grid-template-columns:280px minmax(0,1fr)}.sidebar{width:280px;padding:24px 14px}
.clock-panel{background:radial-gradient(ellipse at right top,var(--brand-text,#0865c9) 0,transparent 55%),linear-gradient(130deg,#252a2e,#252a2e);color:white;border-radius:22px;padding:32px;margin-bottom:24px}.clock-panel .clock{font-size:clamp(42px,7vw,76px);font-variant-numeric:tabular-nums;line-height:1.4;letter-spacing:2px}.clock-panel .clock-date{color:#f7f7f6}.clock-status{display:inline-block;padding:6px 14px;border:1px solid #ffffff66;border-radius:24px;margin-top:12px}.combo{position:relative}.combo-search{margin-bottom:8px}.combo-options{max-height:260px;overflow:auto;position:absolute;left:0;right:0;top:100%;z-index:40;background:white;border:1px solid #adafaa;border-radius:12px;box-shadow:0 12px 30px #44444426;padding:6px}.combo-options button{width:100%;background:white;color:#252a2e;text-align:left;justify-content:flex-start;font-weight:400}.combo-options button:hover,.combo-options button:focus{background:#f7f7f6}.save-progress{position:fixed;left:50%;top:22px;transform:translateX(-50%);z-index:100;background:#252a2e;color:#fff;padding:16px 26px;border-radius:16px;box-shadow:0 10px 40px #0003}.event{width:100%;text-align:left;justify-content:flex-start;border:0;color:var(--brand-text,#0865c9);min-height:38px;font-weight:400}.calendar-scroll{overflow:auto}.month-grid{min-width:840px}.day{min-height:130px}.month-navigation{display:flex;gap:12px;justify-content:space-between;margin:20px 0}.chart-bars{display:grid;gap:14px}.chart-bar{display:grid;grid-template-columns:140px 1fr 120px;gap:12px;align-items:center}.chart-bar svg{width:100%;height:24px}.chart-bar rect{transform-origin:left;animation:bar-grow .6s ease both}@keyframes bar-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(max-width:760px){.app{display:block}.sidebar{width:280px}.card{padding:20px}.clock-panel{padding:24px}.chart-bar{grid-template-columns:95px 1fr}.chart-bar strong{grid-column:2}.topbar{flex-wrap:wrap}.module-nav{gap:8px}}@media(prefers-reduced-motion:reduce){.chart-bar rect{animation:none}}
.reward-cover,.reward-placeholder{width:100%;height:220px;object-fit:contain;border-radius:16px;background:#f7f7f6;margin-bottom:20px}.reward-placeholder{display:grid;place-items:center;font-size:72px;color:var(--brand-text,#0865c9);background:radial-gradient(circle at 70% 20%,#f7f7f6,transparent 60%),#f7f7f6}.chart-bar strong{white-space:nowrap}.chart-bar{grid-template-columns:minmax(130px,1fr) minmax(80px,2fr) minmax(160px,1fr)}@media(max-width:760px){.chart-bar{grid-template-columns:110px minmax(0,1fr)}.chart-bar strong{grid-column:2;white-space:normal}}
.chart-bars{margin-top:22px}.form-grid label{align-content:start}.form-grid input[type=checkbox],.form-grid input[type=radio]{min-height:20px}.form-actions{padding-top:18px;border-top:1px solid #f7f7f6}.notice.success{border-left:4px solid #168459}.card h2{font-size:22px}
[hidden]{display:none!important}.date-hint{color:var(--brand-text,#0865c9);min-height:0}.combo-search{font-weight:400}.form-grid .full:has(input[type=file]){padding:18px;border:1px solid #e4e4e0;border-radius:16px;background:#f7f7f6}
small{font-size:16px}.form-grid label>small{font-size:16px}.module-nav a:focus-visible,.nav-group summary:focus-visible{outline:3px solid var(--brand-text,#0865c9);outline-offset:3px}
button{transition:background .16s,box-shadow .16s,transform .16s}button:active:not(:disabled){transform:translateY(1px)}form[aria-busy=true] button[type=submit]:before{content:'';width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:save-spin .8s linear infinite}@keyframes save-spin{to{transform:rotate(360deg)}}.reward-cover{transition:transform .2s}.reward-cover:hover{transform:scale(1.015)}@media(prefers-reduced-motion:reduce){button,.reward-cover{transition:none}form[aria-busy=true] button[type=submit]:before{animation:none}}
.attachment-preview{font-weight:400;overflow-wrap:anywhere}.attachment-preview img{max-width:100%;max-height:180px;border-radius:12px;margin-top:12px;border:1px solid #e4e4e0}
.reward-grid{align-items:start}.reward-grid .form-grid{grid-template-columns:minmax(0,1fr)}.reward-admin{border-top:1px solid var(--line);margin-top:20px;padding-top:10px}.reward-balance{font-size:30px;font-weight:700;color:var(--brand-text,#0865c9);margin-top:10px}.reward-grid .card{margin-bottom:0}

/* Form system: equal control heights, top-aligned labels and accessible searchable menus. */
select{appearance:none;-webkit-appearance:none;height:52px;padding-right:36px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%23455670' stroke-width='2'%3E%3Cpath d='m4 6 5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
.filters{align-items:flex-start;margin-bottom:24px}.filters>label{align-content:start;min-width:180px}.filters>button{margin-top:32px;min-height:52px}.filters input{height:52px}.form-grid>label{align-content:start;min-width:0}.form-grid input:not([type=checkbox]):not([type=radio]):not([type=file]){min-height:52px}.combo{min-width:0;white-space:normal}.combo-native{position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;padding:0!important;opacity:0;pointer-events:none}.combo-trigger{width:100%;min-height:52px;justify-content:space-between;text-align:left;background:#f7f7f6;color:#252a2e;border:1px solid #adafaa;border-radius:12px;font-weight:400;padding:12px 14px;gap:12px;line-height:1.5}.combo-trigger:after{content:'⌄';color:var(--brand-text,#0865c9);flex:none}.combo-trigger[aria-expanded=true]{border-color:var(--brand-text,#0865c9);box-shadow:0 0 0 4px #4444441a}.combo-popup{position:absolute;top:calc(100% + 6px);left:0;min-width:100%;width:max-content;max-width:min(420px,80vw);background:white;color:#252a2e;border:1px solid #e4e4e0;border-radius:14px;box-shadow:0 16px 42px #44444433;padding:8px;z-index:60}.combo-popup .combo-search{height:48px;margin:0 0 6px;min-width:0}.combo-popup .combo-options{position:static;max-height:240px;padding:0;border:0;box-shadow:none}.combo-options button{white-space:normal}.combo-options [aria-selected=true]{background:#f7f7f6;color:var(--brand-text,#0865c9);font-weight:700}.table-wrap .combo-popup{position:fixed;top:var(--combo-top,30%);left:var(--combo-left,35%);min-width:230px;max-width:80vw}.chart-bar{grid-template-columns:minmax(100px,1fr) minmax(100px,2fr) minmax(170px,1fr)}.chart-bar strong{white-space:nowrap}.clock-panel{max-width:940px;margin:0 auto 24px}.clock-panel label{color:#f7f7f6}.clock-panel .notice{background:#ffffff14;color:#fff;border-color:#ffffff36}.clock-panel .form-actions button{width:100%;min-height:60px;font-size:20px;background:#fff;color:var(--brand-text,#0865c9)}.clock-panel .form-actions{margin-top:24px}.clock-panel .clock-status{margin-bottom:18px}.permission-scope{display:flex;gap:10px;align-items:center;padding:10px 14px;border-radius:10px;background:#f7f7f6;color:var(--brand-text,#0865c9);margin-bottom:20px;flex-wrap:wrap}.permission-scope:before{content:'';width:8px;height:8px;background:var(--brand-text,#0865c9);border-radius:50%;flex:none}.day-summary{border:1px solid #e4e4e0;border-radius:14px;margin:12px 0;padding:8px 18px}.day-summary summary{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-weight:600}.pagination{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:20px}.chat-stream{display:flex;flex-direction:column;gap:20px;padding:12px 0}.chat-bubble{align-self:flex-start;max-width:min(78%,720px);background:#f7f7f6;padding:16px 20px;border-radius:20px 20px 20px 5px;overflow-wrap:anywhere}.chat-bubble.mine{align-self:flex-end;background:#f7f7f6;border-radius:20px 20px 5px 20px}.chat-bubble small{display:block;margin:4px 0 10px}.chat-image{display:block;max-width:100%;max-height:280px;border-radius:12px;margin-top:10px;cursor:zoom-in}.chat-bubble p{white-space:pre-wrap}.table-wrap input{min-width:120px}.table-wrap .combo-trigger{min-width:140px}
@media(max-width:760px){.filters>button{margin-top:0}.filters>label{flex-basis:100%}.chart-bar{grid-template-columns:1fr}.clock-panel{padding:24px 18px}.chat-bubble{max-width:92%}.combo-popup{max-width:80vw}.permission-scope{align-items:flex-start}}
.combo-trigger{display:block;position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:38px;height:52px}.combo-trigger:after{position:absolute;right:14px;top:12px}.chat-bubble strong{display:block}.chat-bubble a{overflow-wrap:anywhere}
@media(min-width:761px) and (max-width:1050px){.app{display:block}.sidebar{transform:translateX(-100%);z-index:80}.sidebar.open{transform:translateX(0);box-shadow:10px 0 50px #0003}.menu-toggle{display:inline-flex}.topbar{padding:12px 24px;height:auto;min-height:76px}main{padding:28px 24px}.workspace{width:100%}}
details.combo>summary.combo-trigger{color:#252a2e;list-style:none;margin:0;padding:12px 38px 12px 14px;cursor:pointer}details.combo>summary::-webkit-details-marker{display:none}details.combo:not([open])>.combo-popup{display:none}details.combo[open]{z-index:60}
.field-label{display:grid;gap:6px;color:#252a2e;font-weight:500;align-content:start;min-width:0}.filters>.field-label{flex:1;min-width:180px}.clock-panel .field-label{color:#f7f7f6}@media(max-width:760px){.filters>.field-label{flex-basis:100%}}
.chat-stream{max-height:60vh;min-height:260px;overflow:auto;scrollbar-gutter:stable;padding:8px 14px 18px}.chat-compose{border-top:1px solid var(--line);padding-top:20px}.chat-compose textarea{min-height:76px}.chat-compose .form-grid{grid-template-columns:1fr 1fr}.chat-compose .form-grid>.full{grid-column:auto}.chat-compose .form-actions{margin-top:12px}@media(max-width:760px){.chat-stream{padding:6px;max-height:52vh}.chat-compose .form-grid{grid-template-columns:1fr}}
.table-tools{display:flex;gap:16px;justify-content:space-between;align-items:end;flex-wrap:wrap;margin-top:20px}.table-tools>label{min-width:220px;max-width:100%;flex:1}.table-tools .pagination{margin:0}.chat-layout{min-width:0}table .prewrap{min-width:180px;max-width:640px;overflow-wrap:anywhere}
.permission-scope{display:block}.permission-scope:before{display:inline-block;vertical-align:middle;margin-right:8px}@media(max-width:760px){.module-nav{flex-wrap:nowrap;overflow:auto;white-space:nowrap;padding-bottom:8px;margin-bottom:18px}.module-nav a{flex:none}.clock-panel .clock-status{margin-bottom:6px}.pagehead{margin-bottom:18px}}

/* Consistent month selection and clearly separated payroll deductions. */
.month-picker{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(95px,1fr);gap:10px;min-width:0}
.month-picker .combo{min-width:0}.deduction-control{margin:0;border:1px solid var(--line,#e4e4e0);border-radius:16px;padding:20px;background:#f7f7f6;min-width:0;align-self:start}
.deduction-control>[data-ss-fields],.deduction-control>[data-tax-fixed],.deduction-control>[data-tax-annual]{display:grid;gap:16px;margin-top:18px}.deduction-control small{display:block;margin:0;color:var(--brand-text,#0865c9);white-space:normal;font-size:16px}.deduction-control a{display:inline-block;margin-top:0}.deduction-control [hidden]{display:none!important}
td .deduction-control{min-width:245px;padding:12px}.month-picker select{min-width:0;width:100%}

.payroll-deductions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}@media(max-width:760px){.payroll-deductions{grid-template-columns:1fr}}

.warning-paper{width:100%;max-width:210mm;min-height:297mm;margin:20px auto;background:white;border:1px solid #e4e4e0;padding:18mm;box-shadow:0 12px 40px #4444440a;overflow-wrap:anywhere}.warning-paper h1,.warning-paper h2{text-align:center;margin-bottom:24px}.warning-editor>label{margin:20px 0}.warning-editor textarea{min-height:95px;background:#f7f7f6}.document-private{color:var(--brand-text,#0865c9);font-size:16px;border-bottom:1px solid #e4e4e0;padding-bottom:16px;margin-bottom:20px}.document-section{margin:18px 0}.document-section p{white-space:normal}.document-signatures{margin-top:30px}.document-signatures p{margin:22px 0}.document-hash{font-size:16px;overflow-wrap:anywhere}.warning-tools{padding:22px;background:#f7f7f6;border-radius:16px;display:grid;gap:16px}.warning-document p{overflow-wrap:anywhere}@media(max-width:760px){.warning-paper{padding:22px 16px;min-height:0}.warning-paper h1{font-size:24px}.warning-paper h2{font-size:22px}}

/* Company document workspace: screen remains readable; print uses dedicated A4 typesetting. */
.warning-paper:not(.warning-editor){min-height:0;padding:28px 36px;max-width:900px}
.warning-document .document-header{text-align:center;border-bottom:2px solid #e4e4e0;padding-bottom:14px;margin-bottom:14px}
.warning-document .document-header h1{font-size:24px;margin:4px 0}.warning-document .document-header h2{font-size:22px;margin:4px 0}
.warning-document .document-header p{margin:4px 0}.warning-document .document-section{margin:12px 0;line-height:1.65;overflow-wrap:anywhere}
.warning-document .signature-grid{width:100%;table-layout:fixed}.warning-document .signature-grid td{white-space:normal;width:33.33%;padding:8px;border:0;text-align:center;vertical-align:bottom;overflow-wrap:anywhere}
.warning-document .document-signatures p{margin:12px 0}.document-hash{overflow-wrap:anywhere}
.workflow-entry{padding:20px;border:1px solid #e4e4e0;border-radius:16px;margin:16px 0}.workflow-entry h3{font-size:20px;margin-top:0}
.employee-response{background:#f7f7f6;border-left:4px solid var(--brand-text,#0865c9);border-radius:8px;padding:16px;margin:14px 0;overflow-wrap:anywhere}
.warning-editor .notice{margin:18px 0}.warning-editor label{margin:12px 0}.warning-editor textarea{min-height:76px}
@media(max-width:650px){.warning-paper:not(.warning-editor){padding:20px 14px}.warning-document .signature-grid,.warning-document .signature-grid tbody,.warning-document .signature-grid tr,.warning-document .signature-grid td{display:block;width:100%}.workflow-entry{padding:14px}}

.document-pdf-preview{display:block;width:100%;height:85vh;min-height:520px;border:1px solid #e4e4e0;border-radius:12px;background:#f7f7f6;margin:18px 0}.document-preview-container{min-width:0;margin-top:20px}@media(max-width:650px){.document-pdf-preview{height:70vh;min-height:420px}}

/* Workflow clarity: one current action, stable document preview, visible responsibility. */
.journey-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:wrap}.journey-heading h2{margin:6px 0 16px;font-size:24px}.journey-heading .eyebrow{margin:0;color:var(--brand-text,#0865c9);font-size:16px}.process-steps{display:flex;list-style:none;padding:0;gap:8px;margin:20px 0;flex-wrap:wrap}.process-steps li{flex:1;min-width:130px;background:#f7f7f6;border:1px solid #e4e4e0;border-radius:12px;padding:14px;color:var(--brand-text,#0865c9);display:flex;align-items:center;gap:10px}.process-steps li span{display:grid;place-items:center;background:#f7f7f6;border-radius:50%;width:30px;height:30px;flex:0 0 30px}.process-steps li.current{background:#252a2e;border-color:#252a2e;color:white;font-weight:700}.process-steps li.current span{background:#fff;color:#252a2e}.journey-visibility{border-left:3px solid var(--brand-text,#0865c9);padding:10px 16px;background:#f7f7f6;border-radius:0 10px 10px 0}.workflow-tabs{display:flex;gap:8px;border-bottom:1px solid #e4e4e0;margin:0 0 24px;flex-wrap:wrap}.workflow-tabs a{padding:14px 18px;border-bottom:3px solid transparent;font-weight:600}.workflow-tabs a[aria-current]{border-color:var(--brand-text,#0865c9);color:#252a2e;background:#f7f7f6;border-radius:10px 10px 0 0}.preview-banner{padding:22px;border:2px dashed var(--brand-text,#0865c9);background:#f7f7f6;border-radius:18px;margin-bottom:24px}.preview-controls{border:1px dashed #adafaa;padding:20px;border-radius:12px;min-width:0}.preview-controls legend{font-size:16px;color:var(--brand-text,#0865c9)}.wizard-intro h2{margin-top:0}.wizard-step{border:1px solid #e4e4e0;border-radius:18px;padding:24px;min-width:0;background:#f7f7f6}.wizard-step h3{font-size:22px;margin:0 0 10px}.wizard-step h3:focus{outline:none}.wizard-step h3:focus-visible{outline:3px solid var(--brand-text,#0865c9);outline-offset:4px}.wizard-step>p{color:var(--brand-text,#0865c9)}.wizard-step details>label{margin-top:18px}.wizard-controls{display:flex;justify-content:space-between;gap:12px}.wizard-intro nav{display:flex;gap:8px;flex-wrap:wrap}.wizard-intro nav button{flex:1;white-space:normal;min-width:150px}.wizard-intro nav button[aria-current]{background:#252a2e;color:#fff;border-color:#252a2e}.review-summary{background:white;border:1px solid #e4e4e0;padding:18px;border-radius:12px;overflow-wrap:anywhere;white-space:pre-line}.work-guide{border:1px solid #e4e4e0;border-radius:14px;padding:15px 20px;background:#fff;margin:0 0 24px}.work-guide summary{font-size:16px;color:#252a2e}.work-guide ol{padding-left:24px}.work-guide li{margin:10px 0}.work-guide .row{margin-top:16px}.recipient-summary{background:#f7f7f6;padding:16px;border-radius:12px}.workflow-counts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:20px}.workflow-counts a{display:flex;flex-direction:column;padding:18px;border:1px solid #e4e4e0;border-radius:16px;background:#fff;color:#252a2e}.workflow-counts strong{font-size:28px}.workflow-counts a[aria-current]{border-color:var(--brand-text,#0865c9);background:#f7f7f6}#current-work{scroll-margin-top:25px}[hidden]{display:none!important}@media(max-width:600px){.wizard-step{padding:16px}.wizard-intro nav button{min-width:calc(50% - 8px);padding:10px;font-size:16px}.process-steps li{min-width:100%;padding:10px 14px}.journey-heading h2{font-size:22px}.workflow-tabs a{padding:10px;font-size:16px}.preview-banner{padding:16px}.wizard-controls button{flex:1}}@media print{.work-guide,.preview-banner,.workflow-tabs,.wizard-controls{display:none!important}}

/* Lateness follow-up: task first, then evidence and delivery history. */
.late-overview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.late-overview>div{padding:20px;background:#f7f7f6;border-radius:16px}.late-overview span{display:block;color:var(--brand-text,#0865c9);font-weight:750;font-size:24px;margin-bottom:10px}.late-overview b{display:block;font-size:20px}.late-overview p{margin-bottom:0;color:var(--brand-text,#0865c9)}.late-banner{display:flex;justify-content:space-between;align-items:center;gap:20px;background:#fff7df;border:1px solid #e6bd53;border-radius:16px;padding:20px;margin:20px 0}.late-banner p{margin:6px 0 0}.late-banner .button{flex-shrink:0}.late-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;list-style:none;padding:0;margin:24px 0}.late-steps li{padding:14px;background:#f7f7f6;border:1px solid #e4e4e0;border-radius:12px;color:var(--brand-text,#0865c9);display:flex;align-items:center;gap:10px}.late-steps span{font-weight:750}.late-steps [aria-current=step]{background:#252a2e;color:#fff}.late-note{border-bottom:1px solid #e4e4e0;padding:20px 0}.late-note:last-of-type{border:0}.late-dialog{width:min(640px,calc(100% - 32px));max-height:90dvh;overflow:auto;border:1px solid #e4e4e0;border-radius:22px;padding:28px;color:#252a2e;box-shadow:0 24px 80px #44444455}.late-dialog::backdrop{background:#44444488}.late-dialog h2{font-size:24px}.break-all{overflow-wrap:anywhere}.incident-picker{padding:18px;border:1px solid #e4e4e0;border-radius:14px}.incident-picker legend{font-weight:650}.incident-time-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}.incident-picker [hidden]{display:none!important}@media(max-width:900px){.late-overview{grid-template-columns:repeat(2,minmax(0,1fr))}.late-steps{grid-template-columns:1fr}.late-steps li{padding:12px}}@media(max-width:560px){.late-overview,.incident-time-fields{grid-template-columns:1fr}.late-banner{align-items:stretch;flex-direction:column}.late-dialog{padding:20px}}
/* Attendance overview and read-only walkthrough. */
.attendance-ranges{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}.attendance-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:24px 0}.attendance-metrics article{background:#fff;border:1px solid #e4e4e0;border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:8px}.attendance-metrics article:first-child{background:#252a2e;color:#fff}.attendance-metrics strong{font-size:42px;line-height:1.2;font-variant-numeric:tabular-nums}.attendance-metrics small{font-size:16px;line-height:1.5}.late-guide-flow{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.late-guide-flow span{background:#f7f7f6;border:1px solid #e4e4e0;border-radius:12px;padding:12px 16px;font-weight:650}.late-guide-flow i{font-style:normal;color:var(--brand-text,#0865c9)}.late-guide-layout{display:grid;grid-template-columns:minmax(240px,300px) minmax(0,1fr);gap:24px;align-items:start;margin:24px 0}.late-guide-nav{display:grid;gap:8px}.late-guide-nav a{display:flex;align-items:center;gap:12px;padding:16px;border:1px solid #e4e4e0;border-radius:14px;color:#252a2e;background:#fff;text-decoration:none}.late-guide-nav a>span{flex:0 0 32px;font-size:20px;font-weight:750}.late-guide-nav a[aria-current=step]{background:#252a2e;color:#fff;border-color:#252a2e}.late-guide-nav a:focus-visible{outline:3px solid var(--brand-text,#0865c9);outline-offset:3px}.late-guide-stage{margin:0;scroll-margin-top:24px;min-width:0}.late-guide-stage h2{font-size:26px;margin-top:8px}.late-guide-meta{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}.late-guide-meta>div{padding:14px 16px;background:#f7f7f6;border-radius:12px}.late-guide-meta span,.late-guide-meta b{display:block}.late-guide-meta span{color:var(--brand-text,#0865c9);margin-bottom:6px}.late-guide-screen{border:1px solid #e4e4e0;border-radius:18px;padding:24px;background:#fff;box-shadow:0 12px 36px #4444440a}.late-guide-screen-head{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;border-bottom:1px solid #f7f7f6;padding-bottom:18px;margin-bottom:22px;color:var(--brand-text,#0865c9)}.late-guide-screen h3{font-size:24px}.late-guide-screen button:disabled{opacity:1;background:#f7f7f6;color:#252a2e;border-color:#e4e4e0;cursor:default;white-space:normal}.late-guide-screen textarea:disabled{background:#f7f7f6;opacity:1;min-height:112px}.late-guide-count{display:block;color:var(--brand-text,#0865c9);font-size:48px;font-weight:750;line-height:1.3}.late-guide-count small{font-size:18px;font-weight:600}.late-guide-admin{border-left:4px solid var(--brand-text,#0865c9);background:#f7f7f6;border-radius:0 12px 12px 0;padding:18px 22px;margin:24px 0}.late-guide-admin h3{font-size:20px;margin:0 0 10px}.late-guide-admin p{margin:0}.late-guide-answer{padding:20px;background:#f7f7f6;border:1px solid #f7f7f6;border-radius:14px;margin:16px 0}.late-guide-file{padding:18px;border:1px dashed #adafaa;border-radius:12px;background:#f7f7f6;overflow-wrap:anywhere}.late-guide-paper{border:1px solid #e4e4e0;padding:24px;text-align:center;margin:20px 0;box-shadow:0 6px 20px #44444409}.late-guide-paper b{font-size:20px}
@media(max-width:1100px){.attendance-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.late-guide-layout{grid-template-columns:1fr}.late-guide-nav{grid-template-columns:repeat(3,minmax(0,1fr))}.late-guide-nav a{align-items:flex-start;padding:12px}.late-guide-nav a>span{flex-basis:24px}}
@media(max-width:600px){.attendance-metrics{gap:10px}.attendance-metrics article{padding:16px}.attendance-metrics strong{font-size:32px}.late-guide-nav{grid-template-columns:1fr}.late-guide-meta{grid-template-columns:1fr}.late-guide-screen{padding:18px}.late-guide-stage h2{font-size:24px}.late-guide-flow{gap:8px}.late-guide-flow span{padding:10px}.day-summary summary{align-items:flex-start;gap:12px;flex-wrap:wrap}}
.attendance-metrics article:first-child small{color:#f7f7f6}
#guide-steps{scroll-margin-top:24px}
/* Site-wide workflow review: clear actions, readable facts, compact queues. */
.page-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.page-actions .row{flex-wrap:wrap}.back-to-list{margin-bottom:20px}.record-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:0}.record-facts>div{min-width:0;background:#f7f7f6;border:1px solid #f7f7f6;border-radius:12px;padding:16px}.record-facts dt{color:var(--brand-text,#0865c9);font-size:16px;margin-bottom:6px}.record-facts dd{font-size:18px;margin:0;overflow-wrap:anywhere}.task-inbox{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.task-card{display:block;padding:20px;border-radius:16px;border:1px solid #e4e4e0;background:#f7f7f6;color:#252a2e;text-decoration:none}.task-card.has-work{background:#f7f7f6;border-color:#e4e4e0}.task-card>div{display:flex;gap:12px;justify-content:space-between;align-items:flex-start}.task-card strong{font-size:32px;line-height:1.15;color:var(--brand-text,#0865c9)}.task-card p{color:var(--brand-text,#0865c9);margin:12px 0}.task-open{font-weight:650;color:var(--brand-text,#0865c9);font-size:16px}.task-card:focus-visible{outline:3px solid var(--brand-text,#0865c9);outline-offset:3px}.nav-search{padding:0 12px 20px}.nav-search label{font-weight:600;font-size:16px}.nav-search input{min-width:0;margin-top:8px;background:#f7f7f6}.nav-search [data-nav-empty]{font-size:16px;color:var(--brand-text,#0865c9);margin-top:10px}.skip-link{position:fixed;top:-100px;left:16px;background:#252a2e;color:#fff;padding:14px 22px;border-radius:12px;z-index:999}.skip-link:focus{top:12px}.form-unsaved{padding:10px 14px;margin:16px 0;color:#755009;background:#fff6df;border:1px solid #e6cf8d;border-radius:10px;font-size:16px}.search-state{min-height:24px;color:var(--brand-text,#0865c9);font-size:16px}.filters>a.button{align-self:center}.reward-jump{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.reward-admin summary{font-size:16px}.task-card:hover{border-color:#adafaa}#reward-requests,#reward-create,#leave-history{scroll-margin-top:20px}
@media(max-width:1200px){.task-inbox{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.task-inbox,.record-facts{grid-template-columns:1fr}.page-actions{width:100%}.page-actions .row{width:100%}.task-card>div{align-items:center}.task-card p{margin:8px 0}.task-card{padding:18px}}
/* Attendance studio: camera and decision stay together on phones and desktop. */
.punch-console{position:relative;isolation:isolate;border-radius:28px;overflow:hidden;margin-bottom:28px;background:#252a2e;color:#f7f7f6;box-shadow:0 22px 55px #44444426;border:1px solid #252a2e}.punch-console:before{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(ellipse at 18% 36%,#44444470,transparent 52%),radial-gradient(ellipse at 90% 0,#44444450,transparent 55%)}.punch-person{display:flex;align-items:center;gap:16px;padding:28px 32px;border-bottom:1px solid #ffffff20;flex-wrap:wrap}.punch-person img,.punch-avatar{width:64px;height:64px;object-fit:cover;border-radius:20px;border:2px solid var(--brand-text,#0865c9);flex-shrink:0}.punch-avatar{display:grid;place-items:center;font-size:28px;background:#252a2e}.punch-person h2{font-size:24px;color:white}.punch-person p{color:#e4e4e0}.punch-kicker{font-size:16px;letter-spacing:.4px;color:var(--brand-text,#0865c9);font-weight:600}.punch-live{margin-left:auto;padding:8px 14px;background:#252a2e;border:1px solid var(--brand-text,#0865c9);border-radius:999px;font-size:16px;display:flex;align-items:center;gap:9px}.punch-live i{width:9px;height:9px;background:#7af4c3;border-radius:50%;box-shadow:0 0 0 5px #7af4c320;animation:punch-breathe 3s ease-in-out infinite}.punch-layout{display:grid;grid-template-columns:minmax(270px,.85fr) minmax(0,1.4fr)}.punch-orbit{padding:36px 28px;min-width:0}.punch-time{padding:36px 0;text-align:center;position:relative}.punch-time:before{content:"";position:absolute;inset:4px 15%;border:1px solid #44444425;border-radius:50%;z-index:-1;box-shadow:0 0 0 18px #44444407,0 0 0 40px #44444404}.punch-time .clock{font-size:clamp(40px,4.2vw,76px);line-height:1.3;letter-spacing:-2px;color:#fff;font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}.punch-time .clock-date{font-size:20px;color:#f7f7f6}.punch-time>span{font-size:16px;color:#adafaa}.shift-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:26px 0}.shift-strip>div{background:#ffffff09;border:1px solid #ffffff1a;border-radius:14px;padding:14px 6px;text-align:center}.shift-strip small{display:block;color:#e4e4e0;font-size:16px}.shift-strip strong{font-size:20px;color:#f7f7f6;white-space:nowrap}.punch-today{border-top:1px solid #ffffff20;padding-top:22px}.punch-today h3{color:#f7f7f6;margin-bottom:12px}.punch-today p{display:flex;justify-content:space-between;gap:12px;margin:10px 0;color:#e4e4e0}.punch-today b{color:#fff}.punch-workspace{margin:24px 24px 24px 0;padding:26px;background:#fff;border-radius:22px;color:var(--ink);min-width:0}.punch-workspace .punch-kicker{color:#252a2e}.punch-workspace .form-grid{gap:18px}.punch-workspace .form-actions{border-top:0;margin-top:20px;padding:0}.punch-workspace .form-actions>button{width:100%;min-height:58px;font-size:18px;background:var(--brand-text,#0865c9);box-shadow:0 6px 14px #44444420}.punch-security{border-top:1px solid #ffffff16;text-align:center;padding:16px 24px;font-size:16px;color:#e4e4e0}.selfie-studio{background:#f7f7f6;border:1px solid #e4e4e0;border-radius:18px;padding:20px}.selfie-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}.selfie-heading h2{font-size:22px}.selfie-heading p{color:var(--brand-text,#0865c9);margin-top:5px}.selfie-badge{background:#f7f7f6;color:#252a2e;border-radius:8px;padding:5px 10px;font-size:16px}.selfie-frame{position:relative;aspect-ratio:4/3;max-height:360px;margin:20px 0 12px;border-radius:16px;background:linear-gradient(135deg,#f7f7f6,#f7f7f6);overflow:hidden;display:grid;place-items:center}.selfie-frame video,.selfie-frame img{height:100%;width:100%;object-fit:contain}.selfie-frame video{transform:scaleX(-1)}.selfie-placeholder{display:grid;justify-items:center;text-align:center;gap:12px;color:var(--brand-text,#0865c9);padding:18px}.selfie-placeholder svg{width:76px;height:76px;fill:none;stroke:var(--brand-text,#0865c9);stroke-width:3}.selfie-placeholder span{font-size:16px}.selfie-corners{position:absolute;inset:18px;border:1px solid #44444455;border-radius:20px;pointer-events:none}.selfie-controls{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}.camera-status{min-height:26px;color:var(--brand-text,#0865c9);font-size:16px}.profile-required{background:#fff5df;border:1px solid #e5c477;border-radius:14px;padding:16px;margin-bottom:16px;color:#674509}.profile-required button{float:right;margin-left:8px}.punch-profile-upload{margin-bottom:20px;padding:16px;border:1px solid #e4e4e0;border-radius:14px}.punch-complete{display:grid;gap:18px;justify-items:center;text-align:center;padding:36px 10px}.punch-complete>span{display:grid;place-items:center;width:70px;height:70px;background:#e0f5ed;color:#137956;border-radius:50%;font-size:34px}.attendance-photo{display:inline-flex;align-items:center;gap:10px;font-size:16px}.attendance-photo img{width:58px;height:58px;border-radius:12px;object-fit:cover;border:1px solid #e4e4e0}@keyframes punch-breathe{50%{box-shadow:0 0 0 9px #7af4c305}}@media(max-width:1100px){.punch-layout{grid-template-columns:1fr}.punch-orbit{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:20px 24px}.punch-time{grid-row:span 2;align-self:center}.shift-strip{margin:0;align-self:center}.punch-today{padding-top:10px}.punch-workspace{margin:0 24px 24px}.punch-time .clock{font-size:56px}}@media(max-width:600px){.punch-console{border-radius:22px}.punch-person{padding:20px 16px;gap:12px}.punch-person img,.punch-avatar{width:54px;height:54px;border-radius:16px}.punch-person h2{font-size:20px}.punch-live{margin-left:0}.punch-orbit{display:block;padding:20px 16px}.punch-time{padding:25px 0}.punch-time .clock{font-size:52px}.shift-strip{margin:22px 0 16px}.punch-today h3{font-size:20px}.punch-workspace{margin:0 10px 12px;padding:18px 12px;border-radius:18px}.selfie-studio{padding:14px 10px}.selfie-controls button{flex:1}.selfie-frame{max-height:none}.punch-security{padding:15px 18px;text-align:left}.punch-workspace .form-grid{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.punch-live i{animation:none}}
.clock-link-avatar{width:76px;height:76px;object-fit:cover;border-radius:22px;margin:18px auto;border:2px solid var(--brand-text,#0865c9)}.clock-panel .selfie-studio{color:var(--ink);margin-top:24px}.clock-panel .selfie-heading p,.clock-panel .selfie-placeholder span{color:var(--brand-text,#0865c9)}.clock-panel .selfie-studio .punch-kicker{color:#252a2e}

/* Personal onboarding and private document review */
.readiness-card{margin:0 0 28px;padding:28px;border:1px solid #e4e4e0;border-radius:24px;background:linear-gradient(125deg,#f7f7f6,#fff 58%);box-shadow:0 12px 35px #44444408;scroll-margin-top:24px}.readiness-card>header{display:flex;justify-content:space-between;gap:20px;align-items:center}.readiness-card h2{font-size:24px;margin:8px 0}.readiness-card p{color:var(--brand-text,#0865c9);margin:8px 0}.readiness-count{display:grid;flex-shrink:0;text-align:center;color:#252a2e}.readiness-count strong{font-size:38px;line-height:1.2}.readiness-count strong span{font-size:20px;color:var(--brand-text,#0865c9)}.readiness-card progress{width:100%;height:10px;accent-color:var(--brand-text,#0865c9);margin:20px 0;border:0;border-radius:10px;overflow:hidden}.readiness-card progress::-webkit-progress-bar{background:#f7f7f6}.readiness-card progress::-webkit-progress-value{background:linear-gradient(90deg,#252a2e,#16a49b)}.readiness-items{display:grid;gap:12px}.readiness-item{display:grid;grid-template-columns:52px minmax(0,1fr) auto;align-items:start;gap:16px;background:#fff;border:1px solid #e4e4e0;border-radius:18px;padding:20px}.readiness-item h3{font-size:20px;margin:0}.readiness-symbol{display:grid;place-items:center;height:52px;width:52px;border-radius:15px;background:#f7f7f6;color:var(--brand-text,#0865c9);font-weight:700;font-size:20px}.readiness-symbol img{width:52px;height:52px;object-fit:cover;border-radius:15px}.readiness-item.is-done .readiness-symbol{background:#e4f5ed;color:#176746}.readiness-item details{margin-top:12px}.readiness-item summary{color:var(--brand-text,#0865c9);font-weight:600;cursor:pointer;padding:10px 0}.readiness-item form{margin-top:12px}.readiness-card footer{margin-top:18px;font-size:16px;color:var(--brand-text,#0865c9)}.document-watermark{border:1px solid #e4e4e0;border-radius:18px;padding:20px;background:#f7f7f6;min-width:0}.document-watermark h3{font-size:20px;margin:0 0 12px}.document-watermark p{overflow-wrap:anywhere}.document-watermark input[type=range]{width:100%;min-height:44px;padding:0;accent-color:var(--brand-text,#0865c9)}.watermark-preview{padding:12px;border-radius:12px;background:repeating-conic-gradient(#f7f7f6 0 25%,#f7f7f6 0 50%) 0/20px 20px;text-align:center;margin:14px 0}.watermark-preview canvas{display:block;max-width:100%;max-height:520px;width:auto;height:auto;margin:auto;box-shadow:0 3px 15px #44444422}.document-watermark small{font-size:16px;line-height:1.7;color:var(--brand-text,#0865c9)}.document-watermark [hidden]{display:none!important}@media(max-width:600px){.readiness-card{padding:18px;border-radius:18px}.readiness-card>header{align-items:start}.readiness-card h2{font-size:22px}.readiness-count strong{font-size:30px}.readiness-count>span{max-width:85px}.readiness-item{grid-template-columns:40px minmax(0,1fr);gap:10px;padding:14px}.readiness-symbol,.readiness-symbol img{width:40px;height:40px}.readiness-item>.badge{grid-column:2;grid-row:2;justify-self:start}.document-watermark{padding:12px}.readiness-item form .form-actions button{width:100%}}
@media(max-width:600px){.readiness-card{padding:12px}.readiness-item{grid-template-columns:minmax(0,1fr);padding:12px}.readiness-symbol{display:none}.readiness-item>.badge{grid-column:1;grid-row:auto}.document-watermark{padding:10px}.watermark-preview{padding:6px}}

/* Single focused sign-in form */
.auth-page{background:radial-gradient(ellipse at 50% 0,#f7f7f6 0,transparent 65%),#f7f7f6}.auth-center{width:100%;max-width:none;min-height:100vh;min-height:100svh;display:grid;place-items:center;padding:28px 18px;margin:0}.auth-card{width:100%;max-width:440px;background:#fff;border:1px solid #e4e4e0;border-radius:24px;padding:36px;box-shadow:0 20px 65px #4444440d;text-align:center}.auth-symbol{margin:0 auto 18px;width:60px;height:60px;background:#252a2e;color:#f7f7f6;border-radius:18px;display:grid;place-items:center;box-shadow:0 5px 14px #44444418}.auth-symbol svg{width:34px;height:34px}.auth-card h1{font-size:28px;letter-spacing:-.4px}.auth-company{color:var(--brand-text,#0865c9);margin:5px 0 26px}.auth-card form{display:grid;gap:20px;text-align:left}.auth-card input{min-height:52px;border-radius:12px}.auth-card form button{width:100%;min-height:52px;border-radius:12px;margin-top:4px;background:#252a2e}.auth-help{font-size:16px;color:var(--brand-text,#0865c9);margin-top:24px}.auth-environment{display:inline-block;margin-top:18px;padding:3px 9px;border-radius:6px;background:#f7f7f6;color:var(--brand-text,#0865c9);font-size:16px}.auth-card .notice{text-align:left}.attendance-location{display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;border:1px solid #e4e4e0;border-radius:16px;background:#f7f7f6;padding:18px;color:#252a2e}.attendance-location h3{font-size:20px;margin:0 0 8px}.attendance-location p{font-size:16px;line-height:1.65;margin:8px 0}.attendance-location [data-geo-status]{font-weight:600;color:#252a2e}.geo-icon{font-size:28px}.geo-record{display:flex;gap:20px;margin:24px 0;padding:24px;border:1px solid #e4e4e0;border-radius:18px;background:#f7f7f6}.geo-pin{font-size:54px;color:var(--brand-text,#0865c9)}.geo-coordinates{font-variant-numeric:tabular-nums;font-size:24px;font-weight:600;overflow-wrap:anywhere}.geo-record p{margin-top:10px}.geo-disclosure{margin-top:16px;max-width:720px}@media(max-width:600px){.auth-card{padding:28px 24px;border-radius:20px}.attendance-location{grid-template-columns:1fr;padding:14px}.geo-icon{display:none}.geo-record{padding:18px;gap:12px}.geo-coordinates{font-size:20px}}.clock-panel .attendance-location{color:#252a2e;text-align:left}.clock-panel .attendance-location .muted{color:var(--brand-text,#0865c9)}
/* Personal readiness is a reminder, never an attendance prerequisite. */
.blank-avatar{display:inline-grid;place-items:center;background:#f7f7f6;color:var(--brand-text,#0865c9);overflow:hidden;flex-shrink:0}.blank-avatar svg{width:72%;height:72%}.clock-panel>.blank-avatar{width:76px;height:76px;border-radius:50%;margin:12px auto}
.readiness-notification{position:relative;z-index:45}.readiness-notification>summary{display:flex;align-items:center;gap:8px;min-height:44px;padding:8px 12px;background:#fff0f1;color:#a11930;border:1px solid #f0b8c2;border-radius:12px;list-style:none;font-weight:600;cursor:pointer}.readiness-notification>summary::-webkit-details-marker{display:none}.readiness-notification>summary svg{width:22px;height:22px;flex-shrink:0}.readiness-notification>summary b{display:grid;place-items:center;background:#b42339;color:white;min-width:26px;height:26px;border-radius:50%;font-size:16px}.readiness-notification>summary:focus-visible{outline:3px solid var(--brand-text,#0865c9);outline-offset:3px}.readiness-popover{position:absolute;right:0;top:calc(100% + 10px);width:360px;max-width:calc(100vw - 32px);padding:22px;border:1px solid #e4e4e0;border-radius:18px;background:#fff;color:#252a2e;box-shadow:0 14px 45px #44444424;text-align:left;max-height:70vh;overflow-y:auto}.readiness-popover h2{font-size:20px;margin:0 0 8px}.readiness-popover p{font-size:16px;line-height:1.65;margin:8px 0}.readiness-popover ul{list-style:none;margin:14px 0;padding:0;display:grid;gap:10px}.readiness-popover li{display:flex;gap:10px;overflow-wrap:anywhere}.readiness-popover li>span{color:#b42339}.readiness-popover .button{display:flex;justify-content:center;margin-top:12px}.readiness-popover .readiness-reminder{color:var(--brand-text,#0865c9);margin-top:14px}@media(max-width:760px){.readiness-notification{position:static}.readiness-popover{position:absolute;right:16px;top:100%;width:360px}.topbar{position:relative}.readiness-notification>summary{padding:8px}.readiness-notification>summary>span{font-size:16px}}

/* Readiness status: text/icons accompany red and green for accessibility. */
.readiness-item.is-pending{border-color:#efbcc5;background:#fffafb;border-left:4px solid #bd2a43}.readiness-item.is-pending .readiness-symbol{background:#fde8ec;color:#a11930}.readiness-item.is-pending h3{color:#9f1c31}.readiness-item.is-done{border-color:#add8c4;background:#f6fcf8;border-left:4px solid #238058}.readiness-item.is-done h3{color:#176240}.readiness-card progress{accent-color:#238058}.readiness-card progress::-webkit-progress-value{background:#238058}.readiness-count{color:#176240}.readiness-popover li{color:#9f1c31}

/* One viewport-bounded menu for forms, tables and wizard steps. */
.combo>.combo-popup,.table-wrap .combo>.combo-popup{position:fixed;min-width:0;max-width:calc(100vw - 16px);display:flex;flex-direction:column;overflow:hidden;z-index:100;isolation:isolate}
.combo-popup .combo-search{flex:0 0 48px}.combo-popup .combo-options{min-height:0;overflow-y:auto;overscroll-behavior:contain;max-height:none;flex:1}.combo-options button{min-height:44px;padding:10px 12px;line-height:1.5;transform:none!important;transition:background .12s}.combo-trigger:focus-visible{outline:3px solid var(--brand-text,#0865c9);outline-offset:3px}

.ui-icon{width:22px;height:22px;flex:0 0 22px;vertical-align:middle}.nav-group>summary .ui-icon{color:var(--brand-text,#0865c9)}.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:20px}.contact-card{background:#fff;border:1px solid #e4e4e0;border-radius:20px;padding:24px;min-width:0;transition:box-shadow .18s,border-color .18s}.contact-card:hover{border-color:#adafaa;box-shadow:0 8px 26px #4444440d}.contact-card header{display:flex;gap:14px;align-items:center;margin-bottom:16px}.contact-initial{display:grid;place-items:center;width:52px;height:52px;flex:0 0 52px;border-radius:18px;background:linear-gradient(135deg,#f7f7f6,#f7f7f6);color:var(--brand-text,#0865c9);font-weight:700;font-size:24px}.contact-card h2{font-size:20px;overflow-wrap:anywhere;line-height:1.5}.contact-card header p,.contact-company{color:var(--brand-text,#0865c9);font-size:16px}.contact-card dl{margin:20px 0;display:grid;gap:16px}.contact-card dt{display:flex;align-items:center;gap:8px;color:var(--brand-text,#0865c9);font-size:16px}.contact-card dd{margin:4px 0 0;overflow-wrap:anywhere}.contact-bank{border-top:1px solid #e4e4e0;padding-top:10px}.contact-bank summary{display:flex;gap:8px;align-items:center;font-size:16px}.contact-bank p{padding:4px 0;overflow-wrap:anywhere}.bank-account{font-variant-numeric:tabular-nums;letter-spacing:.5px}.contact-card footer{margin-top:16px;padding-top:14px;border-top:1px solid #f7f7f6}.report-viewer{max-width:1600px}.report-viewer .document-pdf-preview{height:82vh}.nav-group[open]>summary .ui-icon{color:var(--brand-text,#0865c9)}@media(prefers-reduced-motion:no-preference){.nav-group[open]>summary .ui-icon{animation:icon-reveal .2s ease-out}@keyframes icon-reveal{from{opacity:.5;transform:scale(.92)}to{opacity:1;transform:scale(1)}}}@media(max-width:600px){.contact-card{padding:20px}.report-viewer{padding:20px 12px}.report-viewer .row>.button{flex:1}}@media(prefers-reduced-motion:reduce){.contact-card{transition:none}}

/* Shared filter layout: field baseline and action baseline use the same 32px label row. */
.filters{gap:16px;align-items:flex-start;row-gap:20px}.filters>label,.filters>.field-label{flex:1 1 210px;min-width:180px;line-height:26px}.filters>button,.filters>a.button,.filters>.filter-actions{margin:32px 0 0;align-self:flex-start;flex:0 0 auto}.filters>button,.filters>a.button,.filter-actions>button,.filter-actions>.button{min-height:52px;white-space:nowrap;line-height:26px}.filter-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.filters .combo-trigger{min-height:52px}.filters .date-hint{line-height:1.5}.page-actions{gap:12px}.page-actions>.button{white-space:nowrap}.topbar .env{white-space:nowrap;max-width:none}.late-overview+.row{margin-top:24px}.card>.button+p{margin-top:16px}.card>p+p{margin-top:8px}
.action-panel{padding:24px;border:1px solid var(--line);border-radius:18px;background:white;margin-bottom:24px}.action-panel>summary{font-size:20px;font-weight:700}.action-panel[open]>summary{margin-bottom:20px}
.form-modal{width:min(900px,calc(100vw - 32px));max-width:900px;max-height:calc(100dvh - 32px);padding:0;border-radius:22px;overflow:auto}.form-modal>header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 28px;border-bottom:1px solid var(--line);background:#fff;position:sticky;top:0;z-index:2}.form-modal>header h2{font-size:24px}.form-modal-body{padding:28px}.form-modal-body>p{margin:20px 0 0}.form-modal .form-grid{gap:22px}.form-modal .form-actions{margin-top:24px}.form-modal .combo-popup{z-index:110}.form-modal .policy-note{grid-column:1/-1}.form-modal-body .card{margin:0}
.batch-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:20px;padding:20px;background:#f7f7f6;border:1px solid #f7f7f6;border-radius:16px}.batch-toolbar>label:first-child{flex:1 1 260px}.batch-toolbar>strong{color:#252a2e;white-space:nowrap}.batch-help{margin:16px 0 24px}.batch-people{display:grid;gap:24px}.batch-person{border:1px solid #e4e4e0;border-radius:18px;overflow:visible;background:#fff;min-width:0}.batch-person-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px;padding:22px 24px}.batch-person-header h3{font-size:22px}.batch-person-header p{margin-top:4px}.batch-person-header .checkline{margin:0;white-space:nowrap}.batch-net{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:16px 24px;background:#f7f7f6;border-block:1px solid #f7f7f6}.batch-net strong{font-size:24px;color:#252a2e;font-variant-numeric:tabular-nums}.batch-editor>summary{padding:18px 24px;font-weight:700;color:var(--brand-text,#0865c9);cursor:pointer}.batch-editor-body{padding:4px 24px 24px;display:grid;gap:24px}.batch-editor fieldset{min-width:0;margin:0;padding:20px;border:1px solid #e4e4e0;border-radius:14px}.batch-editor legend{font-size:20px;font-weight:700;padding:0 8px}.batch-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.batch-fields.two{grid-template-columns:repeat(2,minmax(0,1fr))}.batch-fields .deduction-control{display:grid;align-content:start;gap:16px;padding:24px;min-width:0}.batch-fields .deduction-control>div{margin-top:0}.batch-fields .deduction-control small{margin:0}.batch-fields .deduction-control a{margin-top:0}.batch-fields [data-ss-fields],.batch-fields [data-tax-fixed],.batch-fields [data-tax-annual]{display:grid;gap:12px}.batch-confirm{display:grid;gap:16px;margin-top:28px;padding:24px;background:#f7f7f6;border:1px solid #f7f7f6;border-radius:16px}.batch-existing{padding:0 24px 22px;display:flex;gap:16px;align-items:center;flex-wrap:wrap}
@media(max-width:900px){.pagehead{align-items:flex-start;flex-direction:column;gap:20px}.batch-fields{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.filters>label,.filters>.field-label{flex-basis:100%;min-width:0;width:100%}.filters>button,.filters>a.button,.filters>.filter-actions{margin-top:0}.filters>.filter-actions{width:100%;gap:12px}.filter-actions>button,.filter-actions>.button{flex:1}.form-modal{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);border-radius:16px}.form-modal>header{padding:16px}.form-modal>header h2{font-size:20px}.form-modal-body{padding:20px 16px}.batch-fields,.batch-fields.two{grid-template-columns:minmax(0,1fr)}.batch-person-header,.batch-net{padding:18px}.batch-editor>summary{padding:18px}.batch-editor-body{padding:0 14px 18px}.batch-editor fieldset{padding:16px 12px}.batch-confirm{padding:18px}.batch-toolbar{padding:18px}.page-actions{width:100%}.page-actions>.button{flex:1 1 auto}.topbar .env{font-size:16px}}

.batch-editor>fieldset.batch-editor-body{margin:0;border:0;border-radius:0;padding:4px 24px 24px}.batch-editor>fieldset.batch-editor-body:disabled{opacity:.55}.batch-editor>fieldset:disabled .combo-trigger{pointer-events:none}.batch-editor>fieldset:disabled a{pointer-events:none}@media(max-width:760px){.batch-editor>fieldset.batch-editor-body{padding:0 14px 18px}}

@media(max-width:760px){.batch-fields .deduction-control{padding:18px;gap:16px}}

/* Leave entitlement: a common visual language for available, reserved and exhausted days. */
.leave-balance-owner{margin:12px 0;font-size:18px}.leave-balance-legend{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0}.leave-balance-legend span{padding:7px 12px;border-radius:9px;font-weight:600}.leave-balance-legend .available{color:#12603b;background:#e8f7ef}.leave-balance-legend .low{color:#854408;background:#fff3dc}.leave-balance-legend .empty{color:#a42337;background:#fff0f2}
.leave-balance-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:24px;margin-top:24px}.leave-balance{--balance-ink:#12603b;--balance-light:#effaf4;--balance-start:#18804f;--balance-end:#43bf80;display:flex;flex-direction:column;min-width:0;border:1px solid #cdded5;border-radius:20px;padding:24px;background:linear-gradient(160deg,var(--balance-light),#fff 60%)}.leave-balance--low{--balance-ink:#854408;--balance-light:#fff7e8;--balance-start:#cf700c;--balance-end:#f4ae3d;border-color:#e7cea4}.leave-balance--empty{--balance-ink:#a42337;--balance-light:#fff2f3;--balance-start:#bd2840;--balance-end:#e45e72;border-color:#e9bdc5}.leave-balance--special{--balance-ink:var(--brand-text,#0865c9);--balance-light:#f7f7f6;border-color:#e4e4e0}
.leave-balance>header{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:24px}.leave-balance h3{font-size:22px;line-height:1.5;margin:0;overflow-wrap:anywhere}.leave-balance-status{color:var(--balance-ink);font-size:16px;font-weight:650;display:inline-flex;align-items:center;gap:8px}.leave-balance-status>span{display:grid;place-items:center;border:1px solid currentColor;border-radius:50%;width:24px;height:24px;flex-shrink:0}.leave-remaining{display:flex;align-items:baseline;justify-content:space-between;gap:12px;color:var(--balance-ink)}.leave-remaining>strong{font-size:40px;line-height:1.3;font-variant-numeric:tabular-nums}.leave-remaining small{font-size:18px;font-weight:500;margin-left:8px}.leave-meter{height:16px;border-radius:99px;background:#e3eae6;overflow:hidden;margin:16px 0 24px;box-shadow:inset 0 1px 2px #17312612}.leave-meter>span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--balance-start),var(--balance-end));transition:width .25s ease}.leave-balance--empty .leave-meter{background:repeating-linear-gradient(135deg,#f4dce1,#f4dce1 9px,#fbe9ed 9px,#fbe9ed 18px);outline:1px solid #e6bec7}
.leave-balance-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0}.leave-balance-stats>div{padding:12px 10px;background:#f7f7f6;border-radius:12px;min-width:0}.leave-balance-stats dt{font-size:16px;color:var(--brand-text,#0865c9);margin:0 0 8px;overflow-wrap:anywhere}.leave-balance-stats dd{font-size:18px;font-weight:700;margin:0;color:#252a2e;overflow-wrap:anywhere}.leave-balance-stats .leave-used{background:#f7f7f6}.leave-balance-stats .leave-used dd{color:var(--brand-text,#0865c9)}.leave-balance-stats .leave-pending{background:#fff3dd}.leave-balance-stats .leave-pending dd{color:#80500b}.leave-special-note{background:#f7f7f6;border:1px dashed #e4e4e0;border-radius:12px;padding:16px;color:var(--brand-text,#0865c9);margin-bottom:24px;line-height:1.65}.leave-balance>footer{margin-top:auto;padding-top:20px;display:grid;gap:16px}.leave-balance>footer p{font-size:16px;line-height:1.65;color:var(--brand-text,#0865c9);margin:0}.leave-balance>footer button{width:100%;white-space:normal;line-height:1.5;min-height:50px}.leave-balance>footer button:disabled{color:#914354;background:#f8e9ec;border-color:#e1bbc3;opacity:1;cursor:not-allowed}.leave-view-only{font-size:16px;color:var(--brand-text,#0865c9);padding-top:8px}
@media(max-width:600px){.leave-balance-grid{gap:18px}.leave-balance{padding:20px}.leave-balance-stats{grid-template-columns:1fr}.leave-balance-stats>div{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:12px}.leave-balance-stats dt{margin:0}.leave-remaining>strong{font-size:36px}}
@media(prefers-reduced-motion:reduce){.leave-meter>span{transition:none}}
/* Leave request workspace: status filters, contextual actions and one focused detail dialog. */
.leave-status-tabs{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0}.leave-status-tab{display:inline-flex;align-items:center;gap:10px;border:1px solid #e4e4e0;background:#fff;padding:12px 16px;border-radius:12px;color:var(--brand-text,#0865c9);font-weight:600}.leave-status-tab span{background:#f7f7f6;padding:2px 9px;border-radius:20px;font-variant-numeric:tabular-nums}.leave-status-tab.active{background:#252a2e;color:white;border-color:#252a2e}.leave-status-tab.active span{background:#fff;color:#252a2e}.leave-change-note{white-space:normal;overflow-wrap:anywhere;max-width:420px;margin-top:12px;padding:12px 14px;background:#fff4e4;border-left:3px solid #c78722;border-radius:8px;color:#64410c;font-size:16px;line-height:1.65}
.leave-detail-dialog{width:min(1060px,calc(100vw - 32px));max-width:1060px;max-height:calc(100dvh - 32px);padding:0;border:1px solid #e4e4e0;border-radius:22px;color:#252a2e;background:#f7f7f6}.leave-detail-dialog::backdrop{background:#4444446e;backdrop-filter:blur(3px)}.leave-detail-dialog>header{position:sticky;top:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 28px;background:#fff;border-bottom:1px solid #e4e4e0}.leave-detail-dialog>header h2{font-size:24px;margin:0}.leave-detail-dialog [data-leave-dialog-body]{padding:28px;min-width:0}.leave-detail-dialog .card{padding:24px;margin-bottom:20px}.leave-detail-dialog .form-grid{gap:20px}.leave-detail-dialog .form-actions{margin-top:24px}.leave-detail-dialog .combo-popup{z-index:110}.leave-management{padding:22px 24px;border:1px solid #e4e4e0;border-radius:16px;background:#fff;margin:20px 0}.leave-management>summary{font-size:20px;font-weight:650;color:#252a2e}.leave-management[open]>summary{margin-bottom:20px}.leave-management>p{margin-bottom:20px}.leave-delete>summary{color:#9b2638}[data-leave-list][aria-busy=true]{opacity:.55;pointer-events:none}.leave-balance>footer button:not(:disabled){color:#fff;background:#14764c;border-color:#11673f;box-shadow:0 3px 8px #14764c20}.leave-balance>footer button:not(:disabled):hover{background:#0c603a}.leave-balance>footer button:disabled{background:#f7f7f6;color:var(--brand-text,#0865c9);border-color:#e4e4e0;cursor:not-allowed;box-shadow:none}
@media(max-width:600px){.leave-detail-dialog{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);border-radius:16px}.leave-detail-dialog>header{padding:16px}.leave-detail-dialog>header h2{font-size:20px}.leave-detail-dialog [data-leave-dialog-body]{padding:16px}.leave-detail-dialog .card,.leave-management{padding:18px}.leave-status-tabs{gap:8px}.leave-status-tab{padding:10px 12px;flex:1 1 calc(50% - 8px);justify-content:space-between}.leave-change-note{max-width:260px}}

.leave-attachments{margin-top:20px;border-top:1px solid #e4e4e0;padding-top:16px}.leave-attachments>summary{font-size:18px;font-weight:600;color:var(--brand-text,#0865c9)}.leave-attachments[open]>summary{margin-bottom:20px}.leave-detail-dialog .table-wrap{margin-bottom:20px}

/* Company identity: retain natural logo proportions at every breakpoint. */
.brand.company-brand{justify-content:center;min-height:76px;padding:12px 16px;box-sizing:border-box}.brand.company-brand img{display:block;width:auto;height:auto!important;max-width:100%!important;max-height:64px!important;object-fit:contain}.slip-art-options{min-width:0;padding:20px;margin:20px 0;border:1px solid #f7f7f6;border-radius:16px;background:#f7f7f6}.slip-art-options legend{font-weight:700;padding:0 8px}.slip-art-options .grid{gap:20px}.slip-art-options p{margin:16px 0 0;line-height:1.65}

.receipt-reminder,.receipt-complete{padding:24px;margin:0 0 24px;border:1px solid #fecaca;border-radius:18px;background:#fff7f7}.receipt-reminder h2{color:#a21c2e}.receipt-reminder>p,.receipt-complete>p{margin:12px 0}.receipt-reminder .table-wrap{margin-top:20px}.receipt-complete{border-color:#b9e5ce;background:#f1fbf5}.receipt-complete h2{color:#126b44}.receipt-todo a{color:#a21c2e;font-weight:650}.readiness-popover{max-height:min(75vh,640px);overflow:auto}@media(max-width:760px){.receipt-reminder,.receipt-complete{padding:20px 16px}}

/* Missing-month payroll selection keeps controls readable on mobile. */
.backfill-months{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:20px}
.backfill-month{border:1px solid #e4e4e0;border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:12px;background:#fff}
.backfill-month:has(input:checked){border-color:var(--brand-text,#0865c9);background:#f7f7f6;box-shadow:0 0 0 1px var(--brand-text,#0865c9)}
.backfill-month.unavailable{background:#f7f7f6}.backfill-tools{margin-top:24px;gap:12px}
@media(max-width:480px){.backfill-months{grid-template-columns:1fr}.backfill-tools>*{flex:1 1 auto}}

#backfill-review .table-wrap+p{margin-top:20px}#backfill-review{scroll-margin-top:24px}

.approval-tools{gap:12px;margin:20px 0}.approval-toolbar{position:sticky;top:8px;z-index:4;background:#f7f7f6;border:1px solid #e4e4e0;border-radius:16px;padding:20px;margin:20px 0;display:grid;gap:14px;box-shadow:0 5px 20px #44444410}.approval-toolbar>button{justify-self:start}.approval-dialog{width:min(960px,calc(100vw - 32px));max-height:90dvh;border:1px solid #e4e4e0;border-radius:20px;padding:24px;color:var(--ink)}.approval-dialog::backdrop{background:#44444488}.approval-dialog header{margin-bottom:24px}.approval-dialog [data-approval-body]{display:grid;gap:16px}.approval-dialog [data-approval-body]>p,.approval-dialog [data-approval-body]>.table-wrap{margin:0}.approval-dialog .form-actions{margin-top:20px}.approval-dialog{overflow:auto}@media(max-width:760px){.approval-toolbar{position:static;padding:16px}.approval-toolbar>button{width:100%}.approval-dialog{padding:16px;width:calc(100vw - 16px)}}

/* 2.0.9: shared selfie and attachment viewer. Controls never overlap the image. */
html.image-preview-open{overflow:hidden}
dialog.image-dialog{box-sizing:border-box;width:min(960px,calc(100vw - 32px));max-width:calc(100vw - 32px);height:min(860px,calc(100vh - 32px));height:min(860px,calc(100dvh - 32px));max-height:calc(100dvh - 32px);padding:0;border:1px solid #dededb;border-radius:22px;background:#fff;color:#202124;overflow:hidden;box-shadow:0 24px 90px #0005}
dialog.image-dialog[open]{display:flex;flex-direction:column}
dialog.image-dialog::backdrop{background:#17191db3;backdrop-filter:blur(4px)}
.image-dialog>.image-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:16px;flex:none;padding:14px 20px;border-bottom:1px solid #e3e3e0;background:#fff}
.image-dialog-header h2{min-width:0;margin:0;font-size:18px;line-height:1.5;font-weight:650;color:#202124;overflow-wrap:anywhere}
.image-dialog .image-dialog-close{display:inline-flex;align-items:center;justify-content:center;gap:10px;flex:none;width:auto;min-width:80px;min-height:44px;margin:0;padding:8px 14px;border:1px solid #dcdedb;border-radius:12px;background:#f4f4f2;color:#202124;line-height:1.4;font-size:15px;font-weight:600;box-shadow:none;cursor:pointer}
.image-dialog .image-dialog-close span:last-child{font-size:26px;font-weight:400;line-height:1}
.image-dialog .image-dialog-close:hover{background:#e8e8e5;color:#101010}
.image-dialog .image-dialog-close:focus-visible{outline:2px solid #202124;outline-offset:3px}
.image-dialog>.image-dialog-stage{display:flex;flex:1;min-height:0;min-width:0;align-items:center;justify-content:center;padding:20px;background:#f7f7f6;overflow:hidden}
.image-dialog .image-dialog-stage img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;min-height:0;object-fit:contain;border-radius:8px}
.image-dialog .image-dialog-status{max-width:36em;margin:0;padding:24px;text-align:center;font-size:16px;line-height:1.7;color:#55595c;overflow-wrap:anywhere}
.image-dialog [hidden]{display:none!important}
@media(max-width:600px){
 dialog.image-dialog{width:calc(100vw - 20px);max-width:calc(100vw - 20px);height:calc(100vh - 24px);height:calc(100dvh - 24px);max-height:calc(100dvh - 24px);border-radius:18px}
 .image-dialog>.image-dialog-header{padding:12px 16px;padding-top:max(12px,env(safe-area-inset-top,0px))}
 .image-dialog>.image-dialog-stage{padding:12px;padding-bottom:max(12px,env(safe-area-inset-bottom,0px))}
}

/* 2.0.10: readable personal attendance links with explicit share actions. */
.attendance-link-card{padding:24px;border:1px solid #dededb;border-radius:18px;margin:0 0 18px;min-width:0;background:#fff}
.attendance-link-card>header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.attendance-link-card h3{margin:0 0 6px;font-size:19px;color:#202124}.attendance-link-card header p{margin:0;font-size:14px}
.attendance-link-share>label{display:block;margin-bottom:8px;font-weight:600}.attendance-link-share>div{display:flex;align-items:center;gap:10px;min-width:0;flex-wrap:wrap}
.attendance-link-share input{flex:1 1 280px;min-width:0;width:100%;font-family:monospace;font-size:14px;height:48px;background:#f7f7f6}
.attendance-link-share button,.attendance-link-share a{min-height:48px;white-space:nowrap;margin:0}
.attendance-link-share small{display:block;color:#626568;margin-top:10px;line-height:1.6;overflow-wrap:anywhere}
.attendance-link-card>footer{border-top:1px solid #ededeb;margin-top:20px;padding-top:14px}.attendance-link-card footer form{display:flex;margin:0;justify-content:flex-end;gap:0}.attendance-link-card footer button{background:#fff;color:#a52630;border:1px solid #e2b7bb;min-height:44px;padding:8px 14px}.attendance-link-card footer [data-result]:empty{display:none}
@media(max-width:600px){.attendance-link-card{padding:18px}.attendance-link-share input{flex-basis:100%}.attendance-link-share button,.attendance-link-share a{flex:1;text-align:center;justify-content:center;font-size:14px}}

/* 2.0.11: financial actions stay readable at every width. */
.filters>.trash-more{flex:1 0 100%;width:100%;padding:4px 0}.trash-more>summary{cursor:pointer;font-weight:600}.trash-more[open]>.form-grid{margin-top:20px;gap:20px}.filters:has(>.trash-more)>button,.filters:has(>.trash-more)>a.button{margin-top:0}
[data-approval-form]>.full>.table-wrap table{min-width:0;width:100%;table-layout:fixed;font-size:14px}
[data-approval-form] th,[data-approval-form] td{white-space:normal;overflow-wrap:anywhere;padding:14px 8px}
[data-approval-form] th:first-child{width:6%}[data-approval-form] th:nth-child(2){width:20%}[data-approval-form] th:nth-child(3){width:17%}[data-approval-form] th:nth-child(4){width:14%}[data-approval-form] th:nth-child(5),[data-approval-form] th:nth-child(6),[data-approval-form] th:nth-child(7){width:10%}[data-approval-form] th:last-child{width:13%}
@media(max-width:900px){
[data-approval-form]>.full>.table-wrap{overflow:visible}[data-approval-form] table,[data-approval-form] tbody{display:block;min-width:0!important}[data-approval-form] thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
[data-approval-form] tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;background:#fff;border:1px solid #ddd;border-radius:16px;padding:18px;margin:16px 0}
[data-approval-form] tbody td{display:block;border:0;padding:0;min-width:0;font-size:15px;line-height:1.6;text-align:left}[data-approval-form] tbody td::before{content:attr(data-label);display:block;font-size:12px;color:#626262;font-weight:500;margin-bottom:4px}[data-approval-form] tbody td:first-child,[data-approval-form] tbody td:nth-child(2),[data-approval-form] tbody td:last-child{grid-column:1/-1}[data-approval-form] tbody td:first-child{display:flex;align-items:center;gap:12px}[data-approval-form] tbody td:last-child button{width:100%}[data-approval-form] tbody td input[type=checkbox]{width:24px;height:24px;margin:0}
}

/* Checkbox/radio controls must not inherit the minimum width of table text fields. */
table input[type="checkbox"],table input[type="radio"]{min-width:0!important;width:22px!important;height:22px;flex:0 0 22px;margin:0;vertical-align:middle}

/* 2.0.12: category records remain compact; editing belongs in the action dialog. */
.category-list-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}
.category-list-heading h2{margin:0}.category-list .table-wrap{margin:0}.category-list table{table-layout:fixed;width:100%;min-width:0}
.category-list th:nth-child(1){width:34%}.category-list th:nth-child(2){width:14%}.category-list th:nth-child(3){width:30%}.category-list th:nth-child(4){width:22%}
.category-list td{padding:20px 14px;overflow-wrap:anywhere}.category-name{display:flex;align-items:center;gap:12px;min-width:0}.category-name>div{min-width:0}.category-name small,.category-state small{display:block;margin-top:5px;font-size:13px;line-height:1.6;color:#676b70}
.category-swatch{width:20px;height:20px;border-radius:6px;background:var(--category-color);border:1px solid #0002;flex:0 0 20px}.category-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.category-actions .button{min-height:42px;padding:8px 14px;font-size:14px;white-space:nowrap}
.category-editor .form-grid{grid-template-columns:minmax(0,1fr) 120px;gap:24px}.category-editor input[type=color]{display:block;width:80px;max-width:100%;height:52px;min-height:52px;padding:6px;cursor:pointer;border-radius:12px}.category-editor input[type=color]::-webkit-color-swatch-wrapper{padding:0}.category-editor input[type=color]::-webkit-color-swatch{border:0;border-radius:6px}.category-editor input[type=color]::-moz-color-swatch{border:0;border-radius:6px}.category-delete-note{margin:0 0 20px}
@media(max-width:760px){.category-list table,.category-list tbody{display:block}.category-list thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.category-list tbody tr{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:20px 0;border-bottom:1px solid #e4e4e0}.category-list tbody tr:last-child{border-bottom:0}.category-list tbody td{display:block;padding:0;border:0;white-space:normal}.category-list tbody td:first-child,.category-list tbody td:nth-child(3),.category-list tbody td:last-child{grid-column:1/-1}.category-list tbody td:nth-child(2)::before{content:attr(data-label) " · ";font-size:13px;color:#676b70}.category-editor .form-grid{grid-template-columns:minmax(0,1fr)}.category-list-heading{align-items:flex-start}}

/* Company color is the first explicit choice; existing stored colors remain selected. */
.color-field{min-width:0;display:grid;align-content:start;gap:8px}.color-field>label{margin:0}.color-options{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}.color-options .color-brand{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:10px 14px;color:#242424!important;background:#fff!important;white-space:nowrap}.color-brand[aria-pressed=true]{box-shadow:inset 0 0 0 1px #555}.color-brand span,.mail-brand-color span{display:inline-block;width:18px;height:18px;border:1px solid #0003;border-radius:50%;flex:none}.color-options input[type=color],.category-editor .color-options input[type=color]{width:56px;height:48px;min-width:56px;max-width:56px;margin:0;padding:5px;cursor:pointer;flex:none}.color-value{font:12px ui-monospace,monospace;color:#52575b}.mail-brand-color{display:inline-flex;align-items:center;gap:6px}.category-editor .form-grid{grid-template-columns:minmax(0,1fr) minmax(250px,1fr)}
@media(max-width:760px){.category-editor .form-grid{grid-template-columns:minmax(0,1fr)}.color-options{gap:8px}}

.expense-row-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:128px}.expense-row-actions>a{white-space:nowrap}.expense-row-actions .expense-delete{color:#aa2435!important;border-color:#e6c4c8!important;background:#fff!important;min-height:40px;padding:8px 14px}.expense-row-actions .expense-delete:hover{background:#fff1f2!important}

/* Points-funded annual leave: readable metrics and confirmation spacing. */
.leave-credit-page .card > p { margin: .75rem 0 1rem; }
.leave-credit-page .reward-balance { display:block; font-size:clamp(1.7rem,3vw,2.25rem); margin:.35rem 0 1rem; color:var(--text,#242424); }
.leave-credit-page .grid > div { padding:1rem 1.25rem; border:1px solid var(--border,#ddd); border-radius:16px; background:#f7f7f6; min-width:0; }
.leave-credit-page .grid { margin:1rem 0; }
.leave-credit-page .checkline { align-items:flex-start; padding:1rem; border:1px solid #ddd; border-radius:12px; }
@media(max-width:760px){
.leave-credit-page .table-wrap{overflow:visible}.leave-credit-page table,.leave-credit-page tbody{display:block;min-width:0;width:100%}.leave-credit-page thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.leave-credit-page tbody tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;padding:20px 0;border-bottom:1px solid #ddd}.leave-credit-page tbody td{display:block;padding:0;min-width:0;white-space:normal;border:0;overflow-wrap:anywhere}.leave-credit-page tbody td::before{content:attr(data-label);display:block;font-size:12px;color:#666;margin-bottom:5px}.leave-credit-page tbody td:first-child,.leave-credit-page tbody td:nth-child(5),.leave-credit-page tbody td:last-child{grid-column:1/-1}.leave-credit-page tbody td:last-child a{width:100%}
}