*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#eef4fa;color:#102a4c}.topbar{background:linear-gradient(110deg,#0b2d55,#1760a2);color:#fff;padding:16px max(18px,4vw);display:flex;align-items:center;justify-content:space-between;gap:18px;box-shadow:0 4px 14px #08294d33}.brand{display:flex;align-items:center;gap:12px}.brand img{width:46px;height:46px;object-fit:contain}.brand b{font-size:20px}.brand small{display:block;margin-top:4px;opacity:.86}.topbar nav{display:flex;gap:10px}.topbar a{color:#fff;text-decoration:none;padding:10px 14px;border:1px solid #ffffff55;border-radius:9px}.container{width:min(1220px,94%);margin:28px auto}.hero{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:20px}.hero h1{margin:0 0 7px;font-size:29px}.hero p{margin:0;color:#687b91}.tile-grid,.summary-grid,.unit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.tile{min-height:160px;padding:22px;border-radius:18px;color:#fff;text-decoration:none;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 10px 22px #102d4c22;transition:.18s}.tile:hover{transform:translateY(-3px)}.tile .icon{font-size:34px}.tile h3{font-size:20px;margin:10px 0 5px}.tile p{margin:0;opacity:.9}.t1{background:linear-gradient(135deg,#1472c5,#175e9d)}.t2{background:linear-gradient(135deg,#168c67,#23a875)}.t3{background:linear-gradient(135deg,#c46c12,#e89021)}.t4{background:linear-gradient(135deg,#7441b6,#9860d5)}.t5{background:linear-gradient(135deg,#07879a,#18a7b8)}.t6{background:linear-gradient(135deg,#cf3b4f,#e06373)}.t7{background:linear-gradient(135deg,#50627a,#71839a)}.t8{background:linear-gradient(135deg,#5741a7,#765ccc)}.summary-card,.unit-card{background:#fff;border-radius:16px;padding:20px;text-align:center;box-shadow:0 8px 20px #17395c18}.summary-card b{display:block;font-size:32px;color:#1564ae}.summary-card span{color:#60738a}.summary-card.green b{color:#159965}.summary-card.orange b{color:#e27b17}.summary-card.red b{color:#da3948}.summary-card.gray b{color:#607085}.summary-card.purple b{color:#7450bd}.panel{background:#fff;border-radius:18px;padding:22px;margin-bottom:22px;box-shadow:0 8px 22px #17395c16}.form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.field label{display:block;font-weight:700;font-size:13px;margin-bottom:7px}.field input,.field select,.field textarea{width:100%;border:1px solid #cdd9e6;border-radius:10px;padding:11px 12px;font:inherit;background:#fff}.field textarea{min-height:80px;resize:vertical}.span2{grid-column:span 2}.span3{grid-column:span 3}.actions{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}.btn{display:inline-block;border:0;border-radius:9px;padding:11px 16px;text-decoration:none;font-weight:700;cursor:pointer}.btn-primary{background:#175b9d;color:#fff}.btn-green{background:#168c67;color:#fff}.btn-light{background:#e8f0f8;color:#153d66}.btn-danger{background:#cf364a;color:#fff}.table-wrap{overflow:auto}.data-table{width:100%;border-collapse:collapse;min-width:900px}.data-table th{background:#123d69;color:#fff;text-align:left;padding:12px}.data-table td{padding:11px;border-bottom:1px solid #e3eaf1}.badge{padding:5px 9px;border-radius:99px;background:#e6edf5;font-size:12px;white-space:nowrap}.badge.on-track{background:#d9f5e8;color:#08754b}.badge.ongoing{background:#fff0d8;color:#9a5a00}.badge.attention{background:#fff0d8;color:#9a5a00}.badge.delayed{background:#ffe0e4;color:#a7192c}.badge.on-hold{background:#e6eaf0;color:#536274}.badge.completed{background:#e6def9;color:#573497}.unit-card{text-decoration:none;color:#102a4c;text-align:left}.unit-card h3{margin:0 0 5px}.unit-card .count{font-size:34px;font-weight:800;color:#1762a7;margin:14px 0}.flash{padding:13px 16px;border-radius:10px;margin-bottom:16px}.flash.success{background:#dff5e9;color:#136c48}.flash.error{background:#ffe2e6;color:#9b2031}.login-shell{min-height:100vh;display:grid;place-items:center;background:linear-gradient(120deg,#0b2d55,#225f99)}.login-box{width:min(450px,92vw);background:#fff;border-radius:22px;padding:34px;box-shadow:0 20px 50px #061a3070;text-align:center}.login-box input{width:100%;padding:13px;border:1px solid #cbd7e4;border-radius:10px;margin:10px 0 16px}.error{background:#ffe1e5;color:#9c1f31;padding:10px;border-radius:9px;margin:10px 0}footer{text-align:center;color:#718095;padding:24px}.empty{text-align:center;padding:30px;color:#738398}@media(max-width:900px){.tile-grid,.summary-grid,.unit-grid{grid-template-columns:repeat(2,1fr)}.form-grid{grid-template-columns:repeat(2,1fr)}.span3{grid-column:span 2}}@media(max-width:560px){.topbar{padding:13px}.brand b{font-size:16px}.brand small{font-size:11px}.topbar nav a:first-child{display:none}.container{width:94%;margin:18px auto}.hero{align-items:flex-start}.hero h1{font-size:23px}.tile-grid,.summary-grid,.unit-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.tile{min-height:128px;padding:15px;border-radius:14px}.tile .icon{font-size:27px}.tile h3{font-size:16px}.tile p{font-size:12px}.summary-card{padding:14px 8px}.summary-card b{font-size:26px}.summary-card span{font-size:12px}.form-grid{grid-template-columns:1fr}.span2,.span3{grid-column:span 1}.panel{padding:15px}.btn{padding:10px 12px}}

