*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#f4f6f8;color:#1f2937}
.topbar{background:#123b63;color:#fff;padding:16px 5%;display:flex;justify-content:space-between;align-items:center;gap:15px}
.brand{font-weight:800;letter-spacing:.5px}.subbrand{font-size:12px;opacity:.8;margin-top:4px}
.container{max-width:1200px;margin:28px auto;padding:0 18px}
.hero{background:#fff;padding:28px;border-radius:14px;box-shadow:0 3px 15px #00000012;text-align:center}
.hero h1{margin:0 0 12px;font-size:28px}.meeting-info{display:flex;justify-content:center;gap:25px;color:#596579}
.dashboard{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:18px 0}
.stat,.card,.progress-box,.list-section{background:#fff;border-radius:14px;padding:20px;box-shadow:0 3px 15px #00000010}
.stat{text-align:center}.stat-label{font-size:12px;font-weight:700;color:#667085}.stat-number{font-size:38px;font-weight:800;margin:7px 0}.stat-small{font-size:13px;color:#667085}
.status-big{font-size:22px;font-weight:800;margin:14px 0}.quorum-ok{border:2px solid #1b8a4b}.quorum-ok .status-big{color:#1b8a4b}.quorum-no{border:2px solid #c0392b}.quorum-no .status-big{color:#c0392b}
.progress-box{margin-bottom:18px}.progress-head{display:flex;justify-content:space-between;margin-bottom:10px}.progress{height:15px;background:#e5e7eb;border-radius:99px;overflow:hidden}.progress div{height:100%;background:#1b8a4b}
.list-section{margin-bottom:18px}.section-title{display:flex;align-items:center;justify-content:space-between}.section-title h2{margin:0 0 14px;font-size:20px}.badge{background:#e8eef5;padding:5px 11px;border-radius:20px;font-weight:700}
.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse}th,td{padding:11px 10px;border-bottom:1px solid #e9edf2;text-align:left;font-size:14px}th{background:#f8fafc}
.btn{display:inline-block;border:0;border-radius:8px;padding:10px 14px;text-decoration:none;cursor:pointer;font-weight:700;font-size:13px}.btn-primary{background:#123b63;color:#fff}.btn-success{background:#1b8a4b;color:#fff}.btn-danger{background:#c0392b;color:#fff}.btn-light{background:#fff;color:#123b63}.btn-sm{padding:6px 9px}.full{width:100%;margin-top:15px}.back{display:block;margin-top:20px;color:#123b63;text-decoration:none}
.alert{padding:12px 15px;border-radius:9px;margin-bottom:16px}.success{background:#e8f7ee;color:#176b3b}.error{background:#fdecea;color:#9f2d24}
.card h2{margin-top:0}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}
label{display:block;font-weight:700;font-size:13px;margin:12px 0 6px}input,select{width:100%;padding:11px;border:1px solid #ccd3dc;border-radius:8px;background:#fff;font-size:14px}input[readonly]{background:#f1f3f5}.hint{font-size:12px;color:#667085}
.attendance-form{display:grid;grid-template-columns:2fr 1.2fr 1.2fr 1fr auto;gap:12px;align-items:end}.align-end{align-self:end}
.tag{display:inline-block;padding:5px 8px;border-radius:20px;font-size:12px;font-weight:700}.tag.hadir{background:#e8f7ee;color:#176b3b}.tag.izin{background:#fff5d9;color:#8a6200}.tag.sakit{background:#eaf2ff;color:#24558f}.tag.tanpa_keterangan{background:#fdecea;color:#9f2d24}
.empty{text-align:center;padding:20px;color:#667085}
.login-page{display:flex;min-height:100vh;align-items:center;justify-content:center;padding:20px}.login-card{background:#fff;padding:30px;border-radius:14px;box-shadow:0 5px 25px #0002;width:100%;max-width:420px}.login-card h1{margin-top:0}
footer{text-align:center;padding:25px;color:#667085;font-size:12px}
@media(max-width:850px){.dashboard,.admin-grid{grid-template-columns:1fr}.attendance-form{grid-template-columns:1fr}.topbar{align-items:flex-start;flex-direction:column}.meeting-info{flex-direction:column;gap:7px}}