*{box-sizing:border-box} :root{--navy:#123b70;--blue:#1e5da8;--pale:#edf4fc;--gold:#d7a642;--ink:#192b43;--muted:#6b7b8f;--line:#e0e8f1;--green:#18835a;--red:#bd3b42;--orange:#bd7618}body{margin:0;background:#f5f8fc;color:var(--ink);font-family:Tahoma,Arial,sans-serif;font-size:14px}header{background:linear-gradient(110deg,#102f58,#174c8b);color:#fff;padding:14px max(16px,env(safe-area-inset-left));display:flex;align-items:center;justify-content:space-between;gap:12px;position:sticky;top:0;z-index:5;box-shadow:0 3px 12px #102f5824}.brand{display:flex;align-items:center;gap:10px}.brand strong{display:block;font-size:16px}.brand small{display:block;opacity:.78;margin-top:4px}.logo{background:var(--gold);color:#142f50;font-size:24px;width:42px;height:42px;border-radius:13px;display:grid;place-items:center;font-weight:bold}button,input,select,textarea{font:inherit}button{border:0;cursor:pointer;border-radius:10px;padding:11px 14px;font-weight:700}.primary{background:var(--blue);color:#fff}.secondary{background:#e6eef8;color:var(--navy)}.ghost{background:#ffffff1b;color:inherit;border:1px solid #ffffff3b}nav{display:flex;gap:6px;padding:9px 12px;background:#fff;border-bottom:1px solid var(--line);overflow:auto;position:sticky;top:70px;z-index:4}nav button{white-space:nowrap;background:transparent;color:#63738a}nav button.active{background:var(--pale);color:var(--blue)}main{max-width:1080px;margin:auto;padding:18px 14px 30px}.page{display:none}.page.active{display:block}.pagehead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:4px 0 18px}.pagehead h1{font-size:23px;margin:0 0 6px}.pagehead p{margin:0;color:var(--muted)}.notice{padding:11px 13px;background:#eaf3ff;color:#24548c;border-radius:10px;margin-bottom:16px}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px}.metrics article,.panel{background:#fff;border:1px solid var(--line);border-radius:15px;padding:15px;box-shadow:0 4px 14px #183d6810}.metrics span{display:block;color:var(--muted);font-size:12px}.metrics b{display:block;font-size:27px;color:var(--navy);margin-top:9px}.panel{margin-bottom:14px}.panel h2{font-size:16px;margin:0 0 14px}.panelhead{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}.panelhead h2{margin:0}.muted{color:var(--muted);font-size:12px}.progressline{display:grid;grid-template-columns:110px 1fr 30px;align-items:center;gap:10px;margin:14px 0}.track{height:9px;background:#edf1f6;border-radius:9px;overflow:hidden}.track i{display:block;height:100%;width:0;background:var(--green);border-radius:9px}.track.orange i{background:var(--orange)}.track.red i{background:var(--red)}.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap}th,td{text-align:right;padding:12px 9px;border-bottom:1px solid var(--line)}th{font-size:12px;color:var(--muted);font-weight:700}td{font-size:13px}.pill{display:inline-block;border-radius:20px;padding:5px 9px;font-size:11px;font-weight:bold;background:#edf1f6}.pill.green{color:var(--green);background:#e5f6ee}.pill.orange{color:var(--orange);background:#fff2dc}.pill.red{color:var(--red);background:#fde9e9}.filters{display:flex;gap:8px;margin-bottom:13px}.filters input{flex:1}input,select,textarea{width:100%;border:1px solid #d7e1ec;border-radius:9px;padding:11px;background:#fff;color:var(--ink);min-width:0}label{display:block;font-size:12px;color:#52657b;font-weight:700}label input,label select,label textarea{display:block;margin-top:7px;font-weight:400}.cards{display:grid;gap:10px}.item{background:#fff;border:1px solid var(--line);border-radius:13px;padding:14px}.itemtop{display:flex;justify-content:space-between;gap:10px;align-items:start}.item h3{font-size:14px;margin:0 0 7px}.item p{margin:6px 0;color:#5f7085;line-height:1.6}.itemactions{display:flex;gap:7px;margin-top:12px;flex-wrap:wrap}.itemactions button{padding:9px 12px}.approve{background:#e2f5eb;color:#13744e}.reject{background:#fde8e8;color:#b8323c}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.full{grid-column:1/-1}.formnote{background:#f0f6fd;color:#254e7b;border-radius:9px;padding:10px;font-size:12px}.modal{position:fixed;inset:0;background:#071a32a6;z-index:10;display:grid;place-items:end center;padding:0}.modal.hidden{display:none}.modalbox{background:#f8fafc;border-radius:20px 20px 0 0;width:min(100%,650px);max-height:92vh;overflow:auto;padding:18px 16px calc(22px + env(safe-area-inset-bottom))}.modalhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.modalhead h2{margin:0;font-size:19px}.modalhead .ghost{color:#314760;background:#e7edf5}.reportgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}.report{background:#fff;border:1px solid var(--line);color:var(--navy);padding:20px 10px;text-align:right}.kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px}.kpi{padding:12px;background:#f4f7fb;border-radius:10px}.kpi span{display:block;color:var(--muted);font-size:12px}.kpi b{display:block;font-size:21px;margin-top:6px;color:var(--navy)}footer{text-align:center;padding:18px;color:#8190a2;font-size:11px}.small{line-height:1.7;margin-top:12px}@media(min-width:760px){.modal{place-items:center;padding:20px}.modalbox{border-radius:18px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:540px){.metrics{grid-template-columns:1fr 1fr}.metrics b{font-size:24px}.pagehead{align-items:flex-start}.pagehead h1{font-size:20px}.pagehead .primary{padding:10px;font-size:12px}.progressline{grid-template-columns:90px 1fr 25px;font-size:12px}.formgrid{grid-template-columns:1fr}.full{grid-column:auto}.reportgrid{grid-template-columns:1fr 1fr}.filters{flex-direction:column}nav{top:70px}.panelhead{align-items:flex-start;flex-direction:column}}
