:root{--bg-main: #f8fafb;--sidebar-bg: #B91116;--sidebar-head: #9A0E12;--menu-hover: rgba(255,255,255,.1);--menu-active: #D9131A;--text-main: #1a1a2e;--loader-bg: rgba(248,250,251,.9);--login-box: #ffffff;--login-border: #e5e7eb;--bg-surface: rgba(255,255,255,.85);--bg-payslip: rgba(255,255,255,.95);--bg-hover: rgba(29,158,117,.1);--bg-header: rgba(249,250,251,.6);--border-color: rgba(229,231,235,.7);--border-light: rgba(243,244,246,.7);--text-muted: #6b7280;--text-light: #9ca3af;--text-title: #374151;--text-danger: #dc2626;--val-green: #0a6147;--input-bg: rgba(255,255,255,.8);--input-border: #d1d5db;--tooltip-bg: rgba(220,252,231,.9);--tooltip-text: #1D9E75;--modal-bg: rgba(0,0,0,.4);--bg-warning: rgba(255,251,235,.85);--border-warning: rgba(253,230,138,.8);--text-warning: #92400e;--ci-red: #d32f2f}[data-theme=dark]{--bg-main: #121212;--sidebar-bg: #1a1a1a;--sidebar-head: #111111;--menu-hover: rgba(255,255,255,.05);--menu-active: #333333;--text-main: #f3f4f6;--loader-bg: rgba(18,18,18,.9);--login-box: #1e1e1e;--login-border: #333333;--bg-surface: rgba(30,30,30,.85);--bg-payslip: rgba(20,20,20,.95);--bg-hover: rgba(255,255,255,.05);--bg-header: rgba(42,42,42,.5);--border-color: rgba(51,51,51,.7);--border-light: rgba(42,42,42,.7);--text-muted: #9ca3af;--text-light: #6b7280;--text-title: #e5e7eb;--text-danger: #ef4444;--val-green: #4ade80;--input-bg: rgba(42,42,42,.8);--input-border: #444444;--tooltip-bg: rgba(6,78,59,.9);--tooltip-text: #34d399;--modal-bg: rgba(0,0,0,.7);--bg-warning: rgba(146,64,14,.2);--border-warning: rgba(146,64,14,.5);--text-warning: #fcd34d;--ci-red: #ef5350}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%}body{font-family:Sarabun,sans-serif;font-size:14px;background:var(--bg-main);color:var(--text-main);transition:background .3s,color .3s;overflow:hidden}body.body-scrollable{overflow:auto}body.body-scrollable #root{height:auto;min-height:100%}.apply-portal{max-width:480px;margin:0 auto;padding:0 16px 48px;min-height:100vh;min-height:100dvh}.app-layout{display:flex;height:100vh;width:100%;overflow:hidden}.sidebar{width:240px;background:var(--sidebar-bg);color:#fff;display:flex;flex-direction:column;flex-shrink:0;box-shadow:2px 0 8px #0000001a;z-index:20;transition:width .3s ease,background .3s;overflow-x:hidden;white-space:nowrap}.sidebar.collapsed{width:75px}.sidebar.collapsed .brand-title,.sidebar.collapsed .brand-sub,.sidebar.collapsed .nav-text{display:none}.sidebar.collapsed .logo-spin-3d{width:45px;margin-bottom:0}.sidebar.collapsed .brand{padding:15px 0}.sidebar.collapsed .nav-item,.sidebar.collapsed .theme-toggle,.sidebar.collapsed .logout-btn,.sidebar.collapsed .toggle-sidebar-btn{padding:14px 0;justify-content:center;border-left:4px solid transparent}.sidebar.collapsed .nav-item.active{border-left:4px solid #fff}.sidebar.collapsed .divider{margin:12px 15px!important}.brand{padding:20px 16px;text-align:center;border-bottom:1px solid rgba(255,255,255,.1);background:var(--sidebar-head);transition:background .3s,padding .3s;cursor:pointer;-webkit-user-select:none;user-select:none}.logo-spin-3d{width:130px;height:auto;margin:0 auto 15px;display:block;animation:holoTilt 6s ease-in-out infinite;transition:width .3s;transform-style:preserve-3d;background:radial-gradient(circle,rgba(255,255,255,.7) 20%,transparent 65%);border-radius:50%;padding:10px}@keyframes holoTilt{0%,to{transform:perspective(400px) rotateY(-12deg) rotateX(4deg);filter:drop-shadow(0 0 2px #fff) drop-shadow(3px 3px 5px rgba(0,0,0,.5)) drop-shadow(-2px 0 12px rgba(255,215,0,.7))}50%{transform:perspective(400px) rotateY(12deg) rotateX(-4deg);filter:drop-shadow(0 0 2px #fff) drop-shadow(-3px 3px 5px rgba(0,0,0,.5)) drop-shadow(2px 0 15px rgba(255,215,0,1))}}.brand-title{font-size:13px;font-weight:600;line-height:1.4}.brand-sub{font-size:12px;font-weight:400;opacity:.9;display:block;margin-top:4px;color:#fecaca}.nav-menu{flex:1;overflow-y:auto;padding:16px 0 0;display:flex;flex-direction:column;overflow-x:hidden}.nav-item,.theme-toggle,.logout-btn,.toggle-sidebar-btn{padding:14px 20px;cursor:pointer;font-size:14px;transition:.2s;display:flex;align-items:center;gap:10px;opacity:.9;border-left:4px solid transparent;-webkit-user-select:none;user-select:none}.nav-icon{font-size:16px;min-width:24px;text-align:center;flex-shrink:0}.nav-text{white-space:nowrap;overflow:hidden}.nav-item:hover{background:var(--menu-hover);opacity:1}.nav-item.active{background:var(--menu-active);font-weight:500;border-left:4px solid #fff;opacity:1}.divider{height:1px;background:#ffffff1a;margin:12px 20px;flex-shrink:0}.nav-search{padding:10px 14px 4px;flex-shrink:0}.sidebar .nav-search input{width:100%;box-sizing:border-box;background:#fff;color:#1a1a2e;border:1px solid transparent;border-radius:7px;padding:7px 10px;font-size:13px;font-family:Sarabun}.sidebar .nav-search input::placeholder{color:#4b5563;opacity:1}[data-theme=dark] .sidebar .nav-search input{background:#2f2f2f;color:#f3f4f6;border-color:#555}[data-theme=dark] .sidebar .nav-search input::placeholder{color:#c4c8cf}.sidebar .nav-search input:focus{outline:none;border-color:#fff;box-shadow:none}.sidebar.collapsed .nav-search{display:none}.nav-empty{padding:14px 20px;font-size:13px;opacity:.7}.nav-group{flex-shrink:0}.nav-group-head{padding:12px 20px;cursor:pointer;font-size:14px;font-weight:600;display:flex;align-items:center;gap:10px;border-left:4px solid transparent;-webkit-user-select:none;user-select:none;opacity:.95;transition:.2s}.nav-group-head:hover{background:var(--menu-hover);opacity:1}.nav-group-head.has-active{border-left-color:#ffffff8c;background:#ffffff0f}.nav-caret{margin-left:auto;font-size:12px;opacity:.8}.nav-group-items .nav-item{padding:10px 20px 10px 38px;font-size:13px}.sidebar.collapsed .nav-group-head{padding:14px 0;justify-content:center}.nav-footer{flex-shrink:0;border-top:1px solid rgba(255,255,255,.1);background:var(--sidebar-bg)}.nav-popover{position:fixed;left:75px;min-width:220px;z-index:40;overflow-y:auto;background:var(--sidebar-head);color:#fff;border-radius:0 8px 8px 0;box-shadow:4px 4px 14px #00000059;padding-bottom:6px}.nav-popover-title{padding:10px 16px 6px;font-size:12px;font-weight:600;opacity:.7}.sidebar.collapsed .nav-popover .nav-item{padding:10px 16px;justify-content:flex-start;border-left:4px solid transparent}.sidebar.collapsed .nav-popover .nav-item.active{border-left:4px solid #fff}.sidebar.collapsed .nav-popover .nav-text{display:block}.toggle-sidebar-btn{margin-top:auto;border-top:1px solid rgba(255,255,255,.1);color:#cbd5e1;background:#0000001a}.toggle-sidebar-btn:hover{background:#0003;color:#fff}.theme-toggle:hover{background:var(--menu-hover);opacity:1}.logout-btn{color:#fecaca}.logout-btn:hover{background:#0003;color:#fff}.pm-tabs{display:flex;gap:4px;padding:8px 16px 0;background:var(--bg-surface);border-bottom:1px solid var(--border-color);flex-shrink:0;overflow-x:auto}.pm-tab{background:none;border:none;border-bottom:3px solid transparent;padding:8px 14px;font-size:14px;font-family:Sarabun;color:var(--text-muted);cursor:pointer;white-space:nowrap}.pm-tab:hover{color:var(--text-main)}.pm-tab.active{color:var(--text-main);font-weight:600;border-bottom-color:#b91116}.content-area{flex:1;position:relative;display:flex;flex-direction:column;width:100%;overflow:hidden;background-image:url(https://i.postimg.cc/L407s7wK/782ff836-6ef7-4805-b832-5eacbf804075-removebg-preview.png);background-size:350px;background-repeat:no-repeat;background-position:center}.content-area:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--bg-main);opacity:.7;z-index:0;pointer-events:none;transition:background .3s}.page-wrapper{flex:1;width:100%;height:100%;overflow:hidden;display:flex;flex-direction:column;position:relative;z-index:1}.mobile-header{display:none;background:var(--sidebar-head);color:#fff;padding:12px 20px;align-items:center;justify-content:space-between;z-index:15;box-shadow:0 -2px 10px #00000026}.hamburger-btn{background:none;border:none;color:#fff;font-size:24px;cursor:pointer;display:flex;align-items:center}.sidebar-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:18;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;transition:.3s}.sidebar-overlay.open{display:block;opacity:1}.login-screen{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--bg-main);z-index:9999;display:flex;align-items:center;justify-content:center}.login-box{background:var(--login-box);padding:40px;border-radius:16px;box-shadow:0 10px 30px #0000001a;width:350px;max-width:90%;text-align:center;border:1px solid var(--login-border);transition:.3s}.login-box h3{margin-bottom:5px;font-weight:600}.login-box p{font-size:13px;color:var(--text-muted);margin-bottom:20px}.login-box input{width:100%;padding:12px 14px;margin-bottom:15px;border:1px solid #d1d5db;border-radius:8px;font-family:Sarabun;font-size:14px;background:transparent;color:var(--text-main);outline:none;transition:.2s}.login-box input:focus{border-color:#d9131a}.btn-login{width:100%;background:#d9131a;color:#fff;border:none;padding:12px;border-radius:8px;font-size:15px;cursor:pointer;font-weight:600;font-family:Sarabun;transition:.2s;margin-top:5px}.btn-login:hover{background:#b91116}.login-error{color:#dc2626;font-size:13px;margin-top:12px}.topbar{background:var(--bg-surface);border-bottom:1px solid var(--border-color);padding:10px 16px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);position:sticky;top:0;z-index:20;flex-shrink:0}.topbar select,.topbar input[type=text]{background:var(--input-bg);color:var(--text-main);border:1px solid var(--input-border);border-radius:7px;padding:6px 10px;font-size:13px;font-family:Sarabun}.topbar select:focus,.topbar input:focus{outline:none;border-color:#1d9e75}.btn{padding:7px 16px;border-radius:7px;border:1px solid var(--input-border);background:var(--bg-surface);color:var(--text-main);cursor:pointer;font-size:13px;font-weight:500;transition:.2s;font-family:Sarabun}.btn:hover{background:var(--bg-hover)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-green{background:#1d9e75;border-color:#1d9e75;color:#fff}.btn-green:hover{background:#178c65}.btn-red-fill{background:var(--ci-red);border-color:var(--ci-red);color:#fff}.btn-red-fill:hover{background:#b71c1c}.btn-outline-green{background:transparent;border-color:#1d9e75;color:#1d9e75}.btn-outline-green:hover{background:#1d9e751a}.btn-danger{background:#fee2e2;border-color:#fca5a5;color:#991b1b}.btn-danger:hover{background:#fecaca}.btn-sm{padding:4px 10px;font-size:12px}input[type=text],input[type=number],input[type=date],input[type=password],input[type=time],select,textarea{border:1px solid var(--input-border);border-radius:7px;padding:6px 10px;font-size:13px;font-family:Sarabun;background:var(--input-bg);color:var(--text-main);transition:.2s}input:focus,select:focus,textarea:focus{outline:none;border-color:#1d9e75;box-shadow:0 0 0 2px #1d9e751f}.tbl-wrap{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:10px;overflow:auto;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}table{width:100%;border-collapse:collapse}th{background:var(--bg-header);padding:8px 10px;text-align:left;font-size:11px;font-weight:600;color:var(--text-muted);border-bottom:1px solid var(--border-color);white-space:nowrap;transition:.3s}td{padding:7px 10px;font-size:13px;border-bottom:1px solid var(--border-light);vertical-align:middle;transition:background .1s}tr:last-child td{border-bottom:none}tr:hover td{background:var(--bg-hover)}.modal-bg{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:var(--modal-bg);z-index:100;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.modal-bg.open{display:flex}.modal{background:var(--bg-surface);border-radius:14px;border:1px solid var(--border-color);padding:20px 22px;width:580px;max-width:95vw;max-height:88vh;overflow-y:auto;box-shadow:0 8px 32px #0000001f;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:.3s}.modal-title{font-size:16px;font-weight:600;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--border-color);color:var(--text-main)}.modal-footer{display:flex;justify-content:flex-end;gap:8px;margin-top:16px;padding-top:14px;border-top:1px solid var(--border-color)}.badge{display:inline-block;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:600}.badge-active{background:#dcfce7;color:#166534}.badge-warn{background:#fef08a;color:#854d0e}.badge-neutral{background:var(--bg-header);color:var(--text-muted)}.toast{position:fixed;bottom:20px;right:20px;padding:10px 18px;border-radius:8px;font-size:13px;z-index:9999;color:#fff;box-shadow:0 4px 12px #00000026;transition:opacity .3s;white-space:pre-line}.toast-success{background:#1d9e75}.toast-error{background:#dc2626}.content{padding:14px 16px;overflow-y:auto;flex:1}.sgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-bottom:16px}.sc{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:10px;padding:12px 14px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:.3s}.sc-label{font-size:11px;color:var(--text-muted);margin-bottom:4px}.sc-val{font-size:20px;font-weight:600;color:var(--text-main)}.sc-sub{font-size:11px;color:var(--text-light);margin-top:2px}.sc.green .sc-val{color:var(--val-green)}.sc.card-clickable{cursor:pointer;position:relative}.sc.card-clickable:hover{transform:translateY(-3px);box-shadow:0 6px 12px #00000026;border-color:#1d9e75}.section-title{font-size:13px;font-weight:600;color:var(--text-title);margin-bottom:8px}.bar-wrap{display:flex;align-items:center;gap:8px}.bar{height:8px;border-radius:4px;background:#1d9e75;min-width:4px;transition:width .4s}.bar-label{font-size:11px;color:var(--text-muted);white-space:nowrap}.dash-stats-wrap{max-height:70vh}.dash-stats-wrap th{position:sticky;top:0;z-index:5;background:linear-gradient(var(--bg-header),var(--bg-header)),var(--bg-main);border-bottom-color:transparent;box-shadow:inset 0 -1px 0 var(--border-color)}@media print{.dash-stats-wrap{max-height:none!important;overflow:visible!important}.dash-stats-wrap th{position:static!important;box-shadow:none!important}.dash-stats-wrap th,.dash-stats-wrap td{font-size:9pt;padding:3px 4px}.dash-stats-wrap th{white-space:normal;line-height:1.25;vertical-align:bottom}.dash-stats-wrap th button{display:none!important}}.deduction-print-title{display:none}.deduction-report .dash-stats-wrap tfoot td{background:var(--bg-header);border-top:2px solid var(--border-color);padding:8px 10px}.deduction-report .dash-stats-wrap th:focus-visible{outline:2px solid var(--text-main);outline-offset:-2px}@media print{@page deduction-landscape{size:A4 landscape;margin:0}.deduction-report{page:deduction-landscape;padding:1cm!important;overflow:visible!important}.deduction-print-title{display:block;font-size:12pt;font-weight:700;margin:0 0 6px;color:#000}.deduction-report .dash-stats-wrap tfoot td{padding:3px 4px;font-size:9pt}.deduction-report tr{break-inside:avoid}}.bazi-page{--el-wood: #2e7d32;--el-fire: #d84315;--el-earth: #8d6e3f;--el-metal: #607d8b;--el-water: #1565c0}[data-theme=dark] .bazi-page{--el-wood: #66bb6a;--el-fire: #ff8a65;--el-earth: #d7b377;--el-metal: #b0bec5;--el-water: #64b5f6}.bazi-el-wood{color:var(--el-wood)}.bazi-el-fire{color:var(--el-fire)}.bazi-el-earth{color:var(--el-earth)}.bazi-el-metal{color:var(--el-metal)}.bazi-el-water{color:var(--el-water)}.bazi-bg-wood{background:var(--el-wood)}.bazi-bg-fire{background:var(--el-fire)}.bazi-bg-earth{background:var(--el-earth)}.bazi-bg-metal{background:var(--el-metal)}.bazi-bg-water{background:var(--el-water)}.bazi-banner{margin:0 0 12px;padding:10px 12px;border-radius:8px;font-size:13px;line-height:1.6;background:var(--bg-header);color:var(--text-main);border:1px solid var(--border-color)}.bazi-count{font-size:13px;color:var(--text-muted);margin-bottom:8px}.bazi-method{font-size:12px;color:var(--text-muted);margin-bottom:12px}.bazi-method summary{cursor:pointer;color:var(--text-main)}.bazi-method ul{margin:6px 0 0;padding-left:20px;line-height:1.7}.bazi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:12px}.bazi-card{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:10px}.bazi-card-head{display:flex;flex-direction:column;gap:2px;font-size:14px}.bazi-sub{font-size:12px;color:var(--text-muted);font-weight:400}.bazi-warn{padding:8px 10px;border-radius:8px;font-size:12px;line-height:1.6;background:var(--warn-bg);color:var(--warn-ink);border:1px solid var(--warn-line)}.bazi-master{font-size:13px}.bazi-case{display:flex;flex-direction:column;gap:8px;padding-top:8px;border-top:1px dashed var(--border-color)}.bazi-case-label{font-size:12px;font-weight:600;color:var(--warn-ink)}.bazi-pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.bazi-pillar{border:1px solid var(--border-color);border-radius:8px;padding:6px 4px;text-align:center;background:var(--bg-main)}.bazi-pillar-day{border:2px solid var(--text-main)}.bazi-pillar-label{font-size:12px;color:var(--text-muted);margin-bottom:2px}.bazi-char{font-size:28px;line-height:1.15;font-weight:600}.bazi-char-branch{color:var(--text-main)}.bazi-th{font-size:12px;color:var(--text-muted)}.bazi-bar{display:flex;height:14px;border-radius:7px;overflow:hidden;background:var(--border-light)}.bazi-seg{display:block;height:100%}.bazi-legend{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:6px;font-size:12px;color:var(--text-main)}.bazi-legend .bazi-zero{color:var(--text-light)}.bazi-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:4px;vertical-align:middle}.bazi-missing{margin-top:4px;font-size:12px;color:var(--text-muted)}.bazi-page{--net-green: var(--success-ink);--net-orange: #c2570c;--radar-s1: #6a1b9a;--radar-s2: #00838f;--radar-grid: var(--border-color);--radar-support: var(--text-muted);--radar-control: var(--text-light)}[data-theme=dark] .bazi-page{--net-orange: #ffa04d;--radar-s1: #ce93d8;--radar-s2: #4dd0e1}.bazi-radar{margin:0;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0}.bazi-radar-svg{width:100%;height:auto;display:block;overflow:visible}.bazi-radar-sm .bazi-radar-svg{max-width:250px}.bazi-radar-md .bazi-radar-svg{max-width:330px}.bazi-radar-ring{fill:none;stroke:var(--radar-grid);stroke-width:1}.bazi-radar-ring.outer{stroke-width:1.5}.bazi-radar-spoke{stroke:currentColor;stroke-width:1;opacity:.3}.bazi-radar-scale{font-size:9px;fill:var(--text-muted)}.bazi-radar-control line{stroke:var(--radar-control);stroke-width:.8;stroke-dasharray:3 3;opacity:.4}.bazi-radar-support path{fill:none;stroke:var(--radar-support);stroke-width:1.2;opacity:.6}.bazi-radar-arrowhead{fill:var(--radar-support)}.bazi-radar-label{font-size:14px;font-weight:600;fill:currentColor}.bazi-radar-star{font-size:14px}.bazi-radar-s1{--rc: var(--radar-s1)}.bazi-radar-s2{--rc: var(--radar-s2)}.bazi-radar-star,.bazi-radar-key{fill:var(--rc);stroke:var(--rc);stroke-width:0}.bazi-radar-key{stroke-width:2.5}.bazi-radar-key.dashed{stroke-dasharray:5 3}.bazi-radar-shape{fill:var(--rc);fill-opacity:.2;stroke:var(--rc);stroke-width:2;stroke-linejoin:round}.bazi-radar-series.dashed .bazi-radar-shape{fill-opacity:.06;stroke-dasharray:6 4}.bazi-radar-dot{fill:currentColor;stroke:var(--bg-surface);stroke-width:1.5}.bazi-radar-dot-missing{fill:var(--bg-surface);stroke:currentColor;stroke-width:1.5;stroke-dasharray:2 2}.bazi-radar-over{fill:var(--rc)}.bazi-radar-hit{fill:transparent;cursor:pointer}.bazi-radar-read{min-height:18px;font-size:12px;color:var(--text-main);text-align:center}.bazi-radar-legend{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 14px;justify-content:center;font-size:12px;color:var(--text-main)}.bazi-radar-legend li{display:inline-flex;align-items:center;gap:4px}.bazi-radar-note{display:flex;flex-wrap:wrap;gap:2px 12px;justify-content:center;font-size:11px;color:var(--text-muted)}@keyframes bazi-radar-in{0%{transform:scale(.35);opacity:0}to{transform:scale(1);opacity:1}}.bazi-radar-series.anim{transform-origin:130px 130px;animation:bazi-radar-in .45s ease-out both}@media (prefers-reduced-motion: reduce){.bazi-radar-series.anim{animation:none}}.bazi-branches{display:flex;flex-direction:column;gap:12px;min-width:0}.bazi-brgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}.bazi-brcard{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:8px;min-width:0}.bazi-brhead{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.bazi-brname{margin:0;font-size:16px}.bazi-link{border:0;background:none;padding:0;font:inherit;font-weight:700;color:var(--text-main);cursor:pointer;text-decoration:underline;text-underline-offset:3px}.bazi-brscore b{font-size:28px;line-height:1.1}.bazi-mbars{display:flex;gap:10px;align-items:flex-end;min-height:62px}.bazi-mbar{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:34px;font-size:12px}.bazi-mbar-bar{width:18px;border-radius:3px 3px 0 0;display:block}.bazi-mbar-n{color:var(--text-main);font-weight:600}.bazi-brdetail{display:flex;flex-direction:column;gap:10px;min-width:0}.bazi-brdetail-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.bazi-brtitle{margin:0;font-size:20px}.bazi-brcols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}.bazi-h3{margin:6px 0 2px;font-size:14px}.bazi-notes{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:8px;font-size:13px;line-height:1.6}.bazi-net{margin:0;display:flex;flex-direction:column;align-items:center;gap:6px}.bazi-net-svg{width:100%;max-width:520px;height:auto;display:block;overflow:visible}.bazi-net-ring{fill:none;stroke:var(--border-light);stroke-width:1}.bazi-net-line{stroke-linecap:round;fill:none}.bazi-net-hit{stroke:transparent;stroke-width:12;cursor:pointer}.bazi-net-edge.dim{opacity:.12}.bazi-net-green .bazi-net-line,line.bazi-net-green{stroke:var(--net-green);stroke-width:2}.bazi-net-orange .bazi-net-line,line.bazi-net-orange{stroke:var(--net-orange);stroke-width:3;stroke-dasharray:7 3}.bazi-net-uncertain .bazi-net-line,line.bazi-net-uncertain{stroke:var(--text-light);stroke-width:1.2;stroke-dasharray:2 3}.bazi-net-key{stroke-linecap:round}.bazi-net-dot{fill:var(--text-main);stroke:var(--bg-surface);stroke-width:2}.bazi-net-nodehit{fill:transparent;cursor:pointer}.bazi-net-node.on .bazi-net-dot{fill:var(--net-orange)}.bazi-net-label{font-size:12px;fill:var(--text-main);cursor:pointer}.bazi-net-node.on .bazi-net-label{font-weight:700}.bazi-net-legend{display:flex;flex-wrap:wrap;gap:4px 14px;justify-content:center;font-size:12px;color:var(--text-main)}.bazi-net-legend span{display:inline-flex;align-items:center;gap:4px}.bazi-move{border-top:1px dashed var(--border-color);padding-top:12px;display:flex;flex-direction:column;gap:8px}.bazi-moveform{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}.bazi-moveform label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--text-muted)}.bazi-mvrow{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;font-size:13px}.bazi-mvside{display:flex;flex-direction:column;gap:6px;min-width:0}.bazi-moveresult{display:flex;flex-direction:column;gap:12px}@media (max-width: 720px){.bazi-brcols,.bazi-brgrid{grid-template-columns:minmax(0,1fr)}}.bazi-manual{display:flex;flex-direction:column;gap:12px;min-width:0}.bazi-mform{display:flex;flex-direction:column;gap:10px}.bazi-mrow{border:1px solid var(--border-color);border-radius:10px;padding:8px 12px 12px;margin:0;min-width:0;background:var(--bg-surface)}.bazi-mrow legend{padding:0 6px}.bazi-mfields{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:flex-end}.bazi-mfields label{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--text-muted)}.bazi-mname input{width:190px;max-width:100%}.bazi-mdate,.bazi-mtime{display:flex;gap:6px}.bazi-mdate input,.bazi-mtime input{width:54px;text-align:center}.bazi-mdate label:nth-child(3) input{width:68px}.bazi-mfields input[aria-invalid=true]{border-color:var(--danger);outline:1px solid var(--danger)}.bazi-merr{margin:8px 0 0;padding:0;list-style:none;font-size:12px;color:var(--danger-ink, var(--danger));display:flex;flex-direction:column;gap:2px}.bazi-mactions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.bazi-msaved{border-top:1px dashed var(--border-color);padding-top:10px;display:flex;flex-direction:column;gap:6px}.bazi-mlists{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;font-size:13px}.bazi-mlists li{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center}.bazi-pillars-4{grid-template-columns:repeat(4,1fr)}.bazi-pillars-4 .bazi-char{font-size:24px}@media (max-width: 480px){.bazi-mname input{width:100%}.bazi-mname{flex:1 1 100%}.bazi-pillars-4{gap:4px}.bazi-pillars-4 .bazi-char{font-size:21px}}.bazi-trait-fold{border:1px solid var(--border-color);border-radius:8px;padding:6px 10px;background:var(--bg-main)}.bazi-trait-fold>summary{cursor:pointer;font-weight:600;font-size:13px;padding:2px 0}.bazi-traits{display:flex;flex-direction:column;gap:8px;margin-top:8px;font-size:13px;line-height:1.7}.bazi-trait-sec{border-top:1px dashed var(--border-color);padding-top:6px}.bazi-trait-case+.bazi-trait-case{margin-top:8px}.bazi-traitlab{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:6px}.bazi-traitlab .btn.on{background:var(--text-main);color:var(--bg-surface)}.bazi-trait-full{display:flex;flex-direction:column;gap:6px;border-top:1px dashed var(--border-color);padding-top:8px}.bazi-traitacc{margin:10px 0}.bazi-chartbar{display:flex;justify-content:flex-end}.bazi-chartbar .bazi-seg2 button{padding:3px 10px;font-size:12px}@media (max-width: 480px){.bazi-radar-sm .bazi-radar-svg{max-width:240px}.bazi-radar-note{font-size:10.5px}}.bazi-skipped{margin-top:20px}.bazi-tabs{display:flex;gap:4px;margin:0 0 12px;border-bottom:1px solid var(--border-color)}.bazi-tabs button{border:0;background:none;padding:8px 14px;font:inherit;font-size:14px;color:var(--text-muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}.bazi-tabs button.on{color:var(--text-main);border-bottom-color:var(--text-main);font-weight:600}.bazi-empty{text-align:center;padding:32px 12px;color:var(--text-muted);font-size:14px}.bazi-page{--cat-great-bg: #c8e6c9;--cat-good-bg: #e8f5e9;--cat-neutral-bg: #eceff1;--cat-caution-bg: #ffe0b2;--cat-avoid-bg: #ffcdd2;--cat-ink: #1b1b1b}[data-theme=dark] .bazi-page{--cat-great-bg: #1f5a2a;--cat-good-bg: #264a2c;--cat-neutral-bg: #333a3f;--cat-caution-bg: #6b4a12;--cat-avoid-bg: #6e2326;--cat-ink: #f3f4f6}.bazi-cat-great{background:var(--cat-great-bg);color:var(--cat-ink)}.bazi-cat-good{background:var(--cat-good-bg);color:var(--cat-ink)}.bazi-cat-neutral{background:var(--cat-neutral-bg);color:var(--cat-ink)}.bazi-cat-caution{background:var(--cat-caution-bg);color:var(--cat-ink)}.bazi-cat-avoid{background:var(--cat-avoid-bg);color:var(--cat-ink);font-weight:600}.bazi-cat-mixed{background:repeating-linear-gradient(135deg,var(--cat-neutral-bg) 0 6px,var(--bg-surface) 6px 12px);color:var(--cat-ink)}.bazi-cat-self{background:var(--bg-main);color:var(--text-light);text-align:center}.bazi-chip{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;border:1px solid var(--border-color)}.bazi-legend-bands{display:flex;flex-wrap:wrap;gap:6px}.bazi-heat-wrap{overflow:auto;max-height:70vh;border:1px solid var(--border-color);border-radius:10px;background:var(--bg-surface)}.bazi-heat{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%}.bazi-heat th,.bazi-heat td{padding:0;border-bottom:1px solid var(--border-light);border-right:1px solid var(--border-light);text-align:center;font-size:12px}.bazi-heat thead th{position:sticky;top:0;z-index:3;background:var(--bg-main);padding:6px 8px;white-space:nowrap;font-weight:600;color:var(--text-main)}.bazi-heat tbody th{position:sticky;left:0;z-index:2;background:var(--bg-main);padding:6px 10px;text-align:left;white-space:nowrap;font-weight:600;color:var(--text-main)}.bazi-heat .bazi-heat-corner{left:0;z-index:4}.bazi-heat td.bazi-cat-self{min-width:56px}.bazi-cell{display:block;width:100%;min-width:64px;padding:8px 6px;border:0;border-radius:0;font:inherit;font-size:12px;cursor:pointer;white-space:nowrap}.bazi-cell:hover{filter:brightness(.96)}.bazi-cell:focus-visible{outline:2px solid var(--text-main);outline-offset:-2px}.bazi-cell-on{box-shadow:inset 0 0 0 2px var(--text-main)}.bazi-glyph{margin-right:3px;opacity:.85}.bazi-panel{margin:14px 0;padding:14px;border:1px solid var(--border-color);border-radius:10px;background:var(--bg-surface)}.bazi-panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.bazi-persons{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px;margin-bottom:10px;font-size:13px}.bazi-dirs{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px}.bazi-dir{border:1px solid var(--border-light);border-radius:8px;padding:10px;display:flex;flex-direction:column;gap:8px}.bazi-dir-head{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;justify-content:space-between;font-size:14px}.bazi-combo{display:flex;flex-direction:column;gap:4px}.bazi-reasons{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;font-size:13px;line-height:1.5}.bazi-reasons li{display:flex;gap:8px;align-items:baseline}.bazi-rs{min-width:44px;text-align:right;font-weight:700;font-variant-numeric:tabular-nums}.bazi-rs-pos:before{content:"▲ ";font-size:10px}.bazi-rs-neg:before{content:"▼ ";font-size:10px}.bazi-total{font-size:13px;font-weight:600;padding-top:4px;border-top:1px dashed var(--border-color)}.bazi-lists{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin:16px 0 8px}.bazi-list ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.bazi-pairbtn{width:100%;display:grid;grid-template-columns:1fr auto;gap:2px 10px;align-items:baseline;text-align:left;padding:8px 10px;border-radius:8px;border:1px solid var(--border-color);font:inherit;font-size:13px;cursor:pointer}.bazi-pairbtn .bazi-sub{grid-column:1 / -1;color:inherit;opacity:.8}.bazi-viewbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 12px}.bazi-care .bazi-cell{min-width:84px;white-space:normal;line-height:1.3}.bazi-care-box{border:1px solid var(--border);border-radius:8px;padding:10px 12px;margin:8px 0;background:var(--bg-card, transparent)}.bazi-care-box h4{margin:0 0 6px;font-size:14px}.bazi-care-box ul{margin:0;padding-left:18px}.bazi-care-box li{margin:2px 0}.bazi-care-foot{margin-top:6px;font-size:12px;color:var(--text-muted)}.bazi-tip{margin-top:8px;padding:8px 10px;border:1px solid var(--border);border-radius:8px;font-size:13px}.bazi-summary{display:flex;flex-wrap:wrap;gap:8px 16px;margin:8px 0 4px;padding:8px 12px;border:1px solid var(--border);border-radius:8px;font-size:13px}.bazi-carebar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:6px 0}.bazi-care-form{border:1px solid var(--border);border-radius:8px;padding:10px 12px;margin:8px 0;display:flex;flex-direction:column;gap:8px}.bazi-field{display:flex;flex-direction:column;gap:4px;font-size:13px}.bazi-field textarea,.bazi-field select{width:100%;box-sizing:border-box}.bazi-field-err{color:var(--danger-ink, var(--danger));font-size:12px}.bazi-fieldset{border:1px solid var(--border);border-radius:8px;padding:6px 10px}.bazi-radio{margin-right:12px;font-size:13px}.bazi-care-form-actions{display:flex;gap:8px}.bazi-carelist{list-style:none;margin:8px 0;padding:0;display:flex;flex-direction:column;gap:10px}.bazi-careitem{border:1px solid var(--border);border-radius:8px;padding:10px 12px;display:flex;flex-direction:column;gap:6px;font-size:13px}.bazi-careitem-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.bazi-outcome{font-size:13px}.bazi-care-st-due{background:var(--st-warn-bg);color:var(--st-warn-ink)}.bazi-care-st-closed{opacity:.85}.bazi-lowconf{display:flex;flex-wrap:wrap;align-items:center;gap:4px}.bazi-modebar{display:flex;flex-direction:column;gap:8px;margin:0 0 12px}.bazi-seg2{display:inline-flex;border:1px solid var(--border-color);border-radius:8px;overflow:hidden;align-self:flex-start}.bazi-seg2 button{border:0;background:var(--bg-surface);color:var(--text-muted);padding:7px 14px;font:inherit;font-size:13px;cursor:pointer}.bazi-seg2 button+button{border-left:1px solid var(--border-color)}.bazi-seg2 button.on{background:var(--text-main);color:var(--bg-surface);font-weight:600}.bazi-switches{display:flex;flex-direction:column;gap:4px;font-size:13px;padding:8px 10px;border:1px dashed var(--border-color);border-radius:8px}.bazi-switches label{display:block;line-height:1.5}.bazi-new{display:inline-block;margin-right:6px;padding:0 6px;border-radius:4px;font-size:12px;font-weight:600;background:var(--warn-bg);color:var(--warn-ink);border:1px solid var(--warn-line)}.bazi-labelbox{display:flex;flex-direction:column;gap:4px;margin-bottom:10px;padding:8px 10px;border:1px solid var(--border-light);border-radius:8px}.bazi-labelrow{display:flex;flex-wrap:wrap;align-items:center;gap:6px}.bazi-lab.on{background:var(--text-main);color:var(--bg-surface);border-color:var(--text-main);font-weight:600}.bazi-labmark{font-weight:700}.bazi-fileops{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:8px 0}.bazi-wrong{margin-top:16px}.bazi-wronglist{margin:6px 0 0;padding-left:20px;font-size:13px;line-height:1.7}@media (max-width: 768px){.bazi-grid{grid-template-columns:1fr}}.monthly-tbl-wrap{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:10px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);position:relative;overflow:auto;flex:1}.monthly-table{width:100%;border-collapse:separate;border-spacing:0;min-width:1250px}.monthly-table th{position:sticky;top:0;z-index:15;background:var(--bg-header);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:10px;text-align:left;font-size:13px;font-weight:600;color:var(--text-muted);border-bottom:1px solid var(--border-color);white-space:nowrap}.monthly-table td{padding:8px 10px;border-bottom:1px solid var(--border-light);vertical-align:middle}.st-col-1{position:sticky;left:0;z-index:12;background:var(--bg-surface)!important;box-shadow:2px 0 5px #0000000d}.st-col-2{position:sticky;left:50px;z-index:12;background:var(--bg-surface)!important;box-shadow:2px 0 5px #0000000d}th.st-col-1,th.st-col-2{z-index:18;background:var(--bg-header)!important}.monthly-table tr:hover td{background:var(--bg-hover)}.monthly-table tr.row-focus td{background:#1d9e7526!important}.monthly-table tfoot td{position:sticky;bottom:0;z-index:16;background:var(--bg-header);border-top:2px solid var(--border-color);font-weight:700;color:#1d9e75;padding:12px 10px}.num-input{width:70px;border:1px solid var(--input-border);border-radius:5px;padding:4px 6px;font-size:13px;font-family:Sarabun;background:var(--input-bg);color:var(--text-main);text-align:right;transition:.2s}.num-input:focus{outline:none;border-color:#1d9e75;box-shadow:0 0 0 2px #1d9e7533}.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}.fg{display:flex;flex-direction:column;gap:4px}.fg.full{grid-column:1/-1}.fg label{font-size:12px;color:var(--text-muted);font-weight:500}.fg input,.fg select,.fg textarea{width:100%}.required{color:#dc2626}.err-msg{color:#dc2626;font-size:12px;margin-top:4px}.config-section{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:10px;overflow:hidden;margin-bottom:14px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:.3s}.section-head{background:var(--bg-header);padding:9px 14px;font-size:12px;font-weight:700;color:var(--text-main);border-bottom:1px solid var(--border-color);text-transform:uppercase;letter-spacing:.04em;display:flex;justify-content:space-between;align-items:center}.config-row{display:flex;align-items:center;padding:9px 14px;border-bottom:1px solid var(--border-light);gap:12px;transition:.3s}.config-row:last-child{border-bottom:none}.config-row:hover{background:var(--bg-hover)}.row-label{flex:1;font-size:13px;color:var(--text-main)}.row-desc{font-size:11px;color:var(--text-muted);margin-top:2px}.row-input{width:110px;flex-shrink:0}.row-input input{width:100%;text-align:right}.warning-box{background:var(--bg-warning);border:1px solid var(--border-warning);border-radius:8px;padding:10px 12px;font-size:12px;color:var(--text-warning);margin-bottom:14px;display:flex;gap:8px;align-items:flex-start}.app-layout .monthly-table td.net-col{color:var(--text-main);font-weight:700;font-variant-numeric:tabular-nums}.app-layout .monthly-table tr.row-focus td{background:linear-gradient(var(--st-neutral-bg),var(--st-neutral-bg)),linear-gradient(var(--bg-surface),var(--bg-surface)),var(--bg-main)!important}.app-layout .monthly-table tr.row-focus td.st-col-1{color:var(--text-main)}.app-layout .monthly-table .pay-items-badge{white-space:nowrap}.app-layout .monthly-table .net-col{position:sticky;right:0;border-left:1px solid var(--border-color);background:linear-gradient(var(--bg-surface),var(--bg-surface)),var(--bg-main)}.app-layout .monthly-table th.net-col{z-index:18;background:linear-gradient(var(--bg-header),var(--bg-header)),var(--bg-main)}.app-layout .monthly-table tbody td.net-col{z-index:12}.app-layout .monthly-table tfoot td.net-col{z-index:19}.app-layout .monthly-table tbody tr:hover td.net-col{background:linear-gradient(var(--bg-hover),var(--bg-hover)),linear-gradient(var(--bg-surface),var(--bg-surface)),var(--bg-main)}.app-layout .monthly-table.monthly-entry td.st-col-1,.app-layout .monthly-table.monthly-entry td.st-col-2,.app-layout .monthly-table.monthly-entry td.st-col-nick{background:linear-gradient(var(--bg-surface),var(--bg-surface)),var(--bg-main)!important;box-shadow:none}.app-layout .monthly-table.monthly-entry th.st-col-1,.app-layout .monthly-table.monthly-entry th.st-col-2,.app-layout .monthly-table.monthly-entry th.st-col-nick,.app-layout .monthly-table.monthly-entry tfoot td,.app-layout .monthly-table.monthly-entry tfoot td.st-col-1,.app-layout .monthly-table.monthly-entry tfoot td.foot-nick{background:linear-gradient(var(--bg-header),var(--bg-header)),var(--bg-main)!important;box-shadow:none}.app-layout .monthly-table.monthly-entry tr.row-focus td.st-col-1,.app-layout .monthly-table.monthly-entry tr.row-focus td.st-col-2,.app-layout .monthly-table.monthly-entry tr.row-focus td.st-col-nick{background:linear-gradient(var(--st-neutral-bg),var(--st-neutral-bg)),linear-gradient(var(--bg-surface),var(--bg-surface)),var(--bg-main)!important}.app-layout .monthly-table.monthly-entry td.st-col-2,.app-layout .monthly-table.monthly-entry th.st-col-2,.app-layout .monthly-table.monthly-entry tfoot td.st-col-1{border-right:1px solid var(--border-color)}.app-layout .monthly-table.monthly-entry .foot-short{display:none}.app-layout .monthly-table.monthly-entry .st-col-1{width:50px;min-width:50px;max-width:50px}.app-layout .monthly-table.monthly-entry th.st-col-2,.app-layout .monthly-table.monthly-entry td.st-col-2{width:160px;min-width:160px;max-width:160px;box-sizing:border-box}.app-layout .monthly-table.monthly-entry td.st-col-2 .name-clamp{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;overflow-wrap:anywhere}@media (max-width: 768px){.app-layout .monthly-table.monthly-entry .st-col-2{display:none}.app-layout .monthly-table.monthly-entry .st-col-1{width:44px;min-width:44px;max-width:44px;padding-left:6px;padding-right:6px}.app-layout .monthly-table.monthly-entry td.net-col,.app-layout .monthly-table.monthly-entry th.net-col{padding-left:6px;padding-right:6px}.app-layout .monthly-table.monthly-entry td.st-col-nick,.app-layout .monthly-table.monthly-entry th.st-col-nick{position:sticky;left:44px;width:72px;min-width:72px;max-width:72px;padding-left:6px;padding-right:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-right:1px solid var(--border-color)}.app-layout .monthly-table.monthly-entry td.st-col-nick{z-index:12}.app-layout .monthly-table.monthly-entry th.st-col-nick{z-index:18}.app-layout .monthly-table.monthly-entry tfoot td.foot-nick{position:sticky;left:44px;z-index:16;border-right:1px solid var(--border-color)}.app-layout .monthly-table.monthly-entry tfoot td.st-col-1{border-right:none}.app-layout .monthly-table.monthly-entry .foot-long{display:none}.app-layout .monthly-table.monthly-entry .foot-short{display:inline}}.app-layout{--ctl-h: 36px;--ctl-h-sm: 30px;--ctl-h-row: 28px;--ctl-h-row-btn: 26px;--ctl-radius: 8px;--ctl-radius-sm: 6px;--ctl-border: #818B9B;--ctl-border-hover: #5F6B7D;--ctl-disabled-bg: #EEF0F3;--ctl-disabled-ink: #5B6472;--ctl-disabled-border: #D5D9E0}[data-theme=dark] .app-layout{--ctl-border: #7B8494;--ctl-border-hover: #B0B7C3;--ctl-disabled-bg: #2A2D33;--ctl-disabled-ink: #9CA3AF;--ctl-disabled-border: #3A3E46}@media (max-width: 768px){.app-layout{--ctl-h: 40px;--ctl-h-sm: 34px}}.app-layout .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;box-sizing:border-box;min-height:var(--ctl-h);padding:0 14px;border-radius:var(--ctl-radius);border-color:var(--ctl-border);font-size:13px;line-height:1.25}.app-layout .btn-sm{min-height:var(--ctl-h-sm);padding:0 10px;border-radius:var(--ctl-radius-sm);font-size:12px}.app-layout .btn:focus-visible{outline:2px solid var(--brand-text);outline-offset:2px}.app-layout .btn:disabled,.app-layout .btn:disabled:hover{background:var(--ctl-disabled-bg);border-color:var(--ctl-disabled-border);color:var(--ctl-disabled-ink);opacity:1;cursor:not-allowed}.app-layout .btn[style*=background]:disabled{opacity:.5}.app-layout td .btn,.app-layout td .btn-sm{min-height:var(--ctl-h-row-btn);padding:0 10px;border-radius:var(--ctl-radius-sm);font-size:12px}.app-layout td input:is([type=text],[type=number],[type=date],[type=month],[type=password],[type=time],[type=search],[type=email],[type=tel],[type=url],[type=datetime-local]):not(.num-input),.app-layout td input:not([type]),.app-layout td select{height:var(--ctl-h-row);padding:0 8px;border-radius:var(--ctl-radius-sm)}.app-layout td input.num-input{height:var(--ctl-h-row)}.app-layout input:is([type=text],[type=number],[type=date],[type=month],[type=password],[type=time],[type=search],[type=email],[type=tel],[type=url],[type=datetime-local]):not(.num-input),.app-layout input:not([type]),.app-layout select{box-sizing:border-box;height:var(--ctl-h);padding:0 12px;border:1px solid var(--ctl-border);border-radius:var(--ctl-radius);font-size:13px}.app-layout textarea{box-sizing:border-box;min-height:72px;padding:8px 12px;border:1px solid var(--ctl-border);border-radius:var(--ctl-radius);font-size:13px;line-height:1.5}.app-layout input.num-input{box-sizing:border-box;height:var(--ctl-h-sm);padding:0 8px;border:1px solid var(--ctl-border);border-radius:var(--ctl-radius-sm)}.app-layout :is(input:is([type=text],[type=number],[type=date],[type=month],[type=password],[type=time],[type=search],[type=email],[type=tel],[type=url],[type=datetime-local]),input:not([type]),select,textarea):focus{border-color:var(--brand-text);box-shadow:0 0 0 2px var(--brand-tint)}.app-layout :is(input:is([type=text],[type=number],[type=date],[type=month],[type=password],[type=time],[type=search],[type=email],[type=tel],[type=url],[type=datetime-local]),input:not([type]),select,textarea):hover:not(:focus):not(:disabled){border-color:var(--ctl-border-hover)}.app-layout :is(input:is([type=text],[type=number],[type=date],[type=month],[type=password],[type=time],[type=search],[type=email],[type=tel],[type=url],[type=datetime-local]),input:not([type]),select,textarea):disabled{background:var(--ctl-disabled-bg);border-color:var(--ctl-disabled-border);color:var(--ctl-disabled-ink);-webkit-text-fill-color:var(--ctl-disabled-ink);opacity:1;cursor:not-allowed}.app-layout .topbar .topbar-toggle{display:none}.app-layout .topbar .topbar-tabs{order:-1}@media (max-width: 768px){.app-layout .topbar .topbar-toggle{display:inline-flex;align-items:center;gap:6px;width:100%;min-width:0;text-align:left}.app-layout .topbar .topbar-toggle-label{font-weight:600;flex-shrink:0}.app-layout .topbar .topbar-toggle-sum{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-muted);font-weight:400}.app-layout .topbar .topbar-toggle>.ic:last-child{margin-left:auto;flex-shrink:0}.app-layout .topbar.topbar-collapsed{flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 12px}.app-layout .topbar.topbar-collapsed>:not(.topbar-toggle):not(.topbar-keep):not(.topbar-tabs):not(.topbar-search){display:none!important}.app-layout .topbar.topbar-collapsed .topbar-toggle{flex:1 1 0;width:auto}.app-layout .topbar.topbar-collapsed>.topbar-keep{flex:0 0 auto;width:auto;white-space:nowrap}.app-layout .topbar.topbar-collapsed>.topbar-tabs{flex:1 1 100%}.app-layout .topbar.topbar-collapsed>.topbar-search{order:2;flex:1 1 100%;width:100%!important}}.app-layout{--sidebar-bg: #1c1c20;--sidebar-head: #141417;--menu-hover: rgba(255,255,255,.08);--menu-active: rgba(185,17,22,.34);--nav-accent: #F87171}[data-theme=dark] .app-layout{--sidebar-bg: #1a1a1a;--sidebar-head: #111111;--menu-hover: rgba(255,255,255,.08);--menu-active: rgba(185,17,22,.34);--nav-accent: #F87171}.app-layout .sidebar .nav-item.active,.app-layout .sidebar.collapsed .nav-item.active,.app-layout .sidebar.collapsed .nav-popover .nav-item.active{border-left-color:var(--nav-accent)}.app-layout .sidebar .nav-group-head.has-active{border-left-color:var(--nav-accent);background:#ffffff0d}.app-layout .ic{display:inline-block;vertical-align:-.17em;flex-shrink:0}.app-layout .sidebar .nav-search input{background:#2b2b31;color:#f3f4f6;border-color:#4a4a52}.app-layout .sidebar .nav-search{position:relative}.app-layout .sidebar .nav-search .ic{position:absolute;left:24px;top:50%;margin-top:-3px;color:#c4c8cf;pointer-events:none}.app-layout .sidebar .nav-search input{padding-left:32px}.app-layout .sidebar .nav-search input::placeholder{color:#c4c8cf}.app-layout .sidebar .nav-search input:focus{border-color:var(--nav-accent)}.app-layout .sidebar [tabindex]:focus-visible{outline:2px solid var(--nav-accent);outline-offset:-2px}.app-layout .sidebar .brand{display:grid;grid-template-columns:64px minmax(0,1fr);column-gap:10px;align-items:center;text-align:left;padding:12px 14px}.app-layout .sidebar .brand .logo-spin-3d{width:64px;margin:0;padding:4px;grid-row:1 / span 2;animation:none;transform:none;filter:none}.app-layout .sidebar .brand-title{font-size:13px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.app-layout .sidebar .brand-sub{margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (min-width: 769px){.app-layout .sidebar.collapsed .brand{display:block;padding:12px 0}.app-layout .sidebar.collapsed .brand .logo-spin-3d{width:40px;margin:0 auto}}.app-layout{--brand: #B91116;--brand-hover: #9A0E12;--brand-text: #B91116;--brand-tint: rgba(185,17,22,.08);--success: #15803D;--success-bg: #DCFCE7;--success-ink: #166534;--warn-bg: #FEF08A;--warn-ink: #854D0E;--transfer-orange-bg: #FFD8A8;--transfer-orange-ink: #7C2D12;--danger: #C2410C;--danger-bg: #FFEDD5;--danger-ink: #9A3412;--text-light: #667085;--bg-hover: rgba(0,0,0,.04);--tooltip-text: var(--success);--st-neutral-bg: #E5E7EB;--st-neutral-ink: #4B5563;--st-info-bg: #DBEAFE;--st-info-ink: #1E40AF;--st-sky-bg: #E0F2FE;--st-sky-ink: #075985;--st-amber-bg: #FCD34D;--st-amber-ink: #78350F;--st-violet-bg: #EDE9FE;--st-violet-ink: #5B21B6;--st-indigo-bg: #E0E7FF;--st-indigo-ink: #3730A3;--st-ok-bg: var(--success-bg);--st-ok-ink: var(--success-ink);--st-warn-bg: var(--warn-bg);--st-warn-ink: var(--warn-ink);--st-danger-bg: var(--danger-bg);--st-danger-ink: var(--danger-ink);--on-solid: #FFFFFF;--warn-solid: #B45309;--warn-line: #EAB308;--info-line: #3B82F6}[data-theme=dark] .app-layout{--brand: #B91116;--brand-hover: #D0151B;--brand-text: #F87171;--brand-tint: rgba(248,113,113,.12);--success: #4ADE80;--success-bg: rgba(74,222,128,.14);--success-ink: #4ADE80;--warn-bg: rgba(251,191,36,.16);--warn-ink: #FBBF24;--transfer-orange-bg: rgba(249,115,22,.22);--transfer-orange-ink: #FDBA74;--danger: #FB7C5A;--danger-bg: rgba(251,124,90,.14);--danger-ink: #FB7C5A;--text-light: #9ca3af;--st-neutral-bg: rgba(156,163,175,.18);--st-neutral-ink: #D1D5DB;--st-info-bg: rgba(96,165,250,.18);--st-info-ink: #93C5FD;--st-sky-bg: rgba(56,189,248,.16);--st-sky-ink: #7DD3FC;--st-amber-bg: rgba(251,146,60,.2);--st-amber-ink: #FDBA74;--st-violet-bg: rgba(167,139,250,.18);--st-violet-ink: #C4B5FD;--st-indigo-bg: rgba(129,140,248,.18);--st-indigo-ink: #A5B4FC}.app-layout .btn-green{background:var(--brand);border-color:var(--brand);color:#fff}.app-layout .btn-green:hover{background:var(--brand-hover)}.app-layout .btn-outline-green{background:transparent;border-color:var(--brand-text);color:var(--brand-text)}.app-layout .btn-outline-green:hover{background:var(--brand-tint)}.app-layout .btn-danger{background:transparent;border-color:var(--danger);color:var(--danger)}.app-layout .btn-danger:hover{background:var(--danger-bg)}.app-layout input:focus,.app-layout select:focus,.app-layout textarea:focus,.app-layout .topbar select:focus,.app-layout .topbar input:focus{border-color:var(--brand-text);box-shadow:0 0 0 2px var(--brand-tint)}.app-layout .num-input:focus{border-color:var(--brand-text);box-shadow:0 0 0 2px var(--brand-tint)}.app-layout .toast-success{background:#15803d}.app-layout .toast-error{background:#b91c1c}.app-layout .sc.card-clickable:hover{border-color:var(--brand-text)}.app-layout .bar{background:var(--brand-text)}.app-layout .monthly-table tfoot td{color:var(--text-title)}.app-layout .holiday-box{border-left-color:var(--success);background:var(--success-bg)}.app-layout .mark-danger:before{content:"▲ ";font-size:.65em;vertical-align:.18em}.app-layout .badge-active{background:var(--success-bg);color:var(--success-ink)}.app-layout .badge-warn{background:var(--warn-bg);color:var(--warn-ink)}.app-layout th,.app-layout .badge,.app-layout .sc-label,.app-layout .sc-sub,.app-layout .bar-label,.app-layout .row-desc{font-size:12px}.app-layout .sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.app-layout .required{color:var(--danger-ink)}.app-layout .badge-orange{background:var(--transfer-orange-bg);color:var(--transfer-orange-ink)}.app-layout .field-warn{font-size:12px;margin-top:2px;color:var(--transfer-orange-ink)}.app-layout .transfer-toggle{display:flex;gap:8px;flex-wrap:wrap}.app-layout .transfer-toggle button{flex:1 1 140px}.app-layout .transfer-toggle button[aria-pressed=true]{background:var(--brand-tint);border-color:var(--brand-text);color:var(--brand-text);font-weight:600}.app-layout .err-msg{color:var(--danger-ink)}.app-layout .emp-table td .badge,.app-layout .emp-table td.emp-actions{white-space:nowrap}.app-layout .emp-table td.emp-actions,.app-layout .emp-table th.emp-actions{position:sticky;right:0;border-left:1px solid var(--border-color)}.app-layout .emp-table td.emp-actions{z-index:2;background:linear-gradient(var(--bg-surface),var(--bg-surface)),var(--bg-main)}.app-layout .emp-table th.emp-actions{z-index:3;background:linear-gradient(var(--bg-header),var(--bg-header)),var(--bg-main)}.app-layout .emp-table tbody tr:hover td.emp-actions{background:linear-gradient(var(--bg-hover),var(--bg-hover)),linear-gradient(var(--bg-surface),var(--bg-surface)),var(--bg-main)}.app-layout .emp-modal .modal-footer{position:sticky;bottom:-20px;z-index:2;margin-bottom:-20px;padding-bottom:20px;background:linear-gradient(var(--bg-surface),var(--bg-surface)),var(--bg-main)}.payslip-layout{display:flex;gap:20px;height:calc(100vh - 57px);overflow:hidden;padding:16px}.emp-sidebar-list{width:280px;background:var(--bg-surface);border:1px solid var(--border-color);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;height:100%;flex-shrink:0}.list-header{padding:10px 16px;border-bottom:1px solid var(--border-color);background:var(--bg-header);display:flex;justify-content:space-between;align-items:center}.emp-list{flex:1;overflow-y:auto;padding:8px}.emp-item{display:flex;align-items:center;padding:8px 10px;border-radius:6px;cursor:pointer;margin-bottom:4px;border:1px solid transparent}.emp-item:hover{background:var(--bg-hover)}.emp-item input{margin-right:12px;width:16px;height:16px;accent-color:var(--ci-red);cursor:pointer;flex-shrink:0}.emp-item .e-name{font-weight:500;font-size:13px;color:var(--text-main)}.emp-item .e-branch{font-size:11px;color:var(--text-muted)}.preview-area{flex:1;background:#1e1e1ed9;border-radius:10px;overflow-y:auto;padding:20px}.ps-wrap{display:flex;flex-direction:column;gap:30px;align-items:center;width:100%;padding-bottom:40px}.ps-card-container{display:flex;flex-direction:column;align-items:flex-end;flex-shrink:0;margin-bottom:20px}.btn-download-img{background:#00b900;color:#fff;border:none;padding:6px 12px;border-radius:6px;cursor:pointer;font-size:13px;font-family:Sarabun;margin-bottom:8px;transition:.2s}.btn-download-img:hover{background:#009e00}.btn-line{background:#e8f5e9;color:#1b5e20;border:1px solid #4caf50;padding:6px 12px;border-radius:6px;cursor:pointer;font-size:13px;font-weight:500;font-family:Sarabun;margin-bottom:8px;margin-left:8px;transition:.2s}.btn-line:hover{background:#c8e6c9}.btn-line:disabled{opacity:.5;cursor:not-allowed}.slip{width:21cm;min-height:14.5cm;background:var(--bg-payslip);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--text-main);padding:1.5cm;box-shadow:0 4px 15px #0000000d;position:relative;border-radius:12px;border:1px solid var(--border-color);transition:.3s}.slip-header{text-align:center;margin-bottom:15px;border-bottom:2px solid var(--ci-red);padding-bottom:10px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:15px}.slip-logo{max-height:125px;width:auto;justify-self:start}.slip-title{font-size:18px;font-weight:700;color:var(--ci-red);margin-bottom:2px}.slip-subtitle{font-size:14px;color:var(--text-main)}.info-grid{display:grid;grid-template-columns:1fr 1fr;margin-bottom:15px;font-size:13px;gap:5px;background:var(--bg-header);border-radius:8px;padding:10px 14px;border:1px solid var(--border-color)}.info-row{display:flex}.info-lbl{width:100px;font-weight:600;color:var(--text-muted)}.info-val{color:var(--text-main)}.calc-grid{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--border-color);border-radius:8px;overflow:hidden;font-size:13px;margin-bottom:10px}.calc-col{border-right:1px solid var(--border-color)}.calc-col:last-child{border-right:none}.c-head{background:var(--bg-header);padding:6px 10px;font-weight:600;border-bottom:1px solid var(--border-color);text-align:center;color:var(--ci-red)}.c-body{min-height:180px;padding:10px}.c-row{display:flex;justify-content:space-between;margin-bottom:6px;font-size:14px;color:var(--text-main)}.c-val{font-family:Courier New,monospace;font-size:14px;font-weight:600}.c-foot{display:flex;justify-content:space-between;padding:8px 10px;font-weight:700;border-top:1px solid var(--border-color);color:var(--text-main)}.net-box{border:1px solid var(--ci-red);border-radius:8px;padding:12px;text-align:center;font-size:16px;font-weight:700;background:var(--ci-red);color:#fff;margin-bottom:10px}.extra-box{font-size:12px;margin-top:5px;padding:8px 12px;border-radius:6px;border:1px dashed var(--border-color);background:#00000005}.holiday-box{font-size:12px;color:var(--text-main);margin-top:5px;text-align:left;padding:5px 12px;border-radius:6px;border-left:3px solid #1D9E75;background:#1d9e7514;font-weight:500}.frozen-badge{font-size:12px;color:#1d4ed8;margin-bottom:10px;text-align:left;padding:6px 12px;border-radius:6px;border-left:3px solid #1d4ed8;background:#1d4ed814;font-weight:500}.list-lock-icon{margin-left:4px}.slip-footer{margin-top:25px;display:grid;grid-template-columns:1fr 1fr;text-align:center;font-size:12px;color:var(--text-muted);padding-top:15px;border-top:1px dashed var(--border-light)}.sign-line{margin-top:30px;border-top:1px dashed var(--text-light);width:60%;margin-left:auto;margin-right:auto;padding-top:5px}@media print{@page{size:A4 portrait;margin:0}body{background:#fff!important;color:#000;height:auto!important}.sidebar,.mobile-header,.login-screen{display:none!important}.app-layout{display:block!important;height:auto!important;overflow:visible!important}.content-area{height:auto!important;overflow:visible!important;display:block!important;background:none!important}.page-wrapper{height:auto!important;overflow:visible!important}.topbar,.emp-sidebar-list,.btn-download-img,.btn-line,.ps-card-container>div:first-child{display:none!important}.no-print{display:none!important}.payslip-layout{padding:0!important;height:auto!important;overflow:visible!important}.preview-area{background:none!important;padding:0!important;height:auto!important;overflow:visible!important;border-radius:0!important}.ps-wrap{display:block!important;padding:0!important}.ps-card-container{margin:0!important;page-break-inside:avoid!important;width:100%!important}.ps-card-container+.ps-card-container{page-break-before:always!important}.slip{background:#fff!important;border:none!important;border-radius:0!important;width:21cm!important;min-height:29.6cm!important;margin:0 auto!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}.slip-logo{max-height:70px!important}.slip-header,.info-grid{margin-bottom:10px!important}.slip-footer{margin-top:15px!important}.sign-line{margin-top:20px!important}.c-row{margin-bottom:3px!important}}@media (max-width: 768px){body{overflow:auto}.app-layout{flex-direction:column}.mobile-header{display:flex;position:fixed;bottom:0;left:0;width:100%;z-index:15}.content-area{padding-bottom:50px}.sidebar{position:fixed;top:0;left:-260px;height:100%;width:260px!important;z-index:20;transition:left .3s ease}.sidebar.open{left:0}.sidebar.collapsed .brand-title,.sidebar.collapsed .brand-sub,.sidebar.collapsed .nav-text{display:block}.sidebar.collapsed .logo-spin-3d{width:130px;margin-bottom:15px}.sidebar.collapsed .brand{padding:20px 16px}.sidebar.collapsed .nav-item,.sidebar.collapsed .theme-toggle,.sidebar.collapsed .logout-btn{padding:14px 20px;justify-content:flex-start}.toggle-sidebar-btn{display:none!important}.topbar{flex-direction:column;align-items:stretch}.topbar select,.topbar input,.topbar button{width:100%;margin:0!important}.fgrid{grid-template-columns:1fr}.payslip-layout{flex-direction:column;height:auto;overflow:visible}.emp-sidebar-list{width:100%;max-height:45vh}.preview-area{width:100%}.ps-card-container{transform:scale(.65);transform-origin:top center;margin:0 auto -120px}.calc-grid{grid-template-columns:1fr}.portal-slip-scale-outer{width:10.5cm;margin:0 auto;overflow:hidden}.portal-slip-scale-inner{transform:scale(.5);transform-origin:top left}}
