*{box-sizing:border-box}body{margin:0;font-family:Arial;background:#f4f6f8;color:#1f2937}header{background:#0f766e;color:#fff;padding:15px 24px;display:flex;gap:30px;align-items:center}nav{display:flex;gap:8px;flex-wrap:wrap}nav a{color:#fff;text-decoration:none;padding:7px 10px}.container,main{max-width:1200px;margin:25px auto;padding:0 18px}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.card,form{background:#fff;padding:18px;border-radius:9px;box-shadow:0 2px 8px #0001}.num{font-size:28px;font-weight:bold;margin-top:8px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.full{grid-column:1/-1}.fg{display:flex;flex-direction:column;gap:5px}input,select,textarea{padding:9px;border:1px solid #d1d5db;border-radius:6px}.btn{background:#0f766e;color:#fff;border:0;border-radius:6px;padding:10px 14px}.alert{background:#ecfdf5;padding:10px;margin:12px 0;border-radius:6px}.table{overflow:auto;margin-top:20px}table{width:100%;border-collapse:collapse;background:#fff}th,td{padding:10px;border-bottom:1px solid #e5e7eb;text-align:left}footer{text-align:center;padding:30px;color:#64748b}@media(max-width:700px){.grid,.form-grid{grid-template-columns:1fr}header{flex-direction:column;align-items:flex-start}}

.login-box h1{text-align:center;color:#0f766e}.login-box p{text-align:center}.error{background:#fef2f2;color:#991b1b}



/* LOGIN - layout khusus agar tidak melebar */
body.login-page{
    min-height:100vh;
    margin:0;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#f4f6f8;
}
body.login-page .login-box{
    width:380px !important;
    max-width:calc(100vw - 32px) !important;
    margin:0 !important;
    padding:28px !important;
    background:#fff;
    border-radius:12px;
    box-shadow:0 4px 20px rgba(0,0,0,.12);
}
body.login-page .login-box form{
    display:block !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}
body.login-page .login-box .fg{
    display:flex !important;
    flex-direction:column !important;
    width:100% !important;
    margin-bottom:14px;
    gap:6px;
}
body.login-page .login-box input{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    display:block !important;
    padding:11px !important;
    border:1px solid #d1d5db;
    border-radius:7px;
}
body.login-page .login-box button{
    width:100% !important;
}
body.login-page .login-box h1{
    text-align:center;
    color:#0f766e;
    margin-top:0;
}
body.login-page .login-box p{
    text-align:center;
}

.print-btn{display:inline-block;text-decoration:none;margin-left:8px;background:#2563eb}.btn-print-small{display:inline-block;text-decoration:none;background:#2563eb;padding:7px 10px;font-size:13px}