:root{color:#1b2430;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#f4f7fb}*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button{align-items:center;border:0;cursor:pointer;display:inline-flex;gap:8px;justify-content:center}input,textarea,select{border:1px solid #d7dee8;border-radius:8px;min-height:42px;padding:10px 12px;width:100%}textarea{resize:vertical}label{color:#465365;display:grid;gap:7px;font-size:14px;font-weight:650;margin-bottom:14px}.auth-page{align-items:center;background:linear-gradient(135deg,#eef4ff,#f7faf4);display:flex;min-height:100vh;justify-content:center;padding:24px}.auth-card{background:#fff;border:1px solid #e3e9f1;border-radius:8px;box-shadow:0 22px 60px #2536501f;max-width:430px;padding:32px;width:100%}.auth-card h1{font-size:28px;margin:10px 0 8px}.auth-card p{color:#66758a;line-height:1.5;margin:0 0 24px}.auth-card button{width:100%;margin-top:12px}.auth-icon,.brand-mark{align-items:center;background:#0f766e;border-radius:8px;color:#fff;display:inline-flex;height:44px;justify-content:center;width:44px}.app-shell{display:grid;grid-template-columns:270px 1fr;min-height:100vh}.sidebar{background:#13212f;color:#fff;display:flex;flex-direction:column;padding:22px}.brand{align-items:center;display:flex;gap:12px;margin-bottom:28px}.brand span{color:#a7b5c7;display:block;font-size:13px;margin-top:2px}.sidebar nav{display:grid;gap:8px}.menu-group{display:flex;flex-direction:column}.menu-group-title{color:#7f8e9f;font-size:11px;font-weight:700;letter-spacing:.05em;margin-bottom:6px;margin-top:16px;text-transform:uppercase;padding-left:12px}.menu-group:first-child .menu-group-title{margin-top:0}.menu-group-items{display:grid;gap:8px}.sidebar button{background:transparent;border-radius:8px;color:#c6d2e0;justify-content:flex-start;min-height:42px;padding:10px 12px}.sidebar button.active,.sidebar button:hover{background:#213449;color:#fff}.logout{margin-top:auto}.content{min-width:0;padding:28px}.topbar{align-items:center;display:flex;gap:18px;justify-content:space-between;margin-bottom:24px}.topbar h1{font-size:30px;margin:0 0 6px}.topbar p{color:#66758a;margin:0}.toast,.notice,.error{border-radius:8px;padding:10px 12px}.toast{align-items:center;background:#e9f8f0;color:#11643c;display:flex;gap:8px}.notice{background:#ecf5ff;color:#175a9c;margin-bottom:14px}.error{background:#fff1f1;color:#a52828;margin-bottom:14px}.panel{background:#fff;border:1px solid #e3e9f1;border-radius:8px;padding:22px}.panel.narrow{max-width:720px}.panel h2{font-size:20px;margin:0 0 16px}.panel-header{align-items:center;display:flex;gap:16px;justify-content:space-between;margin-bottom:18px}.panel-header h2{margin-bottom:4px}.panel-header p,.empty{color:#66758a;margin:0}.grid-page{display:grid;gap:20px;grid-template-columns:minmax(0,1.5fr) minmax(340px,.8fr)}.search-box{align-items:center;background:#fff;border:1px solid #d7dee8;border-radius:8px;display:flex;flex:0 1 310px;gap:8px;padding:0 12px}.search-box input{border:0;min-height:40px;padding-left:0}.primary,.secondary{border-radius:8px;min-height:42px;padding:10px 16px}.primary{background:#0f766e;color:#fff}button:disabled{background:#cbd5e1;color:#94a3b8;cursor:not-allowed;opacity:.8}.secondary{background:#edf2f7;color:#26384d}.link{background:transparent;color:#0f766e;margin-top:8px;padding:0}.actions{display:flex;gap:10px;margin-top:8px}.table-wrap{overflow-x:auto}table{border-collapse:collapse;min-width:760px;width:100%}th,td{border-bottom:1px solid #edf1f6;padding:12px;text-align:left;vertical-align:top}th{color:#536277;font-size:13px;font-weight:750}.row-actions{white-space:nowrap;width:92px}.row-actions button{background:#edf2f7;border-radius:8px;color:#26384d;height:34px;margin-right:6px;width:34px}.badge,.status{border-radius:999px;display:inline-flex;font-size:12px;font-weight:750;padding:5px 9px}.badge{background:#edf2f7}.status.new{background:#fff4d7;color:#825300}.status.in_progress{background:#e5f1ff;color:#155a9b}.status.done{background:#e5f7ed;color:#11643c}@media(max-width:920px){.app-shell{grid-template-columns:1fr}.sidebar{position:static;padding:16px;flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px}.brand{margin-bottom:0}.sidebar nav{display:flex;flex-direction:row;flex-wrap:wrap;gap:6px;width:auto}.sidebar nav.menu-grouped{display:flex;flex-direction:row;flex-wrap:wrap;gap:12px}.menu-group{flex-direction:row;align-items:center;gap:6px}.menu-group-title{margin-top:0!important;margin-bottom:0;font-size:11px;background:#ffffff14;border-radius:4px;color:#e2e8f0;white-space:nowrap;padding:2px 6px}.menu-group-items{display:flex;flex-direction:row;flex-wrap:wrap;gap:6px}.sidebar button{padding:6px 12px;min-height:38px;font-size:13.5px}.logout{margin-top:0;padding:6px 12px;min-height:38px;font-size:13.5px;background:#ef44441a;color:#ef4444}.logout:hover{background:#ef4444;color:#fff}.grid-page{grid-template-columns:1fr}.panel-header,.topbar{align-items:stretch;flex-direction:column;gap:12px}.search-box{flex-basis:auto}}.modal-overlay{align-items:center;background:#0f172a99;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:9999}.modal-card{background:#fff;border-radius:12px;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;max-width:500px;padding:28px;position:relative;width:90%;animation:modalFadeIn .3s ease-out}@keyframes modalFadeIn{0%{transform:translateY(15px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-close{background:transparent;border-radius:6px;color:#64748b;cursor:pointer;padding:6px;position:absolute;right:16px;top:16px}.modal-close:hover{background:#f1f5f9;color:#1e293b}.modal-header{align-items:center;display:flex;gap:16px;margin-bottom:18px}.modal-header h3{font-size:20px;margin:0;color:#0f172a}.modal-icon-wrap{align-items:center;background:#fef3c7;border-radius:50%;color:#d97706;display:flex;height:48px;justify-content:center;width:48px}.bell-pulse{animation:bellPulse 1.8s infinite}@keyframes bellPulse{0%{transform:rotate(0)}10%{transform:rotate(15deg)}20%{transform:rotate(-15deg)}30%{transform:rotate(10deg)}40%{transform:rotate(-10deg)}50%{transform:rotate(0)}to{transform:rotate(0)}}.modal-body{color:#475569;font-size:15px;line-height:1.6}.modal-body p{margin:0 0 12px}.modal-tip{background:#f0fdf4;border-left:4px solid #16a34a;border-radius:0 8px 8px 0;color:#166534;font-size:13.5px;margin-top:18px;padding:12px}.modal-footer{display:flex;justify-content:flex-end;margin-top:24px}.modal-icon-wrap.success{background:#dcfce7;color:#15803d;flex:0 0 auto}.save-success-message{color:#166534;font-weight:600;margin:4px 0 0}.save-success-actions{gap:12px}.save-success-actions button{align-items:center;display:inline-flex;gap:8px;justify-content:center}@media(max-width:520px){.save-success-actions{flex-direction:column-reverse}.save-success-actions button{width:100%}}.dashboard-container{display:flex;flex-direction:column;gap:20px;margin-bottom:24px}.dashboard-title-bar{display:flex;align-items:center;justify-content:space-between}.dashboard-title-bar h2{font-size:22px;margin:0}.kpi-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.kpi-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;display:flex;align-items:center;gap:16px;padding:18px;box-shadow:0 1px 3px #0000000d;cursor:pointer;transition:transform .2s,box-shadow .2s}.kpi-card:hover{transform:translateY(-2px);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.kpi-icon{align-items:center;border-radius:8px;display:flex;height:48px;justify-content:center;width:48px}.kpi-card.total .kpi-icon{background:#eef2ff;color:#4f46e5}.kpi-card.new .kpi-icon{background:#fffbeb;color:#d97706}.kpi-card.in-progress .kpi-icon{background:#f0f9ff;color:#0284c7}.kpi-card.done .kpi-icon{background:#f0fdf4;color:#16a34a}.kpi-info h3{color:#64748b;font-size:13.5px;font-weight:600;margin:0 0 4px}.kpi-value{color:#0f172a;font-size:24px;font-weight:750;margin:0 0 2px}.kpi-sub{color:#64748b;font-size:12px}.text-success{color:#16a34a!important}.chart-grid{display:grid;gap:20px;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}.chart-card{display:flex;flex-direction:column}.chart-card h3{font-size:16px;color:#1e293b;margin:0 0 16px;font-weight:700}.chart-donut-container{align-items:center;display:flex;gap:24px;justify-content:space-between;flex:1}.chart-progress-bar-container{display:flex;flex-direction:column;flex:1}.progress-labels{display:flex;justify-content:space-between;font-size:13.5px;color:#475569;font-weight:550;margin-bottom:6px}.progress-bar-bg{background:#f1f5f9;border-radius:999px;height:8px;width:100%;overflow:hidden}.progress-bar-fill{border-radius:999px;height:100%;transition:width .6s ease}.progress-bar-fill.done{background:#16a34a}.progress-bar-fill.in-progress{background:#0284c7}.progress-bar-fill.new{background:#d97706}.mt-12{margin-top:12px}.mt-18{margin-top:18px}.mt-24{margin-top:24px}.svg-circle-chart{align-items:center;display:flex;flex-direction:column;justify-content:center;width:140px}.circular-chart{display:block;margin:0 auto;max-width:100%}.circle-bg{fill:none;stroke:#f1f5f9;stroke-width:2.8}.circle{fill:none;stroke:#16a34a;stroke-width:2.8;stroke-linecap:round;transition:stroke-dasharray .6s ease}.percentage{fill:#0f172a;font-family:inherit;font-size:8px;font-weight:700;text-anchor:middle}.circle-label{color:#64748b;font-size:12px;margin:6px 0 0;text-align:center}.employee-progress-list{display:flex;flex-direction:column;gap:12px;max-height:250px;overflow-y:auto;padding-right:4px}.employee-progress-row{display:flex;flex-direction:column;gap:6px}.emp-row-info{display:flex;justify-content:space-between;font-size:13.5px}.emp-row-name{font-weight:600;color:#1e293b}.emp-row-count{color:#64748b}.stacked-progress-bar{background:#f1f5f9;border-radius:999px;display:flex;height:8px;overflow:hidden;width:100%}.stacked-fill{height:100%}.stacked-fill.done{background:#16a34a}.stacked-fill.in-progress{background:#0284c7}.stacked-fill.new{background:#d97706}.filter-bar{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;display:flex;flex-wrap:wrap;gap:16px;padding:16px;align-items:flex-end;margin-top:14px}.filter-group{display:flex;gap:16px;flex:1 1 300px}.filter-item{display:flex;flex-direction:column;gap:6px;flex:1}.filter-label{align-items:center;color:#475569;display:flex;font-size:13px;font-weight:650;gap:6px;margin-bottom:0}.filter-select{background-color:#fff;border:1px solid #cbd5e1;border-radius:6px;color:#0f172a;font-size:14px;min-height:38px;padding:6px 10px}.filter-search{display:flex;flex-direction:column;gap:6px;flex:1 1 240px}.search-input-wrap{position:relative;width:100%}.search-icon{color:#94a3b8;left:12px;position:absolute;top:50%;transform:translateY(-50%)}.filter-search-input{background-color:#fff;border:1px solid #cbd5e1;border-radius:6px;font-size:14px;min-height:38px;padding:6px 10px 6px 36px!important}.text-nowrap{white-space:nowrap}.font-semibold{font-weight:600}.text-teal-dark{color:#0f766e}.description-cell{max-width:320px;word-break:break-word;white-space:pre-line}.flex-wrap{flex-wrap:wrap}@media(max-width:768px){.chart-grid{grid-template-columns:1fr}.chart-donut-container{flex-direction:column;gap:16px}.filter-group{flex-direction:column;width:100%}}