:root{--ink:#182230;--muted:#667085;--line:#e7e9ee;--canvas:#f8fafc;--surface:#fff;--brand:#09afea;--brand-dark:#4f46e5;--sidebar:#121826;--success:#039855;--warning:#dc6803;--danger:#d92d20;--radius:16px;--shadow:0 1px 2px #1018280a,0 8px 24px #1018280a}html[data-bs-theme="dark"]{--ink:#f5f7fa;--muted:#a7b0c0;--line:#2b3445;--canvas:#111827;--surface:#182230;--sidebar:#0b1120;--shadow:0 1px 2px #0003,0 8px 24px #0002}.app-shell{min-height:100vh;background:var(--canvas);color:var(--ink);display:flex}.app-main{min-width:0;flex:1;display:flex;flex-direction:column;margin-left:264px}.app-sidebar{position:fixed;z-index:1045;inset:0 auto 0 0;width:264px;background:var(--sidebar);color:#d0d5dd;display:flex;flex-direction:column;transition:transform .25s ease}.sidebar-brand{height:76px;padding:0 20px;border-bottom:1px solid #ffffff12;display:flex;align-items:center;justify-content:space-between}.brand-link{color:#fff;text-decoration:none;font-size:1rem;font-weight:700;display:flex;gap:10px;align-items:center}.brand-mark,.avatar{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#19e089,var(--brand));color:white;display:inline-grid;place-items:center;font-weight:800}.sidebar-label{padding:24px 20px 8px;color:#98a2b3;font-size:.69rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700}.sidebar-nav{padding:0 12px}.sidebar-link{color:#c7cedb;border:0;background:transparent;text-decoration:none;width:100%;display:flex;align-items:center;gap:12px;padding:11px 12px;margin:2px 0;border-radius:9px;font-size:.9rem;text-align:left;transition:background .2s,color .2s}.sidebar-link:hover{background:#ffffff0d;color:#fff}.sidebar-link.active{background:linear-gradient(135deg,#19e089,var(--brand));color:#fff;box-shadow:0 6px 14px #635bff3b}.sidebar-link i{font-size:1.1rem}.sidebar-footer{padding:16px 12px;margin-top:auto;border-top:1px solid #ffffff12}.sidebar-logout{color:#fda29b}.sidebar-logout:hover{background:#f044381a;color:#fda29b}.sidebar-backdrop{display:none}.topbar{height:76px;padding:0 32px;background:color-mix(in srgb,var(--surface) 94%,transparent);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;backdrop-filter:blur(12px);z-index:1020}.eyebrow{font-size:.69rem;color:var(--muted);text-transform:uppercase;font-weight:700;letter-spacing:.08em}.topbar-title{font-size:.94rem;font-weight:650}.btn-icon{width:40px;height:40px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);display:inline-grid;place-items:center}.btn-icon:hover{background:var(--canvas);border-color:#c7cbd4}.notification-dot{position:absolute;right:10px;top:9px;width:7px;height:7px;border:2px solid var(--surface);background:#f04438;border-radius:50%}.notification-menu{width:min(360px,calc(100vw - 24px));background:var(--surface);border-color:var(--line)}.notification-item{padding:12px 16px;display:flex;gap:10px;font-size:.86rem;border-bottom:1px solid var(--line)}.profile-button{border:0;background:none;color:var(--ink);display:flex;gap:9px;align-items:center;padding:4px}.profile-button strong,.profile-button small{display:block;font-size:.8rem;line-height:1.3}.profile-button small{color:var(--muted);font-size:.72rem}.content-wrapper{flex:1;padding:32px;max-width:1680px;width:100%;margin:auto}.app-footer{padding:18px 32px;border-top:1px solid var(--line);font-size:.78rem;color:var(--muted);display:flex;justify-content:space-between}.page-heading{margin-bottom:28px;display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.page-heading h1{font-size:1.65rem;letter-spacing:-.035em;margin:0 0 5px;font-weight:700}.page-heading p{color:var(--muted);margin:0}.app-card{border:1px solid var(--line);background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow)}.app-card .card-header{background:transparent;border-bottom:1px solid var(--line);padding:18px 20px}.app-card .card-body{padding:20px}.stat-card{padding:18px 20px;position:relative;overflow:hidden}.stat-card .stat-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:#eef2ff;color:var(--brand);font-size:1.2rem}.stat-card.success .stat-icon{background:#ecfdf3;color:var(--success)}.stat-card.warning .stat-icon{background:#fffaeb;color:var(--warning)}.stat-card.danger .stat-icon{background:#fef3f2;color:var(--danger)}.stat-label{color:var(--muted);font-size:.78rem;font-weight:600}.stat-value{font-size:1.5rem;font-weight:750;letter-spacing:-.04em}.section-title{font-size:1rem;font-weight:700;margin:0}.section-subtitle{font-size:.82rem;color:var(--muted)}.badge-soft{border-radius:999px;padding:5px 9px;font-size:.72rem;font-weight:650}.badge-pending{background:#fffaeb;color:#b54708}.badge-submitted{background:#eef4ff;color:#3538cd}.badge-approved,.badge-present{background:#ecfdf3;color:#027a48}.badge-rejected{background:#fef3f2;color:#b42318}.badge-progress{background:#f4f3ff;color:#5925dc}.task-row{padding:15px 0;border-bottom:1px solid var(--line)}.task-row:last-child{border:0}.task-name{color:var(--ink);font-weight:650;text-decoration:none}.task-name:hover{color:var(--brand)}.timeline{padding-left:18px;border-left:2px solid var(--line)}.timeline-item{position:relative;padding:0 0 20px 15px;color:var(--muted);font-size:.83rem}.timeline-item:before{content:"";position:absolute;width:10px;height:10px;border-radius:50%;background:var(--brand);left:-24px;top:4px;box-shadow:0 0 0 4px var(--surface)}.timeline-item strong{display:block;color:var(--ink);font-size:.86rem}.attendance-ring{width:136px;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--brand) calc(var(--progress)*1%),#eceef3 0);position:relative}.attendance-ring:after{content:"";position:absolute;inset:10px;border-radius:50%;background:var(--surface)}.attendance-ring span{z-index:1;font-size:1.35rem;font-weight:750}.table{--bs-table-bg:transparent;--bs-table-color:var(--ink);--bs-table-border-color:var(--line)}.table>thead{color:var(--muted);font-size:.73rem;text-transform:uppercase;letter-spacing:.04em}.table>:not(caption)>*>*{padding:15px 18px}.table tbody tr{transition:background .15s}.table tbody tr:hover{background:color-mix(in srgb,var(--brand) 4%,transparent)}.table-toolbar{padding:16px 20px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-bottom:1px solid var(--line)}.form-control,.form-select{border-color:var(--line);background:var(--surface);color:var(--ink);border-radius:9px;min-height:44px}.form-control:focus,.form-select:focus{border-color:var(--brand);box-shadow:0 0 0 .2rem #635bff20}.form-floating>label{color:var(--muted)}.btn{border-radius:9px;font-weight:600}.btn-primary{background:linear-gradient(135deg,#19e089,var(--brand));border-color:var(--brand)}.btn-primary:hover,.btn-primary:focus{background:var(--brand-dark);border-color:var(--brand-dark)}.btn-light{background:var(--surface);border-color:var(--line);color:var(--ink)}.upload-zone{border:1.5px dashed #b2b7c2;border-radius:12px;padding:26px;text-align:center;background:color-mix(in srgb,var(--brand) 3%,var(--surface));cursor:pointer}.upload-zone.dragover{border-color:var(--brand);background:#635bff12}.upload-zone input{position:absolute;inline-size:1px;block-size:1px;opacity:0}.empty-state{padding:44px 20px;text-align:center;color:var(--muted)}.empty-state i{font-size:2rem;display:block;margin-bottom:10px;color:#98a2b3}.app-alert{border-radius:12px;border:0;box-shadow:var(--shadow)}.login-page{min-height:100vh;background:radial-gradient(circle at 0 0,#ddd6fe,transparent 36%),var(--canvas);display:grid;place-items:center;padding:20px}.login-card{width:min(100%,440px);padding:34px;background:var(--surface);border:1px solid var(--line);border-radius:22px;box-shadow:0 20px 50px #10182818}.login-brand{display:flex;align-items:center;gap:10px;font-weight:750;margin-bottom:32px}.login-brand .brand-mark{width:38px;height:38px}.login-card h1{font-size:1.7rem;letter-spacing:-.04em}.fade-in{animation:fadeIn .35s ease both}@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media(max-width:991.98px){.app-main{margin-left:0}.app-sidebar{transform:translateX(-100%)}.app-sidebar.open{transform:translateX(0)}.sidebar-backdrop.show{position:fixed;z-index:1040;inset:0;background:#10182875;display:block}.topbar{padding:0 18px}.content-wrapper{padding:22px 18px}.app-footer{padding:16px 18px}.page-heading{margin-bottom:20px}}@media(max-width:575.98px){.content-wrapper{padding:18px 14px}.topbar{height:68px;padding:0 14px}.topbar-title{font-size:.82rem}.page-heading h1{font-size:1.35rem}.app-footer{font-size:.7rem}.table>thead{display:none}.responsive-table tbody,.responsive-table tr,.responsive-table td{display:block;width:100%}.responsive-table tr{padding:8px 0;border-bottom:1px solid var(--line)}.responsive-table td{border:0!important;padding:5px 16px!important}.responsive-table td:before{content:attr(data-label);display:inline-block;color:var(--muted);font-size:.72rem;width:90px;text-transform:uppercase}}