:root{--ph2-font:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans TC",Arial,sans-serif;--ph2-bg:#f4f6fb;--ph2-text:#172033;--ph2-muted:#64748b;--ph2-primary:#4f46e5;--ph2-primary-soft:#eef2ff;--ph2-danger:#dc2626;--ph2-ok:#15803d;--ph2-card:#fff;--ph2-line:#e2e8f0;--ph2-font-base:14px;--ph2-tab-h:62px;--ph2-safe-bottom:env(safe-area-inset-bottom,0px);}
body.ph2-theme-female{--ph2-primary:#db2777;--ph2-primary-soft:#fdf2f8;}
body.ph2-theme-female header,body.ph2-theme-female .topbar{background:linear-gradient(135deg,#9d174d,#db2777) !important;}
body.ph2-theme-female .navbar{background:linear-gradient(135deg,#9d174d,#db2777) !important;}
.navbar.female{background:linear-gradient(135deg,#9d174d,#db2777) !important;}
.ph2-user-name,.navbar-user{font-size:13px;font-weight:700;opacity:.92;max-width:38vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:0;}
.ph2-reviewer-chip{display:inline-flex;align-items:center;gap:4px;border:1px solid rgba(255,255,255,.38);background:rgba(255,255,255,.16);color:#fff;border-radius:999px;padding:6px 11px;font-size:12px;font-weight:800;text-decoration:none;white-space:nowrap;flex-shrink:0;}
.ph2-reviewer-chip:hover{background:rgba(255,255,255,.28);}
.ph2-back-bar{display:none;align-items:center;gap:10px;padding:10px 14px 8px;background:#fff;border-bottom:1px solid var(--ph2-line);position:sticky;top:0;z-index:25;box-shadow:0 2px 8px rgba(15,23,42,.06);}
.ph2-back-btn{display:inline-flex;align-items:center;gap:4px;color:var(--ph2-primary);font-size:14px;font-weight:800;text-decoration:none;padding:6px 10px;border-radius:8px;background:var(--ph2-primary-soft);border:1px solid rgba(79,70,229,.18);white-space:nowrap;}
.ph2-back-title{font-size:15px;font-weight:800;color:var(--ph2-text);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ph2-bottom-tab{position:fixed;left:0;right:0;bottom:0;z-index:90;display:none;height:calc(var(--ph2-tab-h)+var(--ph2-safe-bottom));padding:6px 6px var(--ph2-safe-bottom);background:rgba(255,255,255,.97);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--ph2-line);box-shadow:0 -6px 20px rgba(15,23,42,.08);grid-template-columns:repeat(4,1fr);gap:2px;}
.ph2-tab-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:0;background:transparent;color:#64748b;text-decoration:none;font-size:11px;font-weight:800;border-radius:12px;min-height:50px;cursor:pointer;-webkit-tap-highlight-color:transparent;position:relative;}
.ph2-tab-item .ico{font-size:22px;line-height:1;}
.ph2-tab-item.active{color:var(--ph2-primary);background:var(--ph2-primary-soft);}
.ph2-tab-item .dot{position:absolute;right:18%;top:6px;width:8px;height:8px;border-radius:50%;background:var(--ph2-danger);border:2px solid #fff;display:none;}
.ph2-tab-item.has-unread .dot{display:block;}
@media(max-width:860px){.ph2-back-bar{display:flex}.ph2-bottom-tab{display:grid}body.ph2-employee-shell main,body.ph2-employee-shell .container,body.ph2-employee-shell .wrap{padding-bottom:calc(var(--ph2-tab-h)+var(--ph2-safe-bottom)+16px) !important}body.ph2-employee-shell header,body.ph2-employee-shell .topbar{position:sticky;top:0;z-index:30}.ph2-hide-on-mobile-nav{display:none !important}.header-actions a.btn-nav[href="/employee/dashboard"],.header-actions a.btn-nav[href="/employee/overtime"],.header-actions a.btn-nav[href="/employee/overtime/entitlements"],.header-actions a.btn-nav[href="/workspace"],.nav-actions a.btn-nav[href="/employee/dashboard"],.nav-actions a.btn-nav[href="/employee/leaves"],.nav-actions a.btn-nav[href="/workspace"],.navbar a.navbar-logout[href="/employee/leaves"],.navbar a.navbar-logout[href="/employee/overtime"],.navbar a.navbar-logout[href="/employee/overtime/entitlements"],.navbar a.navbar-logout[href="/employee/attendance-corrections"],.navbar a.navbar-logout[href="/workspace"]{display:none !important}}
@media(min-width:861px){.ph2-bottom-tab{display:none !important}.ph2-back-bar{display:none !important}}
/* UI_BATCH1_FEMALE_HEADER_Q_CSS */
body.ph2-theme-female #phase2-mobile-attendance-header-v44 {
    background: linear-gradient(135deg, #9d174d 0%, #db2777 100%) !important;
}
/* PHASE2_HR_R59_EMPLOYEE_SHELL_DEDUP: global navigation owns product-level navigation. */
@media(max-width:860px){
  body.phase2-global-nav-mounted.ph2-employee-shell main,
  body.phase2-global-nav-mounted.ph2-employee-shell .container,
  body.phase2-global-nav-mounted.ph2-employee-shell .wrap{padding-bottom:16px !important}
  body.phase2-global-nav-mounted .ph2-bottom-tab{display:none !important}
}