*{box-sizing:border-box}
body{margin:0;font-family:"Segoe UI",Arial,sans-serif;background:#f4f6f8;color:#172033;display:flex;min-height:100vh}
.login-overlay{position:fixed;inset:0;background:rgba(0,0,0,.9);display:flex;align-items:center;justify-content:center;z-index:20}
.login-card{background:#fff;width:430px;border-radius:18px;padding:28px;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.login-logo{width:220px;max-height:100px;object-fit:contain;background:#000;padding:8px;border-radius:10px}
.login-card h1{font-size:22px;margin:18px 0 4px;color:#151515}.login-card p{margin:0 0 20px;color:#666}.login-card label{display:block;text-align:left;margin-bottom:6px;font-weight:700}.login-card select{width:100%;margin-bottom:14px}.login-card button{width:100%;padding:12px}.login-card small{display:block;margin-top:14px;color:#777}
.sidebar{width:290px;background:#101010;color:#fff;padding:22px;display:flex;flex-direction:column;border-right:5px solid #f4b000}
.brand{display:flex;align-items:center;gap:12px;margin-bottom:30px}.brand img{width:78px;height:54px;object-fit:contain;background:#000;border-radius:8px}.brand h1{font-size:19px;margin:0;color:#f4b000}.brand p{margin:2px 0 0;color:#ddd;font-size:12px}
nav{display:flex;flex-direction:column;gap:8px}.nav-btn{text-align:left;border:0;padding:12px;background:transparent;color:#f5f5f5;border-radius:10px;cursor:pointer;font-size:14px}.nav-btn:hover,.nav-btn.active{background:#2b2b2b;color:#f4b000}
.version-box{margin-top:auto;background:#1e1e1e;border:1px solid #333;border-left:4px solid #f4b000;border-radius:10px;padding:12px;font-size:12px;display:flex;flex-direction:column;gap:5px;color:#ddd}.powered{margin-top:14px;font-size:11px;color:#aaa}
.app{flex:1;padding:22px;overflow:auto}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;gap:16px}.topbar h2{margin:0;font-size:27px;color:#101010}.topbar p{margin:5px 0 0;color:#64748b}.top-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
select,button,input{border:1px solid #d6dde5;border-radius:8px;padding:9px 10px;background:#fff}button{background:#101010;color:#fff;cursor:pointer;border:0;font-weight:600}button:hover{background:#333;color:#f4b000}.screen{display:none}.screen.active{display:block}
.notice{background:#fff7df;border-left:5px solid #f4b000;padding:12px 14px;border-radius:10px;margin-bottom:14px;color:#3b2b00}
.kpi-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-bottom:16px}.kpi{background:#fff;padding:16px;border-radius:14px;box-shadow:0 8px 24px rgba(15,23,42,.06);border-left:5px solid #f4b000}.kpi span{display:block;color:#64748b;font-size:12px}.kpi strong{font-size:26px;margin-top:8px;display:block;color:#101010}.risk-kpis{grid-template-columns:repeat(4,1fr)}
.dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:16px}.card{background:#fff;border-radius:14px;padding:16px;box-shadow:0 8px 24px rgba(15,23,42,.06)}.card.full{margin-bottom:16px}.card h3{margin:0 0 12px;color:#101010;font-size:16px;border-bottom:2px solid #f4b000;padding-bottom:8px}.muted{color:#64748b;margin-top:0}canvas{max-height:280px}
table{width:100%;border-collapse:collapse;font-size:13px}th{background:#101010;color:#f4b000;text-align:left}th,td{padding:10px;border-bottom:1px solid #eef2f6;vertical-align:top}tr:hover td{background:#fbfcfd}
.badge{display:inline-block;padding:4px 8px;border-radius:999px;font-size:12px;font-weight:700}.badge.ongoing{background:#e0f2fe;color:#075985}.badge.delayed{background:#fee2e2;color:#991b1b}.badge.completed{background:#dcfce7;color:#166534}.badge.cancelled{background:#f1f5f9;color:#475569}.badge.not-started{background:#fef9c3;color:#854d0e}
.profile{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.profile div{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:12px}.project-selector-bar{background:#f8fafc;border:1px dashed #cbd5e1;padding:10px;border-radius:10px;margin-bottom:12px;color:#475569}
.report-panel,.admin-actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}.report-output{background:#ffffff;color:#172033;padding:18px;border:1px solid #e2e8f0;border-left:5px solid #f4b000;border-radius:12px;min-height:180px;line-height:1.55}.report-output h4{margin:0 0 10px;color:#101010}.report-output ul{margin:8px 0 14px}.report-output .report-section{margin-bottom:16px}.validation{margin-top:12px;color:#101010}.overdue{color:#b91c1c;font-weight:800}
@media(max-width:1100px){.sidebar{width:225px}.kpi-grid{grid-template-columns:repeat(3,1fr)}.dashboard-grid{grid-template-columns:1fr}.profile{grid-template-columns:repeat(2,1fr)}}