/* ===== First Upgrade: Premium Project Register ===== */
.projects-hero{background:linear-gradient(120deg,#ffffff 0%,#f4f8fd 100%);border:1px solid #dce7f2;border-radius:20px;padding:22px 24px;box-shadow:0 12px 30px rgba(19,56,92,.10)}
.projects-hero .eyebrow{display:inline-block;margin-bottom:7px;color:#1764aa;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.projects-hero h1{font-size:30px;letter-spacing:-.02em;color:#123d69}
.projects-hero p strong{color:#123d69}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap}
.projects-panel{padding:0;overflow:hidden;border:1px solid #dfe8f1;box-shadow:0 14px 34px rgba(21,57,91,.11)}
.table-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 22px;background:linear-gradient(180deg,#ffffff,#f8fbfe);border-bottom:1px solid #e2eaf2}
.table-toolbar h2{margin:0 0 5px;color:#123d69;font-size:20px}
.table-toolbar p{margin:0;color:#6b7f94;font-size:13px}
.table-search{display:flex;align-items:center;gap:10px;color:#536b82;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.table-search input{width:min(380px,32vw);border:1px solid #c9d8e6;border-radius:11px;padding:11px 13px;background:#fff;color:#173a5d;outline:none;box-shadow:inset 0 1px 2px rgba(13,44,73,.04)}
.table-search input:focus{border-color:#2a78bd;box-shadow:0 0 0 3px rgba(42,120,189,.13)}
.project-table-wrap{width:100%;max-width:none;overflow:auto;background:#fff}
.premium-project-table{min-width:1550px;width:100%;font-size:13px}
.premium-project-table thead th{position:sticky;top:0;z-index:2;background:linear-gradient(180deg,#153f6b,#0f345a);padding:13px 12px;letter-spacing:.02em;border-right:1px solid rgba(255,255,255,.09);white-space:nowrap}
.premium-project-table tbody tr:nth-child(even){background:#f8fbfe}
.premium-project-table tbody tr:hover{background:#edf6ff}
.premium-project-table td{padding:12px;border-bottom:1px solid #e5edf4;vertical-align:top;color:#24435f}
.premium-project-table .project-name-cell{min-width:210px;color:#123d69}
.premium-project-table .activity-column{min-width:260px}
.premium-project-table .activity-cell{min-width:260px;max-width:360px;white-space:normal;line-height:1.45;color:#173d60}
.premium-project-table .next-action-cell{min-width:230px;max-width:320px;white-space:normal;line-height:1.45}
.premium-project-table .date-cell{white-space:nowrap;font-weight:700;color:#355b7c}
.unit-pill{display:inline-flex;align-items:center;padding:5px 9px;border-radius:8px;background:#eaf2fb;color:#14558f;font-weight:800;white-space:nowrap}
.progress-cell{display:flex;align-items:center;gap:9px;min-width:132px}
.progress-track{width:82px;height:8px;background:#e3ebf3;border-radius:99px;overflow:hidden}
.progress-track span{display:block;height:100%;background:linear-gradient(90deg,#1f78bd,#20a875);border-radius:99px}
.progress-cell strong{min-width:34px;color:#173f65;font-size:12px}
.premium-project-table .badge{display:inline-flex;align-items:center;justify-content:center;min-width:78px;padding:6px 10px;font-weight:800;border:1px solid transparent}
.premium-project-table .badge.on-track{border-color:#bfe8d5}
.premium-project-table .badge.ongoing,.premium-project-table .badge.attention{border-color:#f1d29f}
.premium-project-table .badge.delayed{border-color:#f0bfc6}
.premium-project-table .badge.on-hold{border-color:#ccd3dc}
.premium-project-table .badge.completed{border-color:#d2c3f0}
@media(min-width:1350px){.container{width:calc(100% - 48px);max-width:none}.project-table-wrap{overflow-x:auto}}
@media(max-width:760px){.projects-hero{padding:18px}.projects-hero h1{font-size:24px}.hero-actions{width:100%}.hero-actions .btn{flex:1;text-align:center}.table-toolbar{align-items:stretch;flex-direction:column}.table-search{align-items:stretch;flex-direction:column;gap:6px}.table-search input{width:100%}.premium-project-table{font-size:12px}}
@media print{.topbar,.hero-actions,.table-toolbar,.logout,footer{display:none!important}.container{width:100%;margin:0}.projects-hero,.projects-panel{box-shadow:none;border:0}.project-table-wrap{overflow:visible}.premium-project-table{min-width:0;font-size:9px}.premium-project-table th,.premium-project-table td{padding:5px}.progress-track{display:none}}